/* Containers - page-level wrapperi */
.ot-container-s { width: 100%; max-width: 768px; margin: 0 auto; padding: 0 calc(var(--ot-spacing-m) * 2); }
.ot-container-m { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 calc(var(--ot-spacing-m) * 2); }
.ot-container-l { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 calc(var(--ot-spacing-m) * 2); }
.ot-container-full { width: 100%; padding: 0 calc(var(--ot-spacing-m) * 2); }

@media screen and (max-width: 900px)
{
    .ot-container-s,
    .ot-container-m,
    .ot-container-l,
    .ot-container-full
    {
        padding: 0 var(--ot-spacing-m);
    }
}

/* Grid - responsive auto layouts */
.ot-grid-auto-s { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--ot-spacing-s); }
.ot-grid-auto-m { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--ot-spacing-m); }
.ot-grid-auto-l { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--ot-spacing-m); }

/* Scrollbar - opt-in tanke skrol regije */
.ot-scrollbar { overflow: auto; scrollbar-width: thin; scrollbar-color: var(--ot-bg-4) var(--ot-bg-1); }
.ot-scrollbar::-webkit-scrollbar { width: 8px; height: 8px; }
.ot-scrollbar::-webkit-scrollbar-track { background: var(--ot-bg-1); }
.ot-scrollbar::-webkit-scrollbar-thumb { background: var(--ot-bg-4); border-radius: 4px; }
.ot-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--ot-bg-4-hover); }

/* Truncate - single line ellipsis */
.ot-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* Line clamp - multi-line ellipsis */
.ot-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ot-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ot-clamp-4 { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

/* Flex */

.ot-flex-vertical { display: flex; flex-direction: column; gap: var(--ot-spacing-l); }
.ot-flex-horizontal { display: flex; gap: var(--ot-spacing-l); }
.ot-flex-between { display: flex; align-items: center; justify-content: space-between; gap: var(--ot-spacing-m); }
.ot-flex-center { display: flex; align-items: center; justify-content: center; gap: var(--ot-spacing-m); }
.ot-flex-start { display: flex; align-items: center; gap: var(--ot-spacing-m); }
.ot-flex-end { display: flex; align-items: center; justify-content: flex-end; gap: var(--ot-spacing-m); }
.ot-flex-wrap { display: flex; flex-wrap: wrap; gap: var(--ot-spacing-m); }
.ot-flex-1 { flex: 1; min-width: 0; }

/* Gap overrides */

.ot-gap-0 { gap: 0; }
.ot-gap-x { gap: var(--ot-spacing-x); }
.ot-gap-s { gap: var(--ot-spacing-s); }
.ot-gap-m { gap: var(--ot-spacing-m); }
.ot-gap-l { gap: var(--ot-spacing-l); }
.ot-p-0 { padding: 0; }
.ot-p-x { padding: var(--ot-spacing-x); }
.ot-p-s { padding: var(--ot-spacing-s); }
.ot-p-m { padding: var(--ot-spacing-m); }
.ot-p-l { padding: var(--ot-spacing-l); }

.ot-px-0 { padding-left: 0; padding-right: 0; }
.ot-px-x { padding-left: var(--ot-spacing-x); padding-right: var(--ot-spacing-x); }
.ot-px-s { padding-left: var(--ot-spacing-s); padding-right: var(--ot-spacing-s); }
.ot-px-m { padding-left: var(--ot-spacing-m); padding-right: var(--ot-spacing-m); }
.ot-px-l { padding-left: var(--ot-spacing-l); padding-right: var(--ot-spacing-l); }

.ot-py-0 { padding-top: 0; padding-bottom: 0; }
.ot-py-x { padding-top: var(--ot-spacing-x); padding-bottom: var(--ot-spacing-x); }
.ot-py-s { padding-top: var(--ot-spacing-s); padding-bottom: var(--ot-spacing-s); }
.ot-py-m { padding-top: var(--ot-spacing-m); padding-bottom: var(--ot-spacing-m); }
.ot-py-l { padding-top: var(--ot-spacing-l); padding-bottom: var(--ot-spacing-l); }

.ot-pt-0 { padding-top: 0; }
.ot-pt-x { padding-top: var(--ot-spacing-x); }
.ot-pt-s { padding-top: var(--ot-spacing-s); }
.ot-pt-m { padding-top: var(--ot-spacing-m); }
.ot-pt-l { padding-top: var(--ot-spacing-l); }

.ot-pr-0 { padding-right: 0; }
.ot-pr-x { padding-right: var(--ot-spacing-x); }
.ot-pr-s { padding-right: var(--ot-spacing-s); }
.ot-pr-m { padding-right: var(--ot-spacing-m); }
.ot-pr-l { padding-right: var(--ot-spacing-l); }

.ot-pb-0 { padding-bottom: 0; }
.ot-pb-x { padding-bottom: var(--ot-spacing-x); }
.ot-pb-s { padding-bottom: var(--ot-spacing-s); }
.ot-pb-m { padding-bottom: var(--ot-spacing-m); }
.ot-pb-l { padding-bottom: var(--ot-spacing-l); }

.ot-pl-0 { padding-left: 0; }
.ot-pl-x { padding-left: var(--ot-spacing-x); }
.ot-pl-s { padding-left: var(--ot-spacing-s); }
.ot-pl-m { padding-left: var(--ot-spacing-m); }
.ot-pl-l { padding-left: var(--ot-spacing-l); }

.ot-m-0 { margin: 0; }
.ot-m-auto { margin: auto; }
.ot-m-x { margin: var(--ot-spacing-x); }
.ot-m-s { margin: var(--ot-spacing-s); }
.ot-m-m { margin: var(--ot-spacing-m); }
.ot-m-l { margin: var(--ot-spacing-l); }

.ot-mx-0 { margin-left: 0; margin-right: 0; }
.ot-mx-auto { margin-left: auto; margin-right: auto; }
.ot-mx-x { margin-left: var(--ot-spacing-x); margin-right: var(--ot-spacing-x); }
.ot-mx-s { margin-left: var(--ot-spacing-s); margin-right: var(--ot-spacing-s); }
.ot-mx-m { margin-left: var(--ot-spacing-m); margin-right: var(--ot-spacing-m); }
.ot-mx-l { margin-left: var(--ot-spacing-l); margin-right: var(--ot-spacing-l); }

.ot-my-0 { margin-top: 0; margin-bottom: 0; }
.ot-my-auto { margin-top: auto; margin-bottom: auto; }
.ot-my-x { margin-top: var(--ot-spacing-x); margin-bottom: var(--ot-spacing-x); }
.ot-my-s { margin-top: var(--ot-spacing-s); margin-bottom: var(--ot-spacing-s); }
.ot-my-m { margin-top: var(--ot-spacing-m); margin-bottom: var(--ot-spacing-m); }
.ot-my-l { margin-top: var(--ot-spacing-l); margin-bottom: var(--ot-spacing-l); }

.ot-mt-0 { margin-top: 0; }
.ot-mt-auto { margin-top: auto; }
.ot-mt-x { margin-top: var(--ot-spacing-x); }
.ot-mt-s { margin-top: var(--ot-spacing-s); }
.ot-mt-m { margin-top: var(--ot-spacing-m); }
.ot-mt-l { margin-top: var(--ot-spacing-l); }

.ot-mr-0 { margin-right: 0; }
.ot-mr-auto { margin-right: auto; }
.ot-mr-x { margin-right: var(--ot-spacing-x); }
.ot-mr-s { margin-right: var(--ot-spacing-s); }
.ot-mr-m { margin-right: var(--ot-spacing-m); }
.ot-mr-l { margin-right: var(--ot-spacing-l); }

.ot-mb-0 { margin-bottom: 0; }
.ot-mb-auto { margin-bottom: auto; }
.ot-mb-x { margin-bottom: var(--ot-spacing-x); }
.ot-mb-s { margin-bottom: var(--ot-spacing-s); }
.ot-mb-m { margin-bottom: var(--ot-spacing-m); }
.ot-mb-l { margin-bottom: var(--ot-spacing-l); }

.ot-ml-0 { margin-left: 0; }
.ot-ml-auto { margin-left: auto; }
.ot-ml-x { margin-left: var(--ot-spacing-x); }
.ot-ml-s { margin-left: var(--ot-spacing-s); }
.ot-ml-m { margin-left: var(--ot-spacing-m); }
.ot-ml-l { margin-left: var(--ot-spacing-l); }

.ot-gap-0 { gap: 0; }
.ot-gap-x { gap: var(--ot-spacing-x); }
.ot-gap-s { gap: var(--ot-spacing-s); }
.ot-gap-m { gap: var(--ot-spacing-m); }
.ot-gap-l { gap: var(--ot-spacing-l); }
*,
*::before,
*::after
{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html
{
	height: 100%;
	scroll-behavior: smooth;
	font-size: 100%;
	tab-size: 4;
}

body
{
	min-height: 100vh;
	font-family: var(--ot-font-primary), system-ui, sans-serif;
	font-size: var(--ot-size-m);
	line-height: 1.5;
	color: var(--ot-text-1);
	background: var(--ot-bg-1);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

:focus-visible
{
	outline: 2px solid var(--ot-brand);
	outline-offset: 2px;
}

:focus:not(:focus-visible)
{
	outline: none;
}

h1, h2, h3, h4, h5, h6
{
	font-family: var(--ot-font-secondary), Georgia, serif;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

h1 { font-size: 3rem; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

p
{
	line-height: 1.6;
	color: var(--ot-text-2);
}

@media screen and (max-width: 768px)
{
	html { font-size: 95%; }
	h1 { line-height: 1.05; }
	p { line-height: 1.5; }
}

@media screen and (max-width: 480px)
{
	html { font-size: 90%; }
	h1 { line-height: 1.05; }
	p { line-height: 1.4; }
}

small
{
	font-size: 0.875em;
}

a
{
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

img,
picture,
video,
canvas,
svg
{
	display: block;
	max-width: 100%;
	height: auto;
}

button,
input,
optgroup,
select,
textarea
{
	font: inherit;
	color: inherit;
	line-height: inherit;
}

button
{
	cursor: pointer;
	background: none;
	border: none;
}

ul, ol
{
	list-style: none;
}

table
{
	border-collapse: collapse;
	width: 100%;
}

i
{
	font-family: 'Material Symbols Rounded';
	font-weight: normal;
	font-style: normal;
	font-size: 20px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	color: inherit;
	-webkit-font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
	font-variation-settings: 'opsz' 24, 'wght' 300, 'FILL' 0, 'GRAD' 0;
}

*
{
	scrollbar-width: thin;
	scrollbar-color: var(--ot-bg-3) transparent;
}

::-webkit-scrollbar
{
	width: 6px;
	height: 6px;
}

::-webkit-scrollbar-track
{
	background: transparent;
}

::-webkit-scrollbar-thumb
{
	background: var(--ot-bg-3);
	border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover
{
	background: var(--ot-bg-4);
}

@media print
{
	body { background: #fff; color: #000; }
	a { color: #000; text-decoration: underline; }
	@page { margin: 2cm; }
}

hr 
{
	border: 1px solid var(--ot-bg-1-border);
}

hr.bg-2
{
	border: 1px solid var(--ot-bg-2-border);
}

hr.bg-3
{
	border: 1px solid var(--ot-bg-3-border);
}

hr.bg-4
{
	border: 1px solid var(--ot-bg-4-border);
}
:root
{
    --ot-spacing-x: 4px;
    --ot-spacing-s: 8px;
    --ot-spacing-m: 16px;
    --ot-spacing-l: 32px;

    --ot-radius-s: 4px;
    --ot-radius-m: 8px;
    --ot-radius-l: 12px;

    --ot-height-x: 18px;
    --ot-height-s: 28px;
    --ot-height-m: 34px;
    --ot-height-l: 44px;

    --ot-size-s: 11px;
    --ot-size-m: 13px;
    --ot-size-l: 22px;

    --ot-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ot-font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --ot-bg-1: rgba(29, 29, 31, 1);
    --ot-bg-1-border: rgba(43, 43, 45, 1);
    --ot-bg-1-opacity: rgba(29, 29, 31, 0.85);
    --ot-bg-1-hover: rgba(33, 33, 35, 1);

    --ot-bg-2: rgba(34, 34, 36, 1);
    --ot-bg-2-border: rgba(48, 48, 50, 1);
    --ot-bg-2-opacity: rgba(34, 34, 36, 0.85);
    --ot-bg-2-hover: rgba(38, 38, 40, 1);

    --ot-bg-3: rgba(39, 39, 41, 1);
    --ot-bg-3-border: rgba(53, 53, 55, 1);
    --ot-bg-3-opacity: rgba(39, 39, 41, 0.85);
    --ot-bg-3-hover: rgba(43, 43, 45, 1);

    --ot-bg-4: rgba(44, 44, 46, 1);
    --ot-bg-4-border: rgba(58, 58, 60, 1);
    --ot-bg-4-opacity: rgba(44, 44, 46, 0.85);
    --ot-bg-4-hover: rgba(48, 48, 50, 1);

    --ot-text-1: rgb(237, 233, 233);
    --ot-text-2: rgb(161, 153, 153);
    --ot-text-3: rgb(131, 130, 130);

    --ot-brand: rgba(226, 112, 85, 1);
    --ot-brand-border: rgba(236, 142, 120, 1);
    --ot-brand-opacity: rgba(226, 112, 85, 0.12);
    --ot-brand-hover: rgba(206, 92, 65, 1);

    --ot-blue: rgba(56, 189, 248, 1);
    --ot-blue-border: rgba(125, 211, 252, 1);
    --ot-blue-opacity: rgba(56, 189, 248, 0.12);
    --ot-blue-hover: rgba(14, 165, 233, 1);

    --ot-red: rgba(244, 63, 94, 1);
    --ot-red-border: rgba(251, 113, 133, 1);
    --ot-red-opacity: rgba(244, 63, 94, 0.12);
    --ot-red-hover: rgba(225, 29, 72, 1);

    --ot-orange: rgba(251, 146, 60, 1);
    --ot-orange-border: rgba(253, 186, 116, 1);
    --ot-orange-opacity: rgba(251, 146, 60, 0.12);
    --ot-orange-hover: rgba(249, 115, 22, 1);

    --ot-green: rgba(52, 211, 153, 1);
    --ot-green-border: rgba(110, 231, 183, 1);
    --ot-green-opacity: rgba(52, 211, 153, 0.12);
    --ot-green-hover: rgba(16, 185, 129, 1);

    --ot-transition-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1);
    --ot-transition: 180ms cubic-bezier(0.4, 0, 0.2, 1);
    --ot-transition-slow: 280ms cubic-bezier(0.4, 0, 0.2, 1);

    --ot-shadow-s: 0 1px 2px rgba(0, 0, 0, 0.2);
    --ot-shadow-m: 0 4px 12px rgba(0, 0, 0, 0.25);
    --ot-shadow-l: 0 12px 32px rgba(0, 0, 0, 0.35);

    --ot-blur: blur(12px) saturate(180%);
}

@media screen and (max-width: 900px)
{
    :root
    {
        --ot-spacing-l: 16px;
    }
}
.ot-overlay
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 100000;
}

.ot-overlay > .backdrop
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000000;
	pointer-events: auto;
}

.ot-overlay > .content
{
	position: absolute;
	pointer-events: auto;
}

.ot-overlay.ot-modal > .content
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.ot-tooltip
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: var(--ot-bg-3);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-1);
	font-size: var(--ot-size-s);
	max-width: 280px;
	white-space: normal;
}

.ot-tooltip > .icon
{
	font-size: 16px;
	color: var(--ot-text-2);
}

.ot-tooltip > .content > .title
{
	font-weight: 600;
	margin-bottom: 2px;
}

.ot-tooltip > .content > .text
{
	color: var(--ot-text-2);
}

.ot-tooltip.info > .icon { color: var(--ot-blue); }
.ot-tooltip.success > .icon { color: var(--ot-green); }
.ot-tooltip.warning > .icon { color: var(--ot-orange); }
.ot-tooltip.error > .icon { color: var(--ot-red); }

.ot-toast
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: 16px 20px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	color: var(--ot-text-1);
	font-size: var(--ot-size-m);
	min-width: 320px;
	max-width: 420px;
	animation: toast-in 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes toast-in
{
	from { opacity: 0; transform: translateY(-12px) scale(0.96); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.ot-toast > .icon
{
	width: 32px;
	height: 32px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	flex-shrink: 0;
}

.ot-toast > .content
{
	flex: 1;
}

.ot-toast > .content > .title
{
	font-weight: 600;
	font-size: 13.5px;
	margin-bottom: 3px;
	color: var(--ot-text-1);
}

.ot-toast > .content > .message
{
	font-size: var(--ot-size-m);
	font-weight: 600;
	line-height: 1.45;
	color: var(--ot-text-1);
}

.ot-toast > .close
{
	width: 28px;
	height: 28px;
	background: none;
	border: none;
	color: var(--ot-text-3);
	cursor: pointer;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background 0.15s ease, color 0.15s ease;
}

.ot-toast > .close:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.ot-toast > .close > i
{
	font-size: 16px;
}

.ot-toast.info > .icon { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.ot-toast.success > .icon { background: var(--ot-green-opacity); color: var(--ot-green); }
.ot-toast.warning > .icon { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.ot-toast.error > .icon { background: var(--ot-red-opacity); color: var(--ot-red); }

/* Confirm */

.ot-confirm
{
	display: flex;
	flex-direction: column;
	padding: 28px 32px 24px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: 20px;
	min-width: 400px;
	max-width: 460px;
	animation: confirm-in 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes confirm-in
{
	from { opacity: 0; transform: scale(0.95) translateY(8px); }
	to { opacity: 1; transform: scale(1) translateY(0); }
}

/* Icon */

.ot-confirm > .icon
{
	width: 44px;
	height: 44px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
}

.ot-confirm > .icon > i
{
	font-size: 22px;
}

.ot-confirm > .icon.default { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.ot-confirm > .icon.danger { background: var(--ot-red-opacity); color: var(--ot-red); }
.ot-confirm > .icon.warning { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.ot-confirm > .icon.info { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.ot-confirm > .icon.success { background: var(--ot-green-opacity); color: var(--ot-green); }

/* Title */

.ot-confirm > .title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.015em;
	line-height: 1.15;
	color: var(--ot-text-1);
	margin-bottom: 8px;
}

/* Description */

.ot-confirm > .description
{
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin-bottom: 24px;
}

/* Input */

.ot-confirm > .input
{
	width: 100%;
	margin-bottom: 24px;
}

/* Actions */

.ot-confirm > .actions
{
	display: flex;
	gap: 10px;
	width: 100%;
	padding-top: 20px;
	border-top: 1px solid var(--ot-bg-1-border);
}

.ot-confirm > .actions > *,
.ot-confirm > .actions > * > *
{
	width: 100%;
}
/* ===== POPUP PANEL — chrome for modals, drawers and sheets ===== */

.e-5ea275cd
{
	display: contents;
}

.e-5ea275cd > .box
{
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	overflow: hidden;
}

/* ===== PLACEMENT — all floating cards: full border, radius, margin from edges ===== */

.e-5ea275cd > .box
{
	border-radius: var(--ot-radius-l);
}

/* Center — modal card */
.e-5ea275cd > .box.place-center
{
	max-height: 85vh;
}

/* Right / Left — drawer, full height minus margin */
.e-5ea275cd > .box.place-right,
.e-5ea275cd > .box.place-left
{
	height: calc(100vh - var(--ot-spacing-m) * 2);
}

/* Bottom / Top — sheet, full width minus margin */
.e-5ea275cd > .box.place-bottom,
.e-5ea275cd > .box.place-top
{
	width: calc(100vw - var(--ot-spacing-m) * 2);
	max-height: 85vh;
}

/* ===== WIDTH (center / right / left) ===== */

.e-5ea275cd > .box.place-center.width-s, .e-5ea275cd > .box.place-right.width-s, .e-5ea275cd > .box.place-left.width-s { width: 320px; }
.e-5ea275cd > .box.place-center.width-m, .e-5ea275cd > .box.place-right.width-m, .e-5ea275cd > .box.place-left.width-m { width: 420px; }
.e-5ea275cd > .box.place-center.width-l, .e-5ea275cd > .box.place-right.width-l, .e-5ea275cd > .box.place-left.width-l { width: 560px; }

.e-5ea275cd > .box.place-center { max-width: 90vw; }

/* ===== HEADER ===== */

.e-5ea275cd > .box > .head
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
	align-items: center;
}

.e-5ea275cd > .box > .head > .titles
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-5ea275cd > .box > .head > .titles > .title
{
	font-size: var(--ot-size-m);
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-5ea275cd > .box > .head > .titles > .description
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

.e-5ea275cd > .box > .head > .close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	flex-shrink: 0;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-5ea275cd > .box > .head > .close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-5ea275cd > .box > .head > .close > i
{
	font-size: 18px;
}

/* ===== BODY ===== */

.e-5ea275cd > .box > .body
{
	overflow-y: auto;
	flex: 1;
}

.e-5ea275cd > .box > .body.pad-none { padding: 0; }
.e-5ea275cd > .box > .body.pad-s { padding: var(--ot-spacing-s); }
.e-5ea275cd > .box > .body.pad-m { padding: var(--ot-spacing-m); }
.e-5ea275cd > .box > .body.pad-l { padding: var(--ot-spacing-l); }

.e-5ea275cd > .box.clean > .body
{
	padding: 0;
}

/* ===== FOOTER ===== */

.e-5ea275cd > .box > .foot
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	border-top: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}
/* ===== TYPE SYSTEM — global reusable cell styles ===== */

/* Group — recursive layout wrapper */

.ot-type-group
{
	display: flex;
	min-width: 0;
}

.ot-type-group.layout-row
{
	flex-direction: row;
	align-items: center;
}

.ot-type-group.layout-column
{
	flex-direction: column;
	align-items: flex-start;
}

.ot-type-group.gap-none { gap: 0; }
.ot-type-group.gap-small { gap: 4px; }
.ot-type-group.gap-medium { gap: var(--ot-spacing-s); }
.ot-type-group.gap-large { gap: var(--ot-spacing-m); }

/* Text */

.ot-type-text
{
	color: var(--ot-text-1);
	font-weight: 600;
}

/* Description */

.ot-type-description
{
	color: var(--ot-text-2);
	font-weight: 400;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Number */

.ot-type-number
{
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	color: var(--ot-text-1);
}

/* Date / Timeago */

.ot-type-date
{
	color: var(--ot-text-2);
	font-variant-numeric: tabular-nums;
}

/* Boolean */

.ot-type-boolean
{
	font-size: 18px;
}

.ot-type-boolean.yes { color: var(--ot-green); }
.ot-type-boolean.no { color: var(--ot-red); opacity: 0.5; }

/* Icon */

.ot-type-icon
{
	font-size: 18px;
	color: var(--ot-text-2);
}

/* Image */

.ot-type-image
{
	height: 32px;
	padding: 4px;
	border-radius: var(--ot-radius-s);
	border: 1px solid var(--ot-bg-2-border);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	max-width: 64px;
}

.ot-type-image.empty
{
	background-image: none;
}

/* Avatar */

.ot-type-avatar
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--ot-bg-2);
	color: var(--ot-text-3);
}

.ot-type-avatar > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ot-type-avatar.ot-type-avatar-fallback > i
{
	font-size: 18px;
}

/* Media */

.ot-type-media
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	min-width: 0;
}

.ot-type-media > .ot-type-media-thumb
{
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	border-radius: var(--ot-radius-s);
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-2);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ot-text-3);
}

.ot-type-media > .ot-type-media-thumb.empty > i
{
	font-size: 18px;
}

.ot-type-media > .ot-type-media-info
{
	display: flex;
	flex-direction: column;
	min-width: 0;
	gap: 1px;
}

.ot-type-media > .ot-type-media-info > .ot-type-media-title
{
	font-weight: 600;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ot-type-media > .ot-type-media-info > .ot-type-media-subtitle
{
	font-size: 11px;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Badge */

.ot-type-badge
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 8px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.ot-type-badge > i
{
	font-size: 13px;
}

.ot-type-badge.color-brand { background: var(--ot-brand-opacity); border-color: var(--ot-brand-border); color: var(--ot-brand); }
.ot-type-badge.color-blue { background: var(--ot-blue-opacity); border-color: var(--ot-blue-border); color: var(--ot-blue); }
.ot-type-badge.color-green { background: var(--ot-green-opacity); border-color: var(--ot-green-border); color: var(--ot-green); }
.ot-type-badge.color-red { background: var(--ot-red-opacity); border-color: var(--ot-red-border); color: var(--ot-red); }
.ot-type-badge.color-orange { background: var(--ot-orange-opacity); border-color: var(--ot-orange-border); color: var(--ot-orange); }

/* Chip */

.ot-type-chip
{
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-2);
}

/* Tag */

.ot-type-tag
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-bg-3);
	border-radius: var(--ot-radius-s);
	font-size: 10px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.ot-type-tags
{
	display: flex;
	flex-wrap: wrap;
	gap: 3px;
}

/* Status */

.ot-type-status
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 10px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.ot-type-status > .ot-type-status-dot
{
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ot-text-3);
}

.ot-type-status.color-green { color: var(--ot-green); background: var(--ot-green-opacity); }
.ot-type-status.color-green > .ot-type-status-dot { background: var(--ot-green); box-shadow: 0 0 0 3px var(--ot-green-opacity); }
.ot-type-status.color-red { color: var(--ot-red); background: var(--ot-red-opacity); }
.ot-type-status.color-red > .ot-type-status-dot { background: var(--ot-red); box-shadow: 0 0 0 3px var(--ot-red-opacity); }
.ot-type-status.color-orange { color: var(--ot-orange); background: var(--ot-orange-opacity); }
.ot-type-status.color-orange > .ot-type-status-dot { background: var(--ot-orange); box-shadow: 0 0 0 3px var(--ot-orange-opacity); }
.ot-type-status.color-blue { color: var(--ot-blue); background: var(--ot-blue-opacity); }
.ot-type-status.color-blue > .ot-type-status-dot { background: var(--ot-blue); }
.ot-type-status.color-brand { color: var(--ot-brand); background: var(--ot-brand-opacity); }
.ot-type-status.color-brand > .ot-type-status-dot { background: var(--ot-brand); }

/* Metric */

.ot-type-metric
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	font-variant-numeric: tabular-nums;
}

.ot-type-metric > .ot-type-metric-value
{
	font-weight: 700;
	color: var(--ot-text-1);
}

.ot-type-metric > .ot-type-metric-delta
{
	font-size: 11px;
	font-weight: 700;
	padding: 1px 5px;
	border-radius: var(--ot-radius-s);
}

.ot-type-metric > .ot-type-metric-delta.up { color: var(--ot-green); background: var(--ot-green-opacity); }
.ot-type-metric > .ot-type-metric-delta.down { color: var(--ot-red); background: var(--ot-red-opacity); }

/* Progress */

.ot-type-progress
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

.ot-type-progress > .ot-type-progress-track
{
	flex: 1;
	height: 6px;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
	min-width: 60px;
}

.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar
{
	height: 100%;
	border-radius: 100px;
	transition: width 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar.color-brand { background: var(--ot-brand); }
.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar.color-blue { background: var(--ot-blue); }
.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar.color-green { background: var(--ot-green); }
.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar.color-red { background: var(--ot-red); }
.ot-type-progress > .ot-type-progress-track > .ot-type-progress-bar.color-orange { background: var(--ot-orange); }

.ot-type-progress > .ot-type-progress-label
{
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-2);
	font-variant-numeric: tabular-nums;
	min-width: 32px;
	text-align: right;
}

/* Count */

.ot-type-count
{
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
}

.ot-type-count > .ot-type-count-value
{
	font-weight: 700;
	color: var(--ot-text-1);
	font-variant-numeric: tabular-nums;
}

.ot-type-count > .ot-type-count-label
{
	color: var(--ot-text-3);
	font-weight: 400;
}

/* Color */

.ot-type-color
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.ot-type-color > .ot-type-color-swatch
{
	width: 18px;
	height: 18px;
	border-radius: var(--ot-radius-s);
	border: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.ot-type-color > .ot-type-color-value
{
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
}

/* Link */

.ot-type-link
{
	color: var(--ot-brand);
	text-decoration: none;
	font-weight: 500;
}

.ot-type-link:hover
{
	text-decoration: underline;
}
/* Base page styles */
.ot-page
{
	display: grid;
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100dvh;
	overflow: hidden;
}

/* Page area containers */
.ot-page-area
{
	position: relative;
	overflow: auto;
}

.ot-page-area > div
{
	display: contents;
}
[ot]
{
	opacity: 0;
}
/* Root */

.e-5511e8fd
{
	display: block;
	width: 100%;
}

/* Editor */

.e-5511e8fd > .ot-editor
{
	position: relative;
	max-width: 720px;
	margin: 0 auto;
	padding: var(--ot-spacing-l) 0;
}

/* Blocks Container */

.e-5511e8fd > .ot-editor > .ot-editor-blocks
{
	display: flex;
	flex-direction: column;
}

/* Placeholder */

.e-5511e8fd > .ot-editor > .ot-editor-placeholder
{
	color: var(--ot-text-3);
	font-size: var(--ot-size-m);
	padding: 0 var(--ot-spacing-m);
	padding-left: 44px;
	pointer-events: none;
}

/* Block */

.e-5511e8fd .ot-block
{
	position: relative;
	display: flex;
	align-items: flex-start;
	padding: 2px 0;
	border-radius: var(--ot-radius-m);
	outline: none;
	transition: background 0.1s ease;
}

.e-5511e8fd .ot-block:hover
{
	background: var(--ot-bg-1-hover);
}

/* Gutter */

.e-5511e8fd .ot-block-gutter
{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 44px;
	flex-shrink: 0;
	opacity: 0;
	transition: opacity 0.15s ease;
	padding-top: 2px;
}

.e-5511e8fd .ot-block:hover > .ot-block-gutter
{
	opacity: 1;
}

.e-5511e8fd .ot-block-handle,
.e-5511e8fd .ot-block-add
{
	width: 24px;
	height: 24px;
	border-radius: var(--ot-radius-s);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ot-text-3);
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background 0.15s ease, color 0.15s ease;
}

.e-5511e8fd .ot-block-handle:hover,
.e-5511e8fd .ot-block-add:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-5511e8fd .ot-block-handle > i,
.e-5511e8fd .ot-block-add > i
{
	font-size: 16px;
}

.e-5511e8fd .ot-block-handle
{
	cursor: grab;
}

.e-5511e8fd .ot-block-handle:active
{
	cursor: grabbing;
}

/* Content */

.e-5511e8fd .ot-block-content
{
	flex: 1;
	min-width: 0;
	min-height: 24px;
	outline: none;
}

.e-5511e8fd .ot-block-content > [contenteditable]
{
	outline: none;
	min-height: 24px;
	word-break: break-word;
	overflow-wrap: break-word;
}

.e-5511e8fd .ot-block-content > [contenteditable]:empty::before
{
	content: attr(data-placeholder);
	color: var(--ot-text-3);
	pointer-events: none;
}

/* Paragraph */

.e-5511e8fd .ot-block-content > p
{
	margin: 0;
	font-size: var(--ot-size-m);
	line-height: 1.7;
	color: var(--ot-text-1);
}

/* Inline Formats */

.e-5511e8fd .ot-block-content strong
{
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-5511e8fd .ot-block-content em
{
	font-style: italic;
}

.e-5511e8fd .ot-block-content code
{
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 0.9em;
	padding: 0.15em 0.4em;
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
}

.e-5511e8fd .ot-block-content a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-decoration-color: var(--ot-brand-opacity);
	text-underline-offset: 3px;
}

/* Actions */

.e-5511e8fd .ot-block-actions
{
	display: flex;
	align-items: flex-start;
	flex-shrink: 0;
	opacity: 0;
	transition: opacity 0.15s ease;
	padding-top: 2px;
}

.e-5511e8fd .ot-block:hover > .ot-block-actions
{
	opacity: 1;
}

.e-5511e8fd .ot-block-settings
{
	width: 24px;
	height: 24px;
	border-radius: var(--ot-radius-s);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ot-text-3);
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background 0.15s ease, color 0.15s ease;
}

.e-5511e8fd .ot-block-settings:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-5511e8fd .ot-block-settings > i
{
	font-size: 16px;
}

/* Selection */

.e-5511e8fd .ot-block-selected
{
	background: var(--ot-brand-opacity);
}

.e-5511e8fd .ot-block-focused
{
	background: transparent;
}

/* Bordered variant */

.e-5511e8fd > .ot-editor.bordered
{
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	padding: var(--ot-spacing-l);
}

/* Compact variant */

.e-5511e8fd > .ot-editor.compact
{
	max-width: 100%;
	padding: var(--ot-spacing-m) 0;
}
/* ===== CLOUDFLARE IMAGES INPUT ===== */

.e-6180cbf3
{
	display: contents;
}
/* ===== CLOUDFLARE IMAGES UPLOAD ===== */

.e-1cd2e108
{
	display: contents;
}
body
{
	background-color: var(--ot-bg-2);
}
:root
{
    --ot-spacing-x: 4px;
    --ot-spacing-s: 8px;
    --ot-spacing-m: 16px;
    --ot-spacing-l: 32px;

    --ot-radius-s: 8px;
    --ot-radius-m: 12px;
    --ot-radius-l: 16px;

    --ot-height-x: 20px;
    --ot-height-s: 32px;
    --ot-height-m: 38px;
    --ot-height-l: 46px;

    --ot-size-s: 12px;
    --ot-size-m: 13px;
    --ot-size-l: 28px;

    --ot-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ot-font-secondary: 'Fraunces', 'Inter', Georgia, serif;

    --ot-bg-1: rgba(255, 255, 255, 1);
    --ot-bg-1-border: rgba(234, 232, 226, 1);
    --ot-bg-1-opacity: rgba(255, 255, 255, 0.85);
    --ot-bg-1-hover: rgba(250, 249, 246, 1);

    --ot-bg-2: rgba(252, 251, 249, 1);
    --ot-bg-2-border: rgba(236, 234, 228, 1);
    --ot-bg-2-opacity: rgba(252, 251, 249, 0.85);
    --ot-bg-2-hover: rgba(247, 246, 241, 1);

    --ot-bg-3: rgba(248, 247, 243, 1);
    --ot-bg-3-border: rgba(230, 227, 220, 1);
    --ot-bg-3-opacity: rgba(248, 247, 243, 0.85);
    --ot-bg-3-hover: rgba(243, 241, 234, 1);

    --ot-bg-4: rgba(243, 241, 235, 1);
    --ot-bg-4-border: rgba(224, 220, 210, 1);
    --ot-bg-4-opacity: rgba(243, 241, 235, 0.85);
    --ot-bg-4-hover: rgba(236, 233, 224, 1);

    --ot-text-1: rgba(10, 10, 14, 1);
    --ot-text-2: rgba(62, 62, 72, 1);
    --ot-text-3: rgba(105, 105, 118, 1);

    --ot-brand: rgba(202, 86, 60, 1);
    --ot-brand-border: rgba(216, 116, 92, 1);
    --ot-brand-opacity: rgba(202, 86, 60, 0.10);
    --ot-brand-hover: rgba(178, 70, 46, 1);

    --ot-blue: rgba(14, 116, 180, 1);
    --ot-blue-border: rgba(56, 152, 208, 1);
    --ot-blue-opacity: rgba(14, 116, 180, 0.10);
    --ot-blue-hover: rgba(8, 96, 156, 1);

    --ot-red: rgba(200, 40, 60, 1);
    --ot-red-border: rgba(224, 80, 96, 1);
    --ot-red-opacity: rgba(200, 40, 60, 0.10);
    --ot-red-hover: rgba(176, 28, 48, 1);

    --ot-orange: rgba(214, 138, 58, 1);
    --ot-orange-border: rgba(232, 168, 100, 1);
    --ot-orange-opacity: rgba(214, 138, 58, 0.10);
    --ot-orange-hover: rgba(190, 116, 36, 1);

    --ot-green: rgba(20, 144, 95, 1);
    --ot-green-border: rgba(60, 176, 130, 1);
    --ot-green-opacity: rgba(20, 144, 95, 0.10);
    --ot-green-hover: rgba(12, 120, 78, 1);
}
/* Root */

.e-60cd2d73
{
	display: block;
	width: 100%;
	min-height: 100vh;
}

/* Split */

.e-60cd2d73 > .split
{
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	min-height: 100vh;
	width: 100%;
}

/* Showcase */

.e-60cd2d73 > .split > .showcase
{
	position: relative;
	overflow: hidden;
	display: flex;
	padding: var(--ot-spacing-l);
}

.e-60cd2d73 > .split > .showcase > .e-18fbce40
{
	width: 100%;
	height: 100%;
}

.e-60cd2d73 > .split > .showcase > .e-18fbce40 > .holder
{
	height: 100%;
}

.e-60cd2d73 > .split > .showcase > .overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 20, 30, 0.05) 0%, rgba(20, 20, 30, 0.7) 100%);
	pointer-events: none;
}

.e-60cd2d73 > .split > .showcase > .content
{
	position: relative;
	padding: 56px 56px;
	color: white;
	max-width: 640px;
}

.e-60cd2d73 > .split > .showcase > .content > .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 8px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	margin-bottom: var(--ot-spacing-l);
	backdrop-filter: blur(12px);
}

.e-60cd2d73 > .split > .showcase > .content > .brand > i
{
	font-size: 16px;
	color: #ffd9a8;
}

.e-60cd2d73 > .split > .showcase > .content > .brand > span
{
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: white;
}

.e-60cd2d73 > .split > .showcase > .content > h2
{
	font-family: var(--ot-font-secondary);
	font-size: 56px;
	font-weight: 400;
	line-height: 1.0;
	letter-spacing: -0.025em;
	color: white;
	margin: 0 0 var(--ot-spacing-m);
	font-variation-settings: 'opsz' 144, 'wght' 400;
}

.e-60cd2d73 > .split > .showcase > .content > h2 em
{
	font-style: italic;
	color: #ffd9a8;
	font-weight: 400;
}

.e-60cd2d73 > .split > .showcase > .content > p
{
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
	max-width: 500px;
	margin: 0 0 var(--ot-spacing-l);
}

.e-60cd2d73 > .split > .showcase > .content > .stats
{
	display: flex;
	gap: var(--ot-spacing-l);
	padding-top: var(--ot-spacing-m);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.e-60cd2d73 > .split > .showcase > .content > .stats > .stat > strong
{
	display: block;
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 500;
	color: white;
	font-variation-settings: 'opsz' 144;
	line-height: 1;
	margin-bottom: 4px;
}

.e-60cd2d73 > .split > .showcase > .content > .stats > .stat > span
{
	font-size: 11px;
	color: rgba(255, 255, 255, 0.65);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

/* Form */

.e-60cd2d73 > .split > .form
{
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-bg-1);
	padding: var(--ot-spacing-l);
}

.e-60cd2d73 > .split > .form > .holder
{
	width: 100%;
	max-width: 420px;
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
}

.e-60cd2d73 > .split > .form > .holder > .header > h1
{
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 500;
	letter-spacing: -0.022em;
	color: var(--ot-text-1);
	margin: 0 0 6px;
	font-variation-settings: 'opsz' 144;
}

.e-60cd2d73 > .split > .form > .holder > .header > p
{
	font-size: 14px;
	color: var(--ot-text-2);
	margin: 0;
}

.e-60cd2d73 > .split > .form > .holder .auth-field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: var(--ot-spacing-m);
}

.e-60cd2d73 > .split > .form > .holder .auth-field > label
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
}

.e-60cd2d73 > .split > .form > .holder .footer
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--ot-text-2);
	padding-top: var(--ot-spacing-s);
	border-top: 1px solid var(--ot-bg-1-border);
}

.e-60cd2d73 > .split > .form > .holder .footer > a
{
	color: var(--ot-brand);
	font-weight: 600;
	text-decoration: none;
}

.e-60cd2d73 > .split > .form > .holder .footer > a:hover
{
	text-decoration: underline;
}

.e-60cd2d73 > .split > .form > .holder .redirect-notice
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 14px;
	background: var(--ot-brand-opacity);
	border-radius: var(--ot-radius-m);
	font-size: 12px;
	color: var(--ot-brand);
}

.e-60cd2d73 > .split > .form > .holder .redirect-notice > i
{
	font-size: 16px;
}

.e-60cd2d73 > .split > .form > .holder .redirect-notice strong
{
	font-weight: 700;
}

@media screen and (max-width: 900px)
{
	.e-60cd2d73 > .split
	{
		grid-template-columns: 1fr;
	}

	.e-60cd2d73 > .split > .showcase
	{
		min-height: 320px;
	}

	.e-60cd2d73 > .split > .showcase > .content
	{
		padding: 36px;
	}

	.e-60cd2d73 > .split > .showcase > .content > h2
	{
		font-size: 36px;
	}
}
/* Root */

.e-47276740
{
	display: block;
	width: 100%;
	min-height: 100vh;
}

/* Split */

.e-47276740 > .split
{
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	min-height: 100vh;
	width: 100%;
}

/* Showcase */

.e-47276740 > .split > .showcase
{
	position: relative;
	overflow: hidden;
	display: flex;
	padding: var(--ot-spacing-l);
}

.e-47276740 > .split > .showcase > .e-18fbce40
{
	width: 100%;
	height: 100%;
}

.e-47276740 > .split > .showcase > .e-18fbce40 > .holder
{
	height: 100%;
}

/* Form */

.e-47276740 > .split > .form
{
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-bg-1);
	padding: var(--ot-spacing-l);
}

.e-47276740 > .split > .form > .holder
{
	width: 100%;
	max-width: 420px;
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
}

.e-47276740 > .split > .form > .holder > .header > h1
{
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 500;
	letter-spacing: -0.022em;
	color: var(--ot-text-1);
	margin: 0 0 6px;
	font-variation-settings: 'opsz' 144;
}

.e-47276740 > .split > .form > .holder > .header > p
{
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
	margin: 0;
}

.e-47276740 > .split > .form > .holder > .actions
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

@media screen and (max-width: 900px)
{
	.e-47276740 > .split
	{
		grid-template-columns: 1fr;
	}

	.e-47276740 > .split > .showcase
	{
		min-height: 320px;
	}
}
/* Root */

.e-4308bc59
{
	display: block;
	width: 100%;
	min-height: 100vh;
}

/* Split */

.e-4308bc59 > .split
{
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	min-height: 100vh;
	width: 100%;
}

/* Showcase */

.e-4308bc59 > .split > .showcase
{
	position: relative;
	overflow: hidden;
	display: flex;
	padding: var(--ot-spacing-l);
}

.e-4308bc59 > .split > .showcase > .e-18fbce40
{
	width: 100%;
	height: 100%;
}

.e-4308bc59 > .split > .showcase > .e-18fbce40 > .holder
{
	height: 100%;
}

.e-4308bc59 > .split > .showcase > .overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 20, 30, 0.05) 0%, rgba(20, 20, 30, 0.7) 100%);
	pointer-events: none;
}

.e-4308bc59 > .split > .showcase > .content
{
	position: relative;
	padding: 56px 56px;
	color: white;
	max-width: 640px;
}

.e-4308bc59 > .split > .showcase > .content > .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 8px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	margin-bottom: var(--ot-spacing-l);
	backdrop-filter: blur(12px);
}

.e-4308bc59 > .split > .showcase > .content > .brand > i
{
	font-size: 16px;
	color: #ffd9a8;
}

.e-4308bc59 > .split > .showcase > .content > .brand > span
{
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: white;
}

.e-4308bc59 > .split > .showcase > .content > h2
{
	font-family: var(--ot-font-secondary);
	font-size: 56px;
	font-weight: 400;
	line-height: 1.0;
	letter-spacing: -0.025em;
	color: white;
	margin: 0 0 var(--ot-spacing-m);
	font-variation-settings: 'opsz' 144, 'wght' 400;
}

.e-4308bc59 > .split > .showcase > .content > h2 em
{
	font-style: italic;
	color: #ffd9a8;
	font-weight: 400;
}

.e-4308bc59 > .split > .showcase > .content > p
{
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
	max-width: 500px;
	margin: 0 0 var(--ot-spacing-l);
}

.e-4308bc59 > .split > .showcase > .content > .stats
{
	display: flex;
	gap: var(--ot-spacing-l);
	padding-top: var(--ot-spacing-m);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.e-4308bc59 > .split > .showcase > .content > .stats > .stat > strong
{
	display: block;
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 500;
	color: white;
	font-variation-settings: 'opsz' 144;
	line-height: 1;
	margin-bottom: 4px;
}

.e-4308bc59 > .split > .showcase > .content > .stats > .stat > span
{
	font-size: 11px;
	color: rgba(255, 255, 255, 0.65);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

/* Form */

.e-4308bc59 > .split > .form
{
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-bg-1);
	padding: var(--ot-spacing-l);
}

.e-4308bc59 > .split > .form > .holder
{
	width: 100%;
	max-width: 460px;
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
}

.e-4308bc59 > .split > .form > .holder > .header > h1
{
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 500;
	letter-spacing: -0.022em;
	color: var(--ot-text-1);
	margin: 0 0 6px;
	font-variation-settings: 'opsz' 144;
}

.e-4308bc59 > .split > .form > .holder > .header > p
{
	font-size: 14px;
	color: var(--ot-text-2);
	margin: 0;
}

.e-4308bc59 > .split > .form > .holder .auth-field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: var(--ot-spacing-m);
}

.e-4308bc59 > .split > .form > .holder .auth-field > label
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
}

/* Rules */

.e-4308bc59 > .split > .form > .holder .rules
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px 14px;
	margin-top: 10px;
}

.e-4308bc59 > .split > .form > .holder .rule
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--ot-text-3);
	transition: color 0.2s;
}

.e-4308bc59 > .split > .form > .holder .rule > i
{
	font-size: 14px;
}

.e-4308bc59 > .split > .form > .holder .rule.pass
{
	color: var(--ot-green);
}

.e-4308bc59 > .split > .form > .holder .rule.fail
{
	color: var(--ot-red);
}

.e-4308bc59 > .split > .form > .holder .footer
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--ot-text-2);
	padding-top: var(--ot-spacing-s);
	border-top: 1px solid var(--ot-bg-1-border);
}

.e-4308bc59 > .split > .form > .holder .footer > a
{
	color: var(--ot-brand);
	font-weight: 600;
	text-decoration: none;
}

.e-4308bc59 > .split > .form > .holder .footer > a:hover
{
	text-decoration: underline;
}

.e-4308bc59 > .split > .form > .holder .redirect-notice
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 14px;
	background: var(--ot-brand-opacity);
	border-radius: var(--ot-radius-m);
	font-size: 12px;
	color: var(--ot-brand);
}

.e-4308bc59 > .split > .form > .holder .redirect-notice > i
{
	font-size: 16px;
}

.e-4308bc59 > .split > .form > .holder .redirect-notice strong
{
	font-weight: 700;
}

@media screen and (max-width: 900px)
{
	.e-4308bc59 > .split
	{
		grid-template-columns: 1fr;
	}

	.e-4308bc59 > .split > .showcase
	{
		min-height: 320px;
	}

	.e-4308bc59 > .split > .showcase > .content
	{
		padding: 36px;
	}

	.e-4308bc59 > .split > .showcase > .content > h2
	{
		font-size: 36px;
	}
}
/* ===== CARDS INFO ===== */

.e-7e93ff6e
{
	display: contents;
}

/* Box */

.e-7e93ff6e > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-l);
}

.e-7e93ff6e > .box.bg-1,
.e-7e93ff6e > .box.bg-2,
.e-7e93ff6e > .box.bg-3,
.e-7e93ff6e > .box.bg-4,
.e-7e93ff6e > .box.border
{
	padding: var(--ot-spacing-m);
}

/* ===== HEADER ===== */

.e-7e93ff6e > .box > .header
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
}

/* Header icon */

.e-7e93ff6e > .box > .header > .icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-7e93ff6e > .box > .header > .icon > i
{
	font-size: 22px;
}

/* Header text */

.e-7e93ff6e > .box > .header > .text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.e-7e93ff6e > .box > .header > .text > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.2;
}

.e-7e93ff6e > .box > .header > .text > .description
{
	margin: 0;
	font-size: 12px;
	color: var(--ot-text-2);
	line-height: 1.4;
	font-family: var(--ot-font-primary);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
}

/* Header badge */

.e-7e93ff6e > .box > .header > .badge
{
	display: inline-flex;
	align-items: center;
	padding: var(--ot-spacing-x) 10px;
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-family: var(--ot-font-primary);
	flex-shrink: 0;
}

/* ===== STATUS ===== */

.e-7e93ff6e > .box > .status
{
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	gap: var(--ot-spacing-s);
	padding: 6px 12px;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	font-family: var(--ot-font-primary);
}

.e-7e93ff6e > .box > .status > .dot
{
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
	position: relative;
}

.e-7e93ff6e > .box > .status > .dot::before
{
	content: '';
	position: absolute;
	inset: -3px;
	border-radius: 50%;
	opacity: 0.3;
	animation: e-7e93ff6e-pulse 2.4s ease-in-out infinite;
}

@keyframes e-7e93ff6e-pulse
{
	0%, 100% { transform: scale(1); opacity: 0.3; }
	50% { transform: scale(1.4); opacity: 0.1; }
}

.e-7e93ff6e > .box > .status.color-brand { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-7e93ff6e > .box > .status.color-brand > .dot { background: var(--ot-brand); }
.e-7e93ff6e > .box > .status.color-brand > .dot::before { background: var(--ot-brand); }

.e-7e93ff6e > .box > .status.color-blue { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.e-7e93ff6e > .box > .status.color-blue > .dot { background: var(--ot-blue); }
.e-7e93ff6e > .box > .status.color-blue > .dot::before { background: var(--ot-blue); }

.e-7e93ff6e > .box > .status.color-red { background: var(--ot-red-opacity); color: var(--ot-red); }
.e-7e93ff6e > .box > .status.color-red > .dot { background: var(--ot-red); }
.e-7e93ff6e > .box > .status.color-red > .dot::before { background: var(--ot-red); }

.e-7e93ff6e > .box > .status.color-orange { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-7e93ff6e > .box > .status.color-orange > .dot { background: var(--ot-orange); }
.e-7e93ff6e > .box > .status.color-orange > .dot::before { background: var(--ot-orange); }

.e-7e93ff6e > .box > .status.color-green { background: var(--ot-green-opacity); color: var(--ot-green); }
.e-7e93ff6e > .box > .status.color-green > .dot { background: var(--ot-green); }
.e-7e93ff6e > .box > .status.color-green > .dot::before { background: var(--ot-green); }

/* ===== STATS ===== */

.e-7e93ff6e > .box > .stats
{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m) 0;
	border-top: 1px solid var(--ot-bg-2-border);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-7e93ff6e > .box > .stats > .stat
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

.e-7e93ff6e > .box > .stats > .stat > .stat-icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	font-size: 18px;
	flex-shrink: 0;
}

.e-7e93ff6e > .box > .stats > .stat > .stat-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-7e93ff6e > .box > .stats > .stat > .stat-text > .value
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 600;
	color: var(--ot-text-1);
	line-height: 1;
	font-variation-settings: 'opsz' 144;
}

.e-7e93ff6e > .box > .stats > .stat > .stat-text > .label
{
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-family: var(--ot-font-primary);
}

.e-7e93ff6e > .box > .stats > .stat.color-brand > .stat-icon { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-7e93ff6e > .box > .stats > .stat.color-blue > .stat-icon { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.e-7e93ff6e > .box > .stats > .stat.color-red > .stat-icon { background: var(--ot-red-opacity); color: var(--ot-red); }
.e-7e93ff6e > .box > .stats > .stat.color-orange > .stat-icon { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-7e93ff6e > .box > .stats > .stat.color-green > .stat-icon { background: var(--ot-green-opacity); color: var(--ot-green); }

/* ===== ROWS ===== */

.e-7e93ff6e > .box > .rows
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
}

.e-7e93ff6e > .box > .rows > .row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ot-spacing-m);
	padding: 6px 0;
	font-size: var(--ot-size-m);
	font-family: var(--ot-font-primary);
}

.e-7e93ff6e > .box > .rows > .row > .row-label
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	color: var(--ot-text-2);
}

.e-7e93ff6e > .box > .rows > .row > .row-label > i
{
	font-size: 16px;
	color: var(--ot-text-3);
}

.e-7e93ff6e > .box > .rows > .row > .row-value
{
	font-weight: 600;
	color: var(--ot-text-1);
	text-align: right;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-7e93ff6e > .box > .rows > .row.color-brand > .row-value { color: var(--ot-brand); }
.e-7e93ff6e > .box > .rows > .row.color-blue > .row-value { color: var(--ot-blue); }
.e-7e93ff6e > .box > .rows > .row.color-red > .row-value { color: var(--ot-red); }
.e-7e93ff6e > .box > .rows > .row.color-orange > .row-value { color: var(--ot-orange); }
.e-7e93ff6e > .box > .rows > .row.color-green > .row-value { color: var(--ot-green); }

/* ===== TAGS ===== */

.e-7e93ff6e > .box > .tags
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-x);
}

.e-7e93ff6e > .box > .tags > .tag
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: var(--ot-spacing-x) 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.e-7e93ff6e > .box > .tags > .tag > i
{
	font-size: 13px;
}

.e-7e93ff6e > .box > .tags > .tag.color-brand { background: var(--ot-brand-opacity); border-color: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-7e93ff6e > .box > .tags > .tag.color-blue { background: var(--ot-blue-opacity); border-color: var(--ot-blue-opacity); color: var(--ot-blue); }
.e-7e93ff6e > .box > .tags > .tag.color-red { background: var(--ot-red-opacity); border-color: var(--ot-red-opacity); color: var(--ot-red); }
.e-7e93ff6e > .box > .tags > .tag.color-orange { background: var(--ot-orange-opacity); border-color: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-7e93ff6e > .box > .tags > .tag.color-green { background: var(--ot-green-opacity); border-color: var(--ot-green-opacity); color: var(--ot-green); }

/* ===== NOTICE ===== */

.e-7e93ff6e > .box > .notice
{
	display: flex;
	align-items: flex-start;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border-radius: var(--ot-radius-m);
	font-size: 12.5px;
	line-height: 1.5;
	font-family: var(--ot-font-primary);
}

.e-7e93ff6e > .box > .notice > i
{
	font-size: 18px;
	flex-shrink: 0;
	margin-top: 1px;
}

.e-7e93ff6e > .box > .notice.color-brand { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-7e93ff6e > .box > .notice.color-blue { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.e-7e93ff6e > .box > .notice.color-red { background: var(--ot-red-opacity); color: var(--ot-red); }
.e-7e93ff6e > .box > .notice.color-orange { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-7e93ff6e > .box > .notice.color-green { background: var(--ot-green-opacity); color: var(--ot-green); }

/* ===== BODY ===== */

.e-7e93ff6e > .box > .body
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* ===== ACTIONS ===== */

.e-7e93ff6e > .box > .actions
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

.e-7e93ff6e > .box > .actions:empty
{
	display: none;
}

/* ===== BACKGROUND ===== */

.e-7e93ff6e > .box.bg-1 { background: var(--ot-bg-1); }
.e-7e93ff6e > .box.bg-1 > .stats { border-color: var(--ot-bg-1-border); }
.e-7e93ff6e > .box.bg-1 > .tags > .tag { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }

.e-7e93ff6e > .box.bg-2 { background: var(--ot-bg-2); }
.e-7e93ff6e > .box.bg-2 > .stats { border-color: var(--ot-bg-2-border); }
.e-7e93ff6e > .box.bg-2 > .tags > .tag { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }

.e-7e93ff6e > .box.bg-3 { background: var(--ot-bg-3); }
.e-7e93ff6e > .box.bg-3 > .stats { border-color: var(--ot-bg-3-border); }
.e-7e93ff6e > .box.bg-3 > .tags > .tag { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }

.e-7e93ff6e > .box.bg-4 { background: var(--ot-bg-4); }
.e-7e93ff6e > .box.bg-4 > .stats { border-color: var(--ot-bg-4-border); }
.e-7e93ff6e > .box.bg-4 > .tags > .tag { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }

/* ===== BORDER ===== */

.e-7e93ff6e > .box.border { border-color: var(--ot-bg-2-border); }
.e-7e93ff6e > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-7e93ff6e > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-7e93ff6e > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-7e93ff6e > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-7e93ff6e > .box.size-s
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-7e93ff6e > .box.size-s > .header > .icon { width: 32px; height: 32px; }
.e-7e93ff6e > .box.size-s > .header > .icon > i { font-size: 18px; }
.e-7e93ff6e > .box.size-s > .header > .text > .title { font-size: 14px; }
.e-7e93ff6e > .box.size-s > .rows > .row { font-size: 12px; padding: 4px 0; }

.e-7e93ff6e > .box.size-l
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-l);
}

.e-7e93ff6e > .box.size-l > .header > .icon { width: 48px; height: 48px; }
.e-7e93ff6e > .box.size-l > .header > .icon > i { font-size: 26px; }
.e-7e93ff6e > .box.size-l > .header > .text > .title { font-size: 20px; }
.e-7e93ff6e > .box.size-l > .rows > .row { font-size: 14px; padding: 8px 0; }
.e-7e93ff6e > .box.size-l > .stats > .stat > .stat-icon { width: 40px; height: 40px; font-size: 22px; }
.e-7e93ff6e > .box.size-l > .stats > .stat > .stat-text > .value { font-size: 24px; }
/* ===== CARDS PROFILE ===== */

.e-7dbb0917
{
	display: contents;
}

/* Box */

.e-7dbb0917 > .box
{
	position: relative;
	display: flex;
	width: 100%;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	transition: border-color var(--ot-transition), box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-7dbb0917 > .box.vertical
{
	flex-direction: column;
}

.e-7dbb0917 > .box.horizontal
{
	flex-direction: row;
	align-items: center;
	gap: var(--ot-spacing-m);
}

/* Link overlay */

.e-7dbb0917 > .box > .link
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-7dbb0917 > .box:has(> .link):hover
{
	transform: translateY(-2px);
	box-shadow: var(--ot-shadow-m);
}

/* Cover */

.e-7dbb0917 > .box > .cover
{
	height: 120px;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
}

.e-7dbb0917 > .box.horizontal > .cover
{
	display: none;
}

/* Body */

.e-7dbb0917 > .box > .body
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-l);
	flex: 1;
	min-width: 0;
}

/* Cover offset */

.e-7dbb0917 > .box.vertical:has(> .cover) > .body
{
	margin-top: -36px;
}

/* Head */

.e-7dbb0917 > .box > .body > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	min-width: 0;
}

/* Avatar */

.e-7dbb0917 > .box > .body > .head > .avatar
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	border: 3px solid var(--ot-bg-1);
	box-shadow: var(--ot-shadow-s);
	flex-shrink: 0;
}

.e-7dbb0917 > .box > .body > .head > .avatar > i
{
	font-size: 28px;
	color: var(--ot-text-3);
}

/* Identity */

.e-7dbb0917 > .box > .body > .head > .identity
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.e-7dbb0917 > .box > .body > .head > .identity > .name
{
	display: flex;
	align-items: center;
	gap: 5px;
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	line-height: 1.2;
	font-variation-settings: 'opsz' 144;
}

.e-7dbb0917 > .box > .body > .head > .identity > .name > .verified
{
	font-size: 15px;
	color: var(--ot-blue);
	font-variation-settings: 'FILL' 1;
}

.e-7dbb0917 > .box > .body > .head > .identity > .role
{
	font-size: 12px;
	color: var(--ot-text-2);
}

/* Description */

.e-7dbb0917 > .box > .body > .description
{
	margin: 0;
	font-size: var(--ot-size-m);
	line-height: 1.55;
	color: var(--ot-text-2);
}

/* Tags */

.e-7dbb0917 > .box > .body > .tags
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-x);
}

.e-7dbb0917 > .box > .body > .tags > .tag
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.e-7dbb0917 > .box > .body > .tags > .tag > i
{
	font-size: 13px;
}

/* Meta */

.e-7dbb0917 > .box > .body > .meta
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

/* Stats */

.e-7dbb0917 > .box > .body > .stats
{
	display: flex;
	gap: var(--ot-spacing-l);
	padding: var(--ot-spacing-m) 0;
	border-top: 1px solid var(--ot-bg-2-border);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-7dbb0917 > .box > .body > .stats > .stat > .num
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 600;
	color: var(--ot-text-1);
	line-height: 1;
	font-variation-settings: 'opsz' 144;
	margin-bottom: 3px;
}

.e-7dbb0917 > .box > .body > .stats > .stat > .label
{
	font-size: 10px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* Socials */

.e-7dbb0917 > .box > .body > .socials
{
	display: flex;
	gap: var(--ot-spacing-s);
}

.e-7dbb0917 > .box > .body > .socials > .social
{
	position: relative;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--ot-height-m);
	height: var(--ot-height-m);
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-2);
	text-decoration: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast), border-color var(--ot-transition-fast), transform var(--ot-transition-fast);
}

.e-7dbb0917 > .box > .body > .socials > .social:hover
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	border-color: var(--ot-brand);
	transform: translateY(-1px);
}

.e-7dbb0917 > .box > .body > .socials > .social > i
{
	font-size: 16px;
}

/* Actions */

.e-7dbb0917 > .box > .body > .actions
{
	position: relative;
	z-index: 3;
	display: flex;
	gap: var(--ot-spacing-s);
}

/* Follow */

.e-7dbb0917 > .box > .body > .follow
{
	position: relative;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-x);
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: var(--ot-size-m);
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
	align-self: flex-start;
}

.e-7dbb0917 > .box > .body > .follow:hover
{
	border-color: var(--ot-text-1);
	transform: translateY(-1px);
}

.e-7dbb0917 > .box > .body > .follow > i
{
	font-size: 16px;
}

.e-7dbb0917 > .box > .body > .follow.active
{
	background: var(--ot-text-1);
	border-color: var(--ot-text-1);
	color: var(--ot-bg-1);
}

/* ===== HORIZONTAL ===== */

.e-7dbb0917 > .box.horizontal > .body
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-7dbb0917 > .box.horizontal > .body > .stats
{
	padding: 0;
	border: none;
	gap: var(--ot-spacing-m);
}

/* ===== BACKGROUND ===== */

.e-7dbb0917 > .box.bg-1 { background: var(--ot-bg-1); }
.e-7dbb0917 > .box.bg-1 .avatar { border-color: var(--ot-bg-1); }
.e-7dbb0917 > .box.bg-1 .tag { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }
.e-7dbb0917 > .box.bg-1 .social { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }
.e-7dbb0917 > .box.bg-1 .stats { border-color: var(--ot-bg-1-border); }

.e-7dbb0917 > .box.bg-2 { background: var(--ot-bg-2); }
.e-7dbb0917 > .box.bg-2 .avatar { border-color: var(--ot-bg-2); }
.e-7dbb0917 > .box.bg-2 .tag { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }
.e-7dbb0917 > .box.bg-2 .social { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }
.e-7dbb0917 > .box.bg-2 .stats { border-color: var(--ot-bg-2-border); }

.e-7dbb0917 > .box.bg-3 { background: var(--ot-bg-3); }
.e-7dbb0917 > .box.bg-3 .avatar { border-color: var(--ot-bg-3); }
.e-7dbb0917 > .box.bg-3 .tag { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }
.e-7dbb0917 > .box.bg-3 .social { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }
.e-7dbb0917 > .box.bg-3 .stats { border-color: var(--ot-bg-3-border); }

.e-7dbb0917 > .box.bg-4 { background: var(--ot-bg-4); }
.e-7dbb0917 > .box.bg-4 .avatar { border-color: var(--ot-bg-4); }
.e-7dbb0917 > .box.bg-4 .tag { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }
.e-7dbb0917 > .box.bg-4 .social { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }
.e-7dbb0917 > .box.bg-4 .stats { border-color: var(--ot-bg-4-border); }

/* Border */

.e-7dbb0917 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-7dbb0917 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-7dbb0917 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-7dbb0917 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-7dbb0917 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

/* Small */

.e-7dbb0917 > .box.size-s > .body
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-7dbb0917 > .box.size-s .avatar { width: 44px; height: 44px; }
.e-7dbb0917 > .box.size-s .avatar > i { font-size: 22px; }
.e-7dbb0917 > .box.size-s .identity > .name { font-size: 15px; }
.e-7dbb0917 > .box.size-s .identity > .role { font-size: var(--ot-size-s); }
.e-7dbb0917 > .box.size-s .description { font-size: 12px; }
.e-7dbb0917 > .box.size-s .stats > .stat > .num { font-size: 16px; }
.e-7dbb0917 > .box.size-s.vertical:has(> .cover) > .body { margin-top: -28px; }

/* Medium */

.e-7dbb0917 > .box.size-m > .body
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-m);
}

.e-7dbb0917 > .box.size-m .avatar { width: 56px; height: 56px; }
.e-7dbb0917 > .box.size-m .avatar > i { font-size: 28px; }
.e-7dbb0917 > .box.size-m .identity > .name { font-size: 17px; }

/* Large */

.e-7dbb0917 > .box.size-l > .body
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-m);
}

.e-7dbb0917 > .box.size-l .avatar { width: 72px; height: 72px; }
.e-7dbb0917 > .box.size-l .avatar > i { font-size: 36px; }
.e-7dbb0917 > .box.size-l .identity > .name { font-size: 20px; }
.e-7dbb0917 > .box.size-l .identity > .role { font-size: var(--ot-size-m); }
.e-7dbb0917 > .box.size-l .description { font-size: 14px; }
.e-7dbb0917 > .box.size-l .stats > .stat > .num { font-size: var(--ot-size-l); }
.e-7dbb0917 > .box.size-l.vertical:has(> .cover) > .body { margin-top: -44px; }
.e-7dbb0917 > .box.size-l > .cover { height: 140px; }
/* ===== CARDS SHARE ===== */

.e-54760d1f
{
	display: contents;
}

/* Box */

.e-54760d1f > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	width: 100%;
	padding: var(--ot-spacing-l);
	border-radius: var(--ot-radius-l);
}

/* Title */

.e-54760d1f > .box > .title
{
	font-size: var(--ot-size-s);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ot-text-3);
	font-family: var(--ot-font-primary);
}

/* Actions */

.e-54760d1f > .box > .actions
{
	display: flex;
	gap: var(--ot-spacing-s);
	flex-wrap: wrap;
}

/* Action button */

.e-54760d1f > .box > .actions > .action
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-x);
	min-width: 38px;
	height: 38px;
	padding: 0 var(--ot-spacing-s);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	color: var(--ot-text-2);
	cursor: pointer;
	font-family: var(--ot-font-primary);
	font-size: 12.5px;
	font-weight: 600;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-54760d1f > .box > .actions > .action:hover
{
	background: var(--ot-bg-2-hover);
	color: var(--ot-text-1);
	transform: translateY(-1px);
}

.e-54760d1f > .box > .actions > .action:active
{
	transform: translateY(0) scale(0.95);
	transition-duration: 100ms;
}

.e-54760d1f > .box > .actions > .action > i
{
	font-size: 17px;
	transition: transform var(--ot-transition);
}

.e-54760d1f > .box > .actions > .action > .count
{
	font-variant-numeric: tabular-nums;
}

/* Copied state */

.e-54760d1f > .box > .actions > .action.copied
{
	background: var(--ot-green-opacity);
	border-color: var(--ot-green);
	color: var(--ot-green);
}

.e-54760d1f > .box > .actions > .action.copied > i
{
	animation: e-54760d1f-pop 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-54760d1f-pop
{
	0% { transform: scale(0.5); opacity: 0; }
	60% { transform: scale(1.2); opacity: 1; }
	100% { transform: scale(1); }
}

/* Saved state */

.e-54760d1f > .box > .actions > .action.saved
{
	background: var(--ot-text-1);
	border-color: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-54760d1f > .box > .actions > .action.saved > i
{
	font-variation-settings: 'FILL' 1;
	animation: e-54760d1f-pop 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Liked state */

.e-54760d1f > .box > .actions > .action.liked
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-54760d1f > .box > .actions > .action.liked > i
{
	font-variation-settings: 'FILL' 1;
	animation: e-54760d1f-heart 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-54760d1f-heart
{
	0% { transform: scale(1); }
	30% { transform: scale(0.7); }
	60% { transform: scale(1.3); }
	100% { transform: scale(1); }
}

/* Platforms */

.e-54760d1f > .box > .platforms
{
	display: flex;
	gap: var(--ot-spacing-s);
	padding-top: var(--ot-spacing-m);
	border-top: 1px solid var(--ot-bg-2-border);
	flex-wrap: wrap;
}

.e-54760d1f > .box > .platforms > .platform
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-2);
	text-decoration: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-54760d1f > .box > .platforms > .platform > i
{
	font-size: 17px;
}

.e-54760d1f > .box > .platforms > .platform > svg
{
	width: 16px;
	height: 16px;
	display: block;
}

.e-54760d1f > .box > .platforms > .platform:hover
{
	transform: translateY(-2px);
}

.e-54760d1f > .box > .platforms > .platform[data-platform="twitter"]:hover { background: #1DA1F2; border-color: #1DA1F2; color: #fff; }
.e-54760d1f > .box > .platforms > .platform[data-platform="facebook"]:hover { background: #1877F2; border-color: #1877F2; color: #fff; }
.e-54760d1f > .box > .platforms > .platform[data-platform="linkedin"]:hover { background: #0A66C2; border-color: #0A66C2; color: #fff; }
.e-54760d1f > .box > .platforms > .platform[data-platform="whatsapp"]:hover { background: #25D366; border-color: #25D366; color: #fff; }
.e-54760d1f > .box > .platforms > .platform[data-platform="telegram"]:hover { background: #26A5E4; border-color: #26A5E4; color: #fff; }
.e-54760d1f > .box > .platforms > .platform[data-platform="email"]:hover { background: var(--ot-text-1); border-color: var(--ot-text-1); color: var(--ot-bg-1); }

/* ===== ORIENTATION: VERTICAL ===== */

.e-54760d1f > .box.vertical > .actions
{
	flex-direction: column;
	align-items: stretch;
}

.e-54760d1f > .box.vertical > .actions > .action
{
	justify-content: center;
}

.e-54760d1f > .box.vertical > .platforms
{
	flex-direction: column;
	align-items: stretch;
}

.e-54760d1f > .box.vertical > .platforms > .platform
{
	width: 100%;
	height: 38px;
	border-radius: var(--ot-radius-m);
	justify-content: center;
	gap: var(--ot-spacing-s);
}

/* ===== VARIANT: INLINE ===== */

.e-54760d1f > .box.inline
{
	padding: 0;
	background: transparent !important;
	border: none !important;
	border-radius: 0;
	flex-direction: row;
	align-items: center;
	gap: var(--ot-spacing-m);
}

.e-54760d1f > .box.inline > .title
{
	margin: 0;
}

.e-54760d1f > .box.inline > .platforms
{
	padding-top: 0;
	border-top: none;
	border-left: 1px solid var(--ot-bg-2-border);
	padding-left: var(--ot-spacing-m);
}

/* ===== VARIANT: COMPACT ===== */

.e-54760d1f > .box.compact
{
	padding: var(--ot-spacing-s);
	gap: var(--ot-spacing-x);
}

.e-54760d1f > .box.compact > .title
{
	display: none;
}

.e-54760d1f > .box.compact > .actions > .action
{
	min-width: 34px;
	height: 34px;
	padding: 0 var(--ot-spacing-x);
}

/* ===== BACKGROUND ===== */

.e-54760d1f > .box.bg-1 { background: var(--ot-bg-1); }
.e-54760d1f > .box.bg-1 > .actions > .action { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }
.e-54760d1f > .box.bg-1 > .actions > .action:hover { background: var(--ot-bg-1-hover); }
.e-54760d1f > .box.bg-1 > .platforms { border-color: var(--ot-bg-1-border); }
.e-54760d1f > .box.bg-1 > .platforms > .platform { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }

.e-54760d1f > .box.bg-2 { background: var(--ot-bg-2); }
.e-54760d1f > .box.bg-2 > .actions > .action { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }
.e-54760d1f > .box.bg-2 > .actions > .action:hover { background: var(--ot-bg-2-hover); }
.e-54760d1f > .box.bg-2 > .platforms { border-color: var(--ot-bg-2-border); }
.e-54760d1f > .box.bg-2 > .platforms > .platform { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }

.e-54760d1f > .box.bg-3 { background: var(--ot-bg-3); }
.e-54760d1f > .box.bg-3 > .actions > .action { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }
.e-54760d1f > .box.bg-3 > .actions > .action:hover { background: var(--ot-bg-3-hover); }
.e-54760d1f > .box.bg-3 > .platforms { border-color: var(--ot-bg-3-border); }
.e-54760d1f > .box.bg-3 > .platforms > .platform { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }

.e-54760d1f > .box.bg-4 { background: var(--ot-bg-4); }
.e-54760d1f > .box.bg-4 > .actions > .action { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }
.e-54760d1f > .box.bg-4 > .actions > .action:hover { background: var(--ot-bg-4-hover); }
.e-54760d1f > .box.bg-4 > .platforms { border-color: var(--ot-bg-4-border); }
.e-54760d1f > .box.bg-4 > .platforms > .platform { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }

/* ===== VARIANT: BORDER ===== */

.e-54760d1f > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-54760d1f > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-54760d1f > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-54760d1f > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-54760d1f > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-54760d1f > .box.size-s
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-54760d1f > .box.size-s > .actions > .action
{
	min-width: 32px;
	height: 32px;
	font-size: var(--ot-size-s);
}

.e-54760d1f > .box.size-s > .actions > .action > i
{
	font-size: 15px;
}

.e-54760d1f > .box.size-s > .platforms > .platform
{
	width: 32px;
	height: 32px;
}

.e-54760d1f > .box.size-s > .platforms > .platform > i
{
	font-size: 15px;
}

.e-54760d1f > .box.size-s > .platforms > .platform > svg
{
	width: 14px;
	height: 14px;
}

.e-54760d1f > .box.size-l
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-l);
}

.e-54760d1f > .box.size-l > .title
{
	font-size: 12.5px;
}

.e-54760d1f > .box.size-l > .actions > .action
{
	min-width: 44px;
	height: 44px;
	padding: 0 var(--ot-spacing-m);
	font-size: 13.5px;
}

.e-54760d1f > .box.size-l > .actions > .action > i
{
	font-size: 19px;
}

.e-54760d1f > .box.size-l > .platforms > .platform
{
	width: 44px;
	height: 44px;
}

.e-54760d1f > .box.size-l > .platforms > .platform > i
{
	font-size: 19px;
}

.e-54760d1f > .box.size-l > .platforms > .platform > svg
{
	width: 18px;
	height: 18px;
}
/* ===== CORE BUILDER ===== */

.e-7d599f7d
{
	display: flex;
	width: 100%;
}

/* Box */

.e-7d599f7d > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: var(--ot-spacing-l);
}

.e-7d599f7d > .box.has-steps.steps-vertical
{
	flex-direction: row;
	align-items: flex-start;
	gap: var(--ot-spacing-m);
}

.e-7d599f7d > .box.has-steps.steps-horizontal
{
	flex-direction: column;
	gap: var(--ot-spacing-m);
}

/* Steps sidebar */

.e-7d599f7d > .box.steps-vertical > .steps
{
	flex-shrink: 0;
	width: 260px;
	min-width: 260px;
	max-width: 260px;
	position: sticky;
	top: 0;
}

.e-7d599f7d > .box.steps-horizontal > .steps
{
	width: 100%;
}

/* Main */

.e-7d599f7d > .box > .main
{
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	gap: var(--ot-spacing-l);
}

/* Sections */

.e-7d599f7d > .box > .main > .sections
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
}

.e-7d599f7d > .box > .main > .sections > .step-panel
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
}

/* Grid */

.e-7d599f7d .grid
{
	display: grid;
	gap: var(--ot-spacing-m);
	width: 100%;
}

/* Footer */

.e-7d599f7d > .box > .main > .footer
{
	display: flex;
	justify-content: flex-end;
}

/* ===== BACKGROUND ===== */

.e-7d599f7d > .box.bg-1 { background: var(--ot-bg-1); padding: var(--ot-spacing-l); border-radius: var(--ot-radius-m); }
.e-7d599f7d > .box.bg-2 { background: var(--ot-bg-2); padding: var(--ot-spacing-l); border-radius: var(--ot-radius-m); }
.e-7d599f7d > .box.bg-3 { background: var(--ot-bg-3); padding: var(--ot-spacing-l); border-radius: var(--ot-radius-m); }
.e-7d599f7d > .box.bg-4 { background: var(--ot-bg-4); padding: var(--ot-spacing-l); border-radius: var(--ot-radius-m); }

/* ===== BORDER ===== */

.e-7d599f7d > .box.border
{
	border: 1px solid var(--ot-bg-2-border);
	padding: var(--ot-spacing-l);
	border-radius: var(--ot-radius-m);
}

/* ===== SIZE ===== */

.e-7d599f7d > .box.size-s { gap: var(--ot-spacing-m); }
.e-7d599f7d > .box.size-s > .main { gap: var(--ot-spacing-m); }
.e-7d599f7d > .box.size-s > .main > .sections { gap: var(--ot-spacing-m); }
.e-7d599f7d > .box.size-s > .main > .sections > .step-panel { gap: var(--ot-spacing-m); }
.e-7d599f7d > .box.size-s .grid { gap: var(--ot-spacing-s); }

.e-7d599f7d > .box.size-l .grid { gap: var(--ot-spacing-l); }

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-7d599f7d > .box.has-steps
	{
		flex-direction: column;
	}

	.e-7d599f7d > .box > .steps
	{
		width: 100%;
		position: static;
	}

	.e-7d599f7d .grid
	{
		grid-template-columns: 1fr !important;
	}
}
/* ===== CORE REPEATER ===== */

.e-d62eba0
{
	display: flex;
	width: 100%;
}

/* Box */

.e-d62eba0 > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	width: 100%;
	border-radius: var(--ot-radius-m);
	border: 1px solid transparent;
}

/* ===== ROWS ===== */

.e-d62eba0 > .box > .rows
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* Row */

.e-d62eba0 > .box > .rows > .row
{
	position: relative;
	display: flex;
	align-items: stretch;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-d62eba0 > .box > .rows > .row:hover
{
	border-color: var(--ot-bg-3-border);
}

/* Reorder */

.e-d62eba0 > .box > .rows > .row > .reorder
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	gap: 2px;
	align-self: center;
}

.e-d62eba0 > .box > .rows > .row > .reorder > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 18px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-d62eba0 > .box > .rows > .row > .reorder > .action:hover:not(:disabled)
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-d62eba0 > .box > .rows > .row > .reorder > .action:disabled
{
	opacity: 0.3;
	cursor: not-allowed;
}

.e-d62eba0 > .box > .rows > .row > .reorder > .action > i
{
	font-size: 18px;
}

/* Number */

.e-d62eba0 > .box > .rows > .row > .number
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	align-self: center;
	border: 1px solid transparent;
	border-radius: 50%;
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-2);
}

/* Fields */

.e-d62eba0 > .box > .rows > .row > .fields
{
	display: flex;
	flex: 1;
	gap: var(--ot-spacing-s);
	min-width: 0;
}

.e-d62eba0 > .box.vertical > .rows > .row > .fields
{
	flex-direction: column;
}

/* Field */

.e-d62eba0 > .box > .rows > .row > .fields > .field
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	flex: 1;
	min-width: 0;
}

.e-d62eba0 > .box > .rows > .row > .fields > .field > .field-info
{
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.e-d62eba0 > .box > .rows > .row > .fields > .field > .field-info > .field-label
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-2);
	line-height: 1.2;
}

.e-d62eba0 > .box > .rows > .row > .fields > .field > .field-info > .field-description
{
	font-family: var(--ot-font-primary);
	font-size: 10.5px;
	color: var(--ot-text-3);
	line-height: 1.3;
}

/* Hide labels on subsequent rows in horizontal mode */

.e-d62eba0 > .box.horizontal > .rows > .row:not(:first-child) .field > .field-info
{
	display: none;
}

/* Row actions */

.e-d62eba0 > .box > .rows > .row > .actions
{
	display: flex;
	align-items: center;
	gap: 2px;
	flex-shrink: 0;
	align-self: center;
}

.e-d62eba0 > .box > .rows > .row > .actions > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-d62eba0 > .box > .rows > .row > .actions > .action:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-d62eba0 > .box > .rows > .row > .actions > .action.danger:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

.e-d62eba0 > .box > .rows > .row > .actions > .action > i
{
	font-size: 16px;
}

/* ===== EMPTY ===== */

.e-d62eba0 > .box > .empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-l);
	border: 1px dashed var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

.e-d62eba0 > .box > .empty > .empty-icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-3);
}

.e-d62eba0 > .box > .empty > .empty-icon > i
{
	font-size: 24px;
}

.e-d62eba0 > .box > .empty > .empty-text
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	color: var(--ot-text-2);
}

/* ===== FOOTER ===== */

.e-d62eba0 > .box > .footer
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ot-spacing-s);
}

.e-d62eba0 > .box > .footer > .counter
{
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.e-d62eba0 > .box > .footer > .footer-actions
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

.e-d62eba0 > .box > .empty > .empty-actions
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

/* ===== ITERATION ===== */

.e-d62eba0 > .box > .iteration
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* Iteration chip */

.e-d62eba0 > .box > .iteration > .iteration-chip
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: var(--ot-brand-opacity);
	border: 1px solid var(--ot-brand-opacity);
	border-radius: var(--ot-radius-m);
	transition: border-color var(--ot-transition);
}

.e-d62eba0 > .box > .iteration > .iteration-chip:hover
{
	border-color: var(--ot-brand);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-brand);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-text
{
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	gap: 2px;
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-text > .iteration-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-text > .iteration-expression
{
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-m);
	font-weight: 600;
	color: var(--ot-brand);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-count
{
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	padding: 2px var(--ot-spacing-s);
	background: var(--ot-bg-1);
	border-radius: 100px;
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-brand);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-action:hover
{
	background: var(--ot-bg-1);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-action.danger:hover
{
	background: rgba(244,63,94,0.18);
	color: var(--ot-red);
}

.e-d62eba0 > .box > .iteration > .iteration-chip > .iteration-action > i
{
	font-size: 14px;
}

/* Iteration template editor */

.e-d62eba0 > .box > .iteration > .iteration-template
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

.e-d62eba0 > .box > .iteration > .iteration-template > .iteration-template-head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding-bottom: var(--ot-spacing-s);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-d62eba0 > .box > .iteration > .iteration-template > .iteration-template-head > i
{
	font-size: 16px;
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-d62eba0 > .box > .iteration > .iteration-template > .iteration-template-head > .iteration-template-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-2);
}

.e-d62eba0 > .box > .iteration > .iteration-template > .iteration-template-head > .iteration-template-hint
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

.e-d62eba0 > .box > .iteration > .iteration-template > .iteration-template-head > .iteration-template-hint > code
{
	padding: 1px 5px;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: 11px;
	color: var(--ot-text-2);
}

.e-d62eba0 > .box > .iteration > .iteration-template > .fields
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* Iteration preview */

.e-d62eba0 > .box > .iteration > .iteration-preview
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: var(--ot-spacing-s);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	max-height: 200px;
	overflow-y: auto;
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-preview-head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-preview-head > i
{
	font-size: 13px;
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-row
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: 4px var(--ot-spacing-s);
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-s);
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-row:nth-child(odd)
{
	background: var(--ot-bg-1);
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-row > .iteration-row-index
{
	flex-shrink: 0;
	width: 22px;
	color: var(--ot-text-3);
	font-weight: 700;
	text-align: right;
}

.e-d62eba0 > .box > .iteration > .iteration-preview > .iteration-row > .iteration-row-text
{
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--ot-text-2);
}

/* Iteration empty */

.e-d62eba0 > .box > .iteration > .iteration-empty
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	background: var(--ot-bg-2);
	border: 1px dashed var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-3);
	font-size: var(--ot-size-s);
}

.e-d62eba0 > .box > .iteration > .iteration-empty > i
{
	font-size: 16px;
}

/* ===== BACKGROUND ===== */

.e-d62eba0 > .box.bg-1 > .rows > .row { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-d62eba0 > .box.bg-1 > .rows > .row:hover { background: var(--ot-bg-1-hover); }
.e-d62eba0 > .box.bg-1 > .empty { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-d62eba0 > .box.bg-1 .number { background: var(--ot-bg-2); border-color: var(--ot-bg-1-border); }

.e-d62eba0 > .box.bg-2 > .rows > .row { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-d62eba0 > .box.bg-2 > .rows > .row:hover { background: var(--ot-bg-2-hover); }
.e-d62eba0 > .box.bg-2 > .empty { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-d62eba0 > .box.bg-2 .number { background: var(--ot-bg-3); border-color: var(--ot-bg-2-border); }
.e-d62eba0 > .box.bg-2 .action:hover { background: var(--ot-bg-1); }

.e-d62eba0 > .box.bg-3 > .rows > .row { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-d62eba0 > .box.bg-3 > .rows > .row:hover { background: var(--ot-bg-3-hover); }
.e-d62eba0 > .box.bg-3 > .empty { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-d62eba0 > .box.bg-3 .number { background: var(--ot-bg-4); border-color: var(--ot-bg-3-border); }
.e-d62eba0 > .box.bg-3 .action:hover { background: var(--ot-bg-2); }

.e-d62eba0 > .box.bg-4 > .rows > .row { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }
.e-d62eba0 > .box.bg-4 > .rows > .row:hover { background: var(--ot-bg-4-hover); }
.e-d62eba0 > .box.bg-4 > .empty { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }
.e-d62eba0 > .box.bg-4 .number { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }
.e-d62eba0 > .box.bg-4 .action:hover { background: var(--ot-bg-3); }

/* ===== BORDER ===== */

.e-d62eba0 > .box.border { border-color: var(--ot-bg-2-border); padding: var(--ot-spacing-m); }
.e-d62eba0 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-d62eba0 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-d62eba0 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-d62eba0 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-d62eba0 > .box.size-s > .rows > .row { padding: var(--ot-spacing-x); gap: var(--ot-spacing-x); }
.e-d62eba0 > .box.size-s > .rows > .row > .fields { gap: var(--ot-spacing-x); }
.e-d62eba0 > .box.size-s .action { width: 24px; height: 24px; }
.e-d62eba0 > .box.size-s .action > i { font-size: 14px; }

.e-d62eba0 > .box.size-m > .rows > .row { padding: var(--ot-spacing-s); gap: var(--ot-spacing-s); }
.e-d62eba0 > .box.size-m > .rows > .row > .fields { gap: var(--ot-spacing-s); }

.e-d62eba0 > .box.size-l > .rows > .row { padding: var(--ot-spacing-m); gap: var(--ot-spacing-m); }
.e-d62eba0 > .box.size-l > .rows > .row > .fields { gap: var(--ot-spacing-m); }
.e-d62eba0 > .box.size-l .action { width: 32px; height: 32px; }
.e-d62eba0 > .box.size-l .action > i { font-size: 18px; }

/* ===== DISABLED ===== */

.e-d62eba0 > .box.disabled > .rows > .row
{
	opacity: 0.7;
	cursor: not-allowed;
}
/* ===== DATA FILTERS ===== */

.e-435be612
{
	display: contents;
}

/* Box */

.e-435be612 > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

.e-435be612 > .box.sticky
{
	position: sticky;
	top: var(--ot-spacing-m);
	max-height: calc(100vh - var(--ot-spacing-l));
}

/* ===== BACKGROUND ===== */

.e-435be612 > .box.bg-1 { background: var(--ot-bg-1); }
.e-435be612 > .box.bg-2 { background: var(--ot-bg-2); }
.e-435be612 > .box.bg-3 { background: var(--ot-bg-3); }
.e-435be612 > .box.bg-4 { background: var(--ot-bg-4); }

/* ===== BORDER ===== */

.e-435be612 > .box.border { border-color: var(--ot-bg-2-border); }
.e-435be612 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-435be612 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-435be612 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-435be612 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== BORDER-LEFT ===== */

.e-435be612 > .box.border-left
{
	border: none;
	border-left: 1px solid var(--ot-bg-2-border);
	border-radius: 0;
}

.e-435be612 > .box.bg-1.border-left { border-left-color: var(--ot-bg-1-border); }
.e-435be612 > .box.bg-2.border-left { border-left-color: var(--ot-bg-2-border); }
.e-435be612 > .box.bg-3.border-left { border-left-color: var(--ot-bg-3-border); }
.e-435be612 > .box.bg-4.border-left { border-left-color: var(--ot-bg-4-border); }

/* ===== MODIFIERS ===== */

.e-435be612 > .box.clean
{
	background: transparent;
	border-color: transparent;
}

/* ===== HEAD ===== */

.e-435be612 > .box > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	height: 65px;
	padding: 0 var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-435be612 > .box > .head > .head-title
{
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 1;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 700;
	color: var(--ot-text-1);
	min-width: 0;
}

.e-435be612 > .box > .head > .head-title > i
{
	font-size: 18px;
	color: var(--ot-text-2);
}

.e-435be612 > .box > .head > .head-title > .head-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	background: var(--ot-brand);
	color: #fff;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	margin-left: 4px;
}

.e-435be612 > .box > .head > .head-clear
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 10px;
	background: transparent;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-435be612 > .box > .head > .head-clear:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-3-border);
}

.e-435be612 > .box > .head > .head-clear > i
{
	font-size: 14px;
}

/* ===== GROUPS ===== */

.e-435be612 > .box > .groups
{
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	flex: 1;
}

.e-435be612 > .box > .groups > .group
{
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-435be612 > .box > .groups > .group:last-child
{
	border-bottom: none;
}

/* Group head */

.e-435be612 > .box > .groups > .group > .group-head
{
	display: flex;
	align-items: center;
	gap: 6px;
	height: 44px;
	padding: 0 var(--ot-spacing-m);
	user-select: none;
}

.e-435be612 > .box > .groups > .group > .group-head.collapsible
{
	cursor: pointer;
}

.e-435be612 > .box > .groups > .group > .group-head > .group-label
{
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-435be612 > .box > .groups > .group > .group-head > .group-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 16px;
	padding: 0 5px;
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
}

.e-435be612 > .box > .groups > .group > .group-head > .group-spacer
{
	flex: 1;
}

.e-435be612 > .box > .groups > .group > .group-head > .group-clear
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-435be612 > .box > .groups > .group > .group-head > .group-clear:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

.e-435be612 > .box > .groups > .group > .group-head > .group-clear > i
{
	font-size: 14px;
}

.e-435be612 > .box > .groups > .group > .group-head > .group-chevron
{
	font-size: 18px;
	color: var(--ot-text-3);
	transition: transform var(--ot-transition);
}

.e-435be612 > .box > .groups > .group.collapsed > .group-head > .group-chevron
{
	transform: rotate(-90deg);
}

/* Group body */

.e-435be612 > .box > .groups > .group > .group-body
{
	padding: 0 var(--ot-spacing-m) var(--ot-spacing-m);
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-435be612 > .box > .groups > .group > .group-body:first-child
{
	padding-top: var(--ot-spacing-m);
}

/* ===== OPTIONS (checkbox / radio wrappers) ===== */

.e-435be612 > .box > .groups > .group > .group-body > .options
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-435be612 > .box > .groups > .group > .group-body > .options > .search
{
	margin-bottom: var(--ot-spacing-s);
}

/* Show more */

.e-435be612 > .box > .groups > .group > .group-body > .options > .show-more
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 4px;
	padding: 6px 10px;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-brand);
	cursor: pointer;
	transition: background var(--ot-transition);
	align-self: flex-start;
}

.e-435be612 > .box > .groups > .group > .group-body > .options > .show-more:hover
{
	background: var(--ot-brand-opacity);
}

.e-435be612 > .box > .groups > .group > .group-body > .options > .show-more > i
{
	font-size: 16px;
}

/* ===== TAGS ===== */

.e-435be612 > .box > .groups > .group > .group-body > .tags
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-435be612 > .box > .groups > .group > .group-body > .tags > .tag
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-435be612 > .box > .groups > .group > .group-body > .tags > .tag:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-435be612 > .box > .groups > .group > .group-body > .tags > .tag.active
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-435be612 > .box > .groups > .group > .group-body > .tags > .tag > i
{
	font-size: 15px;
}

.e-435be612 > .box > .groups > .group > .group-body > .tags > .tag > .tag-count
{
	font-size: 11px;
	font-weight: 700;
	opacity: 0.75;
	font-variant-numeric: tabular-nums;
}

/* ===== RANGE ===== */

.e-435be612 > .box > .groups > .group > .group-body > .range
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

.e-435be612 > .box > .groups > .group > .group-body > .range > .range-dash
{
	color: var(--ot-text-3);
	font-weight: 500;
}

/* ===== DATE RANGE ===== */

.e-435be612 > .box > .groups > .group > .group-body > .date-range
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* ===== TOGGLE ===== */

.e-435be612 > .box > .groups > .group > .group-body > .toggle-wrap
{
	padding: 4px 0;
}

/* ===== FOOT ===== */

.e-435be612 > .box > .foot
{
	padding: var(--ot-spacing-m);
	border-top: 1px solid var(--ot-bg-2-border);
}

/* ===== HORIZONTAL ===== */

.e-435be612 > .box.horizontal > .groups
{
	flex-direction: row;
	align-items: flex-start;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	overflow-x: auto;
	overflow-y: visible;
}

.e-435be612 > .box.horizontal > .groups > .group
{
	min-width: 200px;
	border-bottom: none;
	border-right: 1px solid var(--ot-bg-2-border);
	padding-right: var(--ot-spacing-m);
}

.e-435be612 > .box.horizontal > .groups > .group:last-child
{
	border-right: none;
	padding-right: 0;
}

.e-435be612 > .box.horizontal > .groups > .group > .group-head,
.e-435be612 > .box.horizontal > .groups > .group > .group-body
{
	padding-left: 0;
	padding-right: 0;
}
/* ===== DATA TABLE ===== */

.e-305e9281
{
	display: block;
	width: 100%;
}

/* Box */

.e-305e9281 > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

/* ===== BACKGROUND ===== */

.e-305e9281 > .box.bg-1 { background: var(--ot-bg-1); }
.e-305e9281 > .box.bg-2 { background: var(--ot-bg-2); }
.e-305e9281 > .box.bg-3 { background: var(--ot-bg-3); }
.e-305e9281 > .box.bg-4 { background: var(--ot-bg-4); }

/* ===== BORDER ===== */

.e-305e9281 > .box.border { border-color: var(--ot-bg-2-border); }
.e-305e9281 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-305e9281 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-305e9281 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-305e9281 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== MODIFIERS ===== */

.e-305e9281 > .box.border-bottom
{
	border-color: transparent;
	border-bottom-color: var(--ot-bg-2-border);
	border-radius: 0;
}

.e-305e9281 > .box.bg-1.border-bottom { border-bottom-color: var(--ot-bg-1-border); }
.e-305e9281 > .box.bg-2.border-bottom { border-bottom-color: var(--ot-bg-2-border); }
.e-305e9281 > .box.bg-3.border-bottom { border-bottom-color: var(--ot-bg-3-border); }
.e-305e9281 > .box.bg-4.border-bottom { border-bottom-color: var(--ot-bg-4-border); }

.e-305e9281 > .box.clean
{
	border-color: transparent;
	border-radius: 0;
}

/* ===== HEAD ===== */

.e-305e9281 > .box > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-305e9281 > .box > .head > .head-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
	flex-shrink: 0;
}

.e-305e9281 > .box > .head > .head-icon > i
{
	font-size: 22px;
}

.e-305e9281 > .box > .head > .head-text
{
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	gap: 2px;
}

.e-305e9281 > .box > .head > .head-text > .head-title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.018em;
	color: var(--ot-text-1);
	line-height: 1.15;
	font-variation-settings: 'opsz' 144;
}

.e-305e9281 > .box > .head > .head-text > .head-description
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.5;
}

.e-305e9281 > .box > .head > .head-actions
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

/* ===== TOOLBAR ===== */

.e-305e9281 > .box > .toolbar
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-305e9281 > .box > .toolbar > .toolbar-search
{
	flex: 1 1 auto;
	max-width: 320px;
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	margin-left: auto;
	padding: 4px var(--ot-spacing-s) 4px var(--ot-spacing-m);
	background: var(--ot-brand-opacity);
	border: 1px solid var(--ot-brand-border);
	border-radius: var(--ot-radius-s);
	animation: e-305e9281-bulk-in 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-305e9281-bulk-in
{
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk > .toolbar-bulk-count
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	color: var(--ot-brand);
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk > .toolbar-bulk-actions
{
	display: flex;
	align-items: center;
	gap: 2px;
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-action
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 10px;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-action:hover
{
	background: var(--ot-bg-1);
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-action.danger:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-action > i
{
	font-size: 15px;
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-clear
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-brand);
	cursor: pointer;
	margin-left: 4px;
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-clear:hover
{
	background: var(--ot-bg-1);
}

.e-305e9281 > .box > .toolbar > .toolbar-bulk .bulk-clear > i
{
	font-size: 16px;
}

/* ===== TABLE ===== */

.e-305e9281 > .box > .table
{
	display: flex;
	flex-direction: column;
	overflow-x: auto;
}

.e-305e9281 > .box > .table > .row,
.e-305e9281 > .box > .table > div > .row
{
	display: grid;
	align-items: center;
	min-height: 48px;
	padding: 0 var(--ot-spacing-m);
	gap: var(--ot-spacing-m);
	transition: background var(--ot-transition);
}

/* Head row */

.e-305e9281 > .box > .table > .head-row
{
	min-height: 42px;
	background: var(--ot-bg-2);
	border-bottom: 1px solid var(--ot-bg-2-border);
	position: sticky;
	top: 0;
	z-index: 2;
}

.e-305e9281 > .box.bg-2 > .table > .head-row { background: var(--ot-bg-3); }
.e-305e9281 > .box.bg-3 > .table > .head-row { background: var(--ot-bg-4); }

.e-305e9281 > .box > .table > .head-row > .cell
{
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-305e9281 > .box > .table > .head-row > .head-cell
{
	display: flex;
	align-items: center;
	gap: 4px;
	user-select: none;
}

.e-305e9281 > .box > .table > .head-row > .head-cell.sortable
{
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-305e9281 > .box > .table > .head-row > .head-cell.sortable:hover
{
	color: var(--ot-text-1);
}

.e-305e9281 > .box > .table > .head-row > .head-cell.sorted
{
	color: var(--ot-brand);
}

.e-305e9281 > .box > .table > .head-row > .head-cell > .sort-icon
{
	font-size: 14px;
	opacity: 0.6;
	transition: opacity var(--ot-transition);
}

.e-305e9281 > .box > .table > .head-row > .head-cell.sortable:hover > .sort-icon
{
	opacity: 1;
}

/* Body row */

.e-305e9281 > .box > .table > div > .body-row
{
	border-bottom: 1px solid var(--ot-bg-2-border);
	cursor: default;
}

.e-305e9281 > .box > .table > div > .body-row.clickable
{
	cursor: pointer;
}

.e-305e9281 > .box > .table > div:last-child > .body-row
{
	border-bottom: none;
}

.e-305e9281 > .box > .table > div > .body-row:hover
{
	background: var(--ot-bg-2);
}

.e-305e9281 > .box.bg-2 > .table > div > .body-row:hover { background: var(--ot-bg-3); }
.e-305e9281 > .box.bg-3 > .table > div > .body-row:hover { background: var(--ot-bg-4); }

.e-305e9281 > .box > .table > div > .body-row.selected
{
	background: var(--ot-brand-opacity);
}

/* Striped */

.e-305e9281 > .box.striped > .table > div:nth-child(even) > .body-row
{
	background: var(--ot-bg-2);
}

.e-305e9281 > .box.striped.bg-2 > .table > div:nth-child(even) > .body-row
{
	background: var(--ot-bg-3);
}

/* Sticky */

.e-305e9281 > .box.sticky > .table
{
	max-height: 560px;
	overflow-y: auto;
}

/* Cells */

.e-305e9281 > .box > .table .cell
{
	min-width: 0;
	padding: 10px 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-1);
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-305e9281 > .box > .table .cell.align-left { text-align: left; }
.e-305e9281 > .box > .table .cell.align-center { text-align: center; display: flex; justify-content: center; }
.e-305e9281 > .box > .table .cell.align-right { text-align: right; display: flex; justify-content: flex-end; }

/* Select cell */

.e-305e9281 > .box > .table .select-cell
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.e-305e9281 > .box > .table .select-cell > .select-box
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	padding: 0;
	background: var(--ot-bg-1);
	border: 1.5px solid var(--ot-bg-3-border);
	border-radius: 4px;
	color: transparent;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-305e9281 > .box > .table .select-cell > .select-box:hover
{
	border-color: var(--ot-brand);
}

.e-305e9281 > .box > .table .select-cell > .select-box.checked,
.e-305e9281 > .box > .table .select-cell > .select-box.indeterminate
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-305e9281 > .box > .table .select-cell > .select-box > i
{
	font-size: 14px;
	font-weight: 700;
}

/* Actions cell */

.e-305e9281 > .box > .table .actions-cell
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.e-305e9281 > .box > .table .actions-cell > .actions-trigger
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-305e9281 > .box > .table .actions-cell > .actions-trigger:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-305e9281 > .box > .table .actions-cell > .actions-trigger > i
{
	font-size: 18px;
}

/* ===== EMPTY ===== */

.e-305e9281 > .box > .empty
{
	padding: var(--ot-spacing-l);
}

/* ===== LOADING SKELETON ===== */

.e-305e9281 > .box > .table .skeleton
{
	background: linear-gradient(90deg, var(--ot-bg-2) 0%, var(--ot-bg-3) 50%, var(--ot-bg-2) 100%);
	background-size: 200% 100%;
	animation: e-305e9281-shimmer 1.4s infinite linear;
	border-radius: var(--ot-radius-s);
}

.e-305e9281 > .box > .table .skeleton-line
{
	height: 14px;
	width: 80%;
}

.e-305e9281 > .box > .table .skeleton-box
{
	width: 18px;
	height: 18px;
}

@keyframes e-305e9281-shimmer
{
	from { background-position: 200% 0; }
	to { background-position: -200% 0; }
}

/* ===== PAGINATION ===== */

.e-305e9281 > .box > .pagination
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-s) var(--ot-spacing-l);
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-305e9281 > .box > .pagination > .pagination-info
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	font-variant-numeric: tabular-nums;
}

.e-305e9281 > .box > .pagination > .pagination-controls
{
	display: flex;
	align-items: center;
	gap: 2px;
}

.e-305e9281 > .box > .pagination > .pagination-controls > .page-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-305e9281 > .box > .pagination > .pagination-controls > .page-btn:hover:not(:disabled)
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-2-border);
}

.e-305e9281 > .box > .pagination > .pagination-controls > .page-btn:disabled
{
	opacity: 0.35;
	cursor: not-allowed;
}

.e-305e9281 > .box > .pagination > .pagination-controls > .page-btn > i
{
	font-size: 18px;
}

.e-305e9281 > .box > .pagination > .pagination-controls > .page-current
{
	padding: 0 var(--ot-spacing-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	color: var(--ot-text-1);
	font-variant-numeric: tabular-nums;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 767.98px)
{
	.e-305e9281 > .box > .toolbar
	{
		flex-direction: column;
		align-items: stretch;
	}

	.e-305e9281 > .box > .toolbar > .toolbar-search
	{
		max-width: 100%;
	}

	.e-305e9281 > .box > .pagination
	{
		flex-direction: column;
		gap: var(--ot-spacing-s);
	}
}
/* ===== FORM BUTTON ===== */

.e-64e877b
{
	display: contents;
}

/* Box */

.e-64e877b > .box
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-s);
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	outline: none;
	user-select: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-64e877b > .box:hover { transform: translateY(-1px); }
.e-64e877b > .box:active { transform: translateY(0) scale(0.97); transition-duration: 100ms; }
.e-64e877b > .box:focus-visible { box-shadow: 0 0 0 1px var(--ot-brand-opacity); }

/* Body */

.e-64e877b > .box > .body
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

.e-64e877b > .box > .body > i
{
	font-size: 18px;
	transition: transform var(--ot-transition);
}

.e-64e877b > .box > .body > .left { margin-right: -2px; }
.e-64e877b > .box > .body > .right { margin-left: -2px; }
.e-64e877b > .box:hover > .body > .right { transform: translateX(2px); }

/* Spinner */

.e-64e877b > .box > .spin > i
{
	font-size: 18px;
	animation: e-64e877b-spin 0.8s linear infinite;
}

@keyframes e-64e877b-spin
{
	to { transform: rotate(360deg); }
}

/* States */

.e-64e877b > .box.disabled
{
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
	transform: none;
}

.e-64e877b > .box.loading
{
	cursor: wait;
	pointer-events: none;
}

/* ===== STYLE: SOLID ===== */

.e-64e877b > .box.solid.brand  { background: var(--ot-brand);  border-color: var(--ot-brand);  color: #fff; }
.e-64e877b > .box.solid.blue   { background: var(--ot-blue);   border-color: var(--ot-blue);   color: #fff; }
.e-64e877b > .box.solid.red    { background: var(--ot-red);    border-color: var(--ot-red);    color: #fff; }
.e-64e877b > .box.solid.orange { background: var(--ot-orange); border-color: var(--ot-orange); color: #fff; }
.e-64e877b > .box.solid.green  { background: var(--ot-green);  border-color: var(--ot-green);  color: #fff; }
.e-64e877b > .box.solid.dark   { background: var(--ot-text-1); border-color: var(--ot-text-1); color: var(--ot-bg-1); }

.e-64e877b > .box.solid.brand:hover  { background: var(--ot-brand-hover);  border-color: var(--ot-brand-hover); }
.e-64e877b > .box.solid.blue:hover   { background: var(--ot-blue-hover);   border-color: var(--ot-blue-hover); }
.e-64e877b > .box.solid.red:hover    { background: var(--ot-red-hover);    border-color: var(--ot-red-hover); }
.e-64e877b > .box.solid.orange:hover { background: var(--ot-orange-hover); border-color: var(--ot-orange-hover); }
.e-64e877b > .box.solid.green:hover  { background: var(--ot-green-hover);  border-color: var(--ot-green-hover); }
.e-64e877b > .box.solid.dark:hover   { background: var(--ot-text-2);       border-color: var(--ot-text-2); }

/* ===== STYLE: SOFT ===== */

.e-64e877b > .box.soft.brand  { background: var(--ot-brand-opacity);  color: var(--ot-brand); }
.e-64e877b > .box.soft.blue   { background: var(--ot-blue-opacity);   color: var(--ot-blue); }
.e-64e877b > .box.soft.red    { background: var(--ot-red-opacity);    color: var(--ot-red); }
.e-64e877b > .box.soft.orange { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-64e877b > .box.soft.green  { background: var(--ot-green-opacity);  color: var(--ot-green); }

.e-64e877b > .box.soft.brand:hover  { background: var(--ot-brand);  color: #fff; }
.e-64e877b > .box.soft.blue:hover   { background: var(--ot-blue);   color: #fff; }
.e-64e877b > .box.soft.red:hover    { background: var(--ot-red);    color: #fff; }
.e-64e877b > .box.soft.orange:hover { background: var(--ot-orange); color: #fff; }
.e-64e877b > .box.soft.green:hover  { background: var(--ot-green);  color: #fff; }

/* ===== STYLE: OUTLINE ===== */

.e-64e877b > .box.outline.brand  { border-color: var(--ot-brand);  color: var(--ot-brand); }
.e-64e877b > .box.outline.blue   { border-color: var(--ot-blue);   color: var(--ot-blue); }
.e-64e877b > .box.outline.red    { border-color: var(--ot-red);    color: var(--ot-red); }
.e-64e877b > .box.outline.orange { border-color: var(--ot-orange); color: var(--ot-orange); }
.e-64e877b > .box.outline.green  { border-color: var(--ot-green);  color: var(--ot-green); }

.e-64e877b > .box.outline.brand:hover  { background: var(--ot-brand-opacity); }
.e-64e877b > .box.outline.blue:hover   { background: var(--ot-blue-opacity); }
.e-64e877b > .box.outline.red:hover    { background: var(--ot-red-opacity); }
.e-64e877b > .box.outline.orange:hover { background: var(--ot-orange-opacity); }
.e-64e877b > .box.outline.green:hover  { background: var(--ot-green-opacity); }

/* ===== STYLE: GHOST ===== */

.e-64e877b > .box.ghost
{
	background: transparent;
	color: var(--ot-text-2);
}

.e-64e877b > .box.ghost:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

/* ===== STYLE: LINK ===== */

.e-64e877b > .box.link
{
	height: auto;
	padding: 0;
	background: transparent;
	border-color: transparent;
	color: var(--ot-brand);
}

.e-64e877b > .box.link:hover
{
	background: transparent;
	color: var(--ot-brand-hover);
	transform: none;
}

.e-64e877b > .box.link:hover > .body > .text
{
	text-decoration: underline;
	text-underline-offset: 3px;
}

.e-64e877b > .box.link:active { transform: none; }

/* ===== BACKGROUND ===== */

.e-64e877b > .box.bg-1 { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-64e877b > .box.bg-2 { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-64e877b > .box.bg-3 { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-64e877b > .box.bg-4 { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

.e-64e877b > .box.bg-1:hover { background: var(--ot-bg-1-hover); }
.e-64e877b > .box.bg-2:hover { background: var(--ot-bg-2-hover); }
.e-64e877b > .box.bg-3:hover { background: var(--ot-bg-3-hover); }
.e-64e877b > .box.bg-4:hover { background: var(--ot-bg-4-hover); }

/* Glass */

.e-64e877b > .box.glass
{
	background: var(--ot-bg-1-opacity);
	border-color: var(--ot-bg-2-border);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
}

.e-64e877b > .box.glass:hover { background: var(--ot-bg-2-opacity); }

/* ===== SIZE ===== */

.e-64e877b > .box.size-s
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-s);
	font-size: var(--ot-size-s);
	gap: var(--ot-spacing-x);
}

.e-64e877b > .box.size-s > .body { gap: var(--ot-spacing-x); }

.e-64e877b > .box.size-s > .body > i,
.e-64e877b > .box.size-s > .spin > i { font-size: 14px; }

.e-64e877b > .box.size-l
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-l);
}

.e-64e877b > .box.size-l > .body > i,
.e-64e877b > .box.size-l > .spin > i { font-size: 20px; }

/* ===== MODIFIERS ===== */

.e-64e877b > .box.full
{
	width: 100%;
}

.e-64e877b > .box.rounded
{
	border-radius: 100px;
}

.e-64e877b > .box.icon-only
{
	padding: 0;
	width: var(--ot-height-m);
	gap: 0;
}

.e-64e877b > .box.icon-only.size-s { width: var(--ot-height-s); }
.e-64e877b > .box.icon-only.size-l { width: var(--ot-height-l); }

/* Link size resets */

.e-64e877b > .box.link.size-s,
.e-64e877b > .box.link.size-l
{
	height: auto;
	padding: 0;
}
/* ===== FORM CHECKBOX ===== */

.e-f249baa
{
	display: contents;
}

/* Expression wrapper */

.e-f249baa > .expression
{
	display: block;
	width: 100%;
}

/* Variable button */

.e-f249baa > .box > .variable-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--ot-height-s);
	height: var(--ot-height-s);
	padding: 0;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-f249baa > .box > .variable-btn:hover
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-f249baa > .box > .variable-btn > i
{
	font-size: 14px;
}

/* Box */

.e-f249baa > .box
{
	position: relative;
	display: inline-flex;
	align-items: flex-start;
	gap: var(--ot-spacing-s);
	cursor: pointer;
	font-family: var(--ot-font-primary);
}

.e-f249baa > .box.reverse
{
	flex-direction: row-reverse;
}

/* Input — hidden but accessible */

.e-f249baa > .box > input
{
	position: absolute;
	opacity: 0;
	cursor: pointer;
	width: 0;
	height: 0;
	margin: 0;
}

/* Info */

.e-f249baa > .box > .info
{
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	padding-top: 1px;
}

.e-f249baa > .box > .info > .label
{
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	line-height: 1.3;
	user-select: none;
	transition: color var(--ot-transition);
}

.e-f249baa > .box > .info > .description
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.4;
	user-select: none;
	transition: color var(--ot-transition);
}

/* Mark */

.e-f249baa > .box > .mark
{
	position: relative;
	display: block;
	flex-shrink: 0;
	border-radius: var(--ot-radius-s);
	border: 1px solid transparent;
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), transform var(--ot-transition-fast), box-shadow var(--ot-transition);
}

/* Checkmark */

.e-f249baa > .box > .mark::after
{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border: solid white;
	transform: translate(-50%, -60%) rotate(45deg) scale(0);
	opacity: 0;
	transition: transform var(--ot-transition), opacity var(--ot-transition-fast);
}

.e-f249baa > .box > input:checked ~ .mark::after
{
	transform: translate(-50%, -60%) rotate(45deg) scale(1);
	opacity: 1;
}

/* Indeterminate */

.e-f249baa > .box.indeterminate > .mark::after
{
	transform: translate(-50%, -50%) rotate(0) scale(1);
	opacity: 1;
	border: none;
	background: white;
	border-radius: 1px;
}

/* Focus */

.e-f249baa > .box > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Active */

.e-f249baa > .box:active > .mark
{
	transform: scale(0.92);
}

/* Disabled */

.e-f249baa > .box.disabled
{
	cursor: not-allowed;
}

.e-f249baa > .box.disabled > .mark
{
	opacity: 0.45;
}

.e-f249baa > .box.disabled > .info > .label,
.e-f249baa > .box.disabled > .info > .description
{
	color: var(--ot-text-3);
	opacity: 0.6;
}

/* ===== SIZE ===== */

/* Small */

.e-f249baa > .box.size-s > .mark
{
	width: 16px;
	height: 16px;
}

.e-f249baa > .box.size-s > .mark::after
{
	width: 3px;
	height: 6px;
	border-width: 0 1.5px 1.5px 0;
}

.e-f249baa > .box.size-s.indeterminate > .mark::after
{
	width: 8px;
	height: 1.5px;
}

.e-f249baa > .box.size-s > .info > .label
{
	font-size: var(--ot-size-s);
}

.e-f249baa > .box.size-s > .info > .description
{
	font-size: 10.5px;
}

.e-f249baa > .box.size-s > .icon { font-size: 16px; }

/* Medium */

.e-f249baa > .box.size-m > .mark
{
	width: 20px;
	height: 20px;
}

.e-f249baa > .box.size-m > .mark::after
{
	width: 4px;
	height: 8px;
	border-width: 0 2px 2px 0;
}

.e-f249baa > .box.size-m.indeterminate > .mark::after
{
	width: 10px;
	height: 2px;
}

.e-f249baa > .box.size-m > .info > .label
{
	font-size: var(--ot-size-m);
}

/* Large */

.e-f249baa > .box.size-l > .mark
{
	width: 24px;
	height: 24px;
}

.e-f249baa > .box.size-l > .mark::after
{
	width: 5px;
	height: 10px;
	border-width: 0 2.5px 2.5px 0;
}

.e-f249baa > .box.size-l.indeterminate > .mark::after
{
	width: 12px;
	height: 2.5px;
}

.e-f249baa > .box.size-l > .info > .label
{
	font-size: var(--ot-size-m);
}

.e-f249baa > .box.size-l > .icon { font-size: 20px; }

/* ===== BACKGROUND ===== */

.e-f249baa > .box.bg-1 > .mark { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-f249baa > .box.bg-2 > .mark { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-f249baa > .box.bg-3 > .mark { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-f249baa > .box.bg-4 > .mark { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

.e-f249baa > .box.bg-1:hover:not(.disabled):not(.indeterminate) > input:not(:checked) ~ .mark { background: var(--ot-bg-1-hover); }
.e-f249baa > .box.bg-2:hover:not(.disabled):not(.indeterminate) > input:not(:checked) ~ .mark { background: var(--ot-bg-2-hover); }
.e-f249baa > .box.bg-3:hover:not(.disabled):not(.indeterminate) > input:not(:checked) ~ .mark { background: var(--ot-bg-3-hover); }
.e-f249baa > .box.bg-4:hover:not(.disabled):not(.indeterminate) > input:not(:checked) ~ .mark { background: var(--ot-bg-4-hover); }

/* Transparent */

.e-f249baa > .box.transparent > .mark
{
	background: transparent;
	border-color: transparent;
}

/* Border */

.e-f249baa > .box.border > .mark
{
	border-color: var(--ot-bg-2-border);
}

.e-f249baa > .box.border:hover:not(.disabled) > .mark
{
	border-color: var(--ot-text-3);
}

/* ===== COLOR (checked state) ===== */

.e-f249baa > .box > input:checked ~ .mark,
.e-f249baa > .box.indeterminate > .mark
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
}

.e-f249baa > .box.color-blue > input:checked ~ .mark,
.e-f249baa > .box.color-blue.indeterminate > .mark
{
	background: var(--ot-blue);
	border-color: var(--ot-blue);
}

.e-f249baa > .box.color-red > input:checked ~ .mark,
.e-f249baa > .box.color-red.indeterminate > .mark
{
	background: var(--ot-red);
	border-color: var(--ot-red);
}

.e-f249baa > .box.color-orange > input:checked ~ .mark,
.e-f249baa > .box.color-orange.indeterminate > .mark
{
	background: var(--ot-orange);
	border-color: var(--ot-orange);
}

.e-f249baa > .box.color-green > input:checked ~ .mark,
.e-f249baa > .box.color-green.indeterminate > .mark
{
	background: var(--ot-green);
	border-color: var(--ot-green);
}

/* Focus per color */

.e-f249baa > .box.color-blue > input:focus-visible ~ .mark { box-shadow: 0 0 0 1px var(--ot-blue-opacity); }
.e-f249baa > .box.color-red > input:focus-visible ~ .mark { box-shadow: 0 0 0 1px var(--ot-red-opacity); }
.e-f249baa > .box.color-orange > input:focus-visible ~ .mark { box-shadow: 0 0 0 1px var(--ot-orange-opacity); }
.e-f249baa > .box.color-green > input:focus-visible ~ .mark { box-shadow: 0 0 0 1px var(--ot-green-opacity); }

/* Icon */

.e-f249baa > .box > .icon
{
	font-size: 18px;
	color: var(--ot-text-2);
	flex-shrink: 0;
	align-self: center;
}

/* Count */

.e-f249baa > .box > .count
{
	margin-left: auto;
	padding-left: var(--ot-spacing-s);
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	font-variant-numeric: tabular-nums;
	align-self: center;
}
/* ===== FORM COLOR ===== */

.e-21311850
{
	display: contents;
}

/* Box */

.e-21311850 > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	width: 100%;
}

/* Field */

.e-21311850 > .box > .field
{
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: 0 var(--ot-spacing-s);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-21311850 > .box > .field:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Swatch */

.e-21311850 > .box > .field > .swatch
{
	position: relative;
	flex-shrink: 0;
	border-radius: var(--ot-radius-s);
	border: 1px solid var(--ot-bg-2-border);
	cursor: pointer;
	overflow: hidden;
	padding: 0;
	outline: none;
	background-color: transparent;
	background-image: linear-gradient(45deg, var(--ot-bg-3) 25%, transparent 25%), linear-gradient(-45deg, var(--ot-bg-3) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--ot-bg-3) 75%), linear-gradient(-45deg, transparent 75%, var(--ot-bg-3) 75%);
	background-size: 8px 8px;
	background-position: 0 0, 0 4px, 4px -4px, -4px 0;
	transition: border-color var(--ot-transition), transform var(--ot-transition);
}

.e-21311850 > .box > .field > .swatch:hover
{
	transform: scale(1.08);
}

/* Native color input */

.e-21311850 > .box > .field > .swatch > .native
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
	border: none;
	padding: 0;
}

/* Hex input */

.e-21311850 > .box > .field > .input
{
	flex: 1;
	min-width: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
	font-size: var(--ot-size-m);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 0;
}

.e-21311850 > .box > .field > .input::placeholder
{
	color: var(--ot-text-3);
	text-transform: none;
}

/* Action */

.e-21311850 > .box > .field > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	border: none;
	background: transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-21311850 > .box > .field > .action:hover
{
	background: var(--ot-bg-2-hover);
	color: var(--ot-text-1);
}

.e-21311850 > .box > .field > .action > i
{
	font-size: 14px;
}

.e-21311850 > .box > .field > .action.copied
{
	color: var(--ot-green);
	background: var(--ot-green-opacity);
}

/* Presets */

.e-21311850 > .box > .presets
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-x);
}

.e-21311850 > .box > .presets > .preset
{
	width: 22px;
	height: 22px;
	padding: 0;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	cursor: pointer;
	outline: none;
	transition: border-color var(--ot-transition), transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-21311850 > .box > .presets > .preset:hover
{
	transform: scale(1.1);
}

.e-21311850 > .box > .presets > .preset.active
{
	box-shadow: 0 0 0 2px var(--ot-bg-1), 0 0 0 4px var(--ot-brand);
}

/* Disabled */

.e-21311850 > .box.disabled > .field
{
	cursor: not-allowed;
	opacity: 0.55;
}

.e-21311850 > .box.disabled > .field > .swatch
{
	cursor: not-allowed;
	transform: none;
}

.e-21311850 > .box.disabled > .field > .input
{
	cursor: not-allowed;
}

/* ===== BACKGROUND ===== */

.e-21311850 > .box.bg-1 > .field { background: var(--ot-bg-1); }
.e-21311850 > .box.bg-2 > .field { background: var(--ot-bg-2); }
.e-21311850 > .box.bg-3 > .field { background: var(--ot-bg-3); }
.e-21311850 > .box.bg-4 > .field { background: var(--ot-bg-4); }

.e-21311850 > .box.bg-1 > .field:hover:not(:focus-within) { background: var(--ot-bg-1-hover); }
.e-21311850 > .box.bg-2 > .field:hover:not(:focus-within) { background: var(--ot-bg-2-hover); }
.e-21311850 > .box.bg-3 > .field:hover:not(:focus-within) { background: var(--ot-bg-3-hover); }
.e-21311850 > .box.bg-4 > .field:hover:not(:focus-within) { background: var(--ot-bg-4-hover); }

.e-21311850 > .box.bg-1 > .field > .swatch { border-color: var(--ot-bg-1-border); }
.e-21311850 > .box.bg-2 > .field > .swatch { border-color: var(--ot-bg-2-border); }
.e-21311850 > .box.bg-3 > .field > .swatch { border-color: var(--ot-bg-3-border); }
.e-21311850 > .box.bg-4 > .field > .swatch { border-color: var(--ot-bg-4-border); }

.e-21311850 > .box.bg-1 > .field > .action:hover { background: var(--ot-bg-1-hover); }
.e-21311850 > .box.bg-2 > .field > .action:hover { background: var(--ot-bg-2-hover); }
.e-21311850 > .box.bg-3 > .field > .action:hover { background: var(--ot-bg-3-hover); }
.e-21311850 > .box.bg-4 > .field > .action:hover { background: var(--ot-bg-4-hover); }

/* Transparent */

.e-21311850 > .box.transparent > .field
{
	background: transparent;
	padding: 0;
}

/* Border */

.e-21311850 > .box.border > .field { border-color: var(--ot-bg-2-border); }
.e-21311850 > .box.bg-1.border > .field { border-color: var(--ot-bg-1-border); }
.e-21311850 > .box.bg-2.border > .field { border-color: var(--ot-bg-2-border); }
.e-21311850 > .box.bg-3.border > .field { border-color: var(--ot-bg-3-border); }
.e-21311850 > .box.bg-4.border > .field { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-21311850 > .box.size-s > .field
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-x);
}

.e-21311850 > .box.size-s > .field > .swatch { width: 18px; height: 18px; }
.e-21311850 > .box.size-s > .field > .input { font-size: var(--ot-size-s); }
.e-21311850 > .box.size-s > .field > .action { width: 18px; height: 18px; }
.e-21311850 > .box.size-s > .field > .action > i { font-size: 13px; }
.e-21311850 > .box.size-s > .presets > .preset { width: 18px; height: 18px; }

.e-21311850 > .box.size-m > .field
{
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-s);
}

.e-21311850 > .box.size-m > .field > .swatch { width: 22px; height: 22px; }
.e-21311850 > .box.size-m > .field > .input { font-size: var(--ot-size-m); }

.e-21311850 > .box.size-l > .field
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-m);
}

.e-21311850 > .box.size-l > .field > .swatch { width: 28px; height: 28px; }
.e-21311850 > .box.size-l > .field > .input { font-size: var(--ot-size-m); }
.e-21311850 > .box.size-l > .field > .action { width: 26px; height: 26px; }
.e-21311850 > .box.size-l > .field > .action > i { font-size: 16px; }
.e-21311850 > .box.size-l > .presets > .preset { width: 28px; height: 28px; }
/* ===== FORM DATE ===== */

.e-283879c1
{
	display: contents;
}

/* Box */

.e-283879c1 > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	width: 100%;
}

/* Field */

.e-283879c1 > .box > .field
{
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: 0 var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	cursor: pointer;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-283879c1 > .box > .field:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Icon */

.e-283879c1 > .box > .field > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition);
}

.e-283879c1 > .box.today > .field > .icon
{
	color: var(--ot-brand);
}

/* Input */

.e-283879c1 > .box > .field > .input
{
	flex: 1;
	min-width: 0;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	cursor: pointer;
}

.e-283879c1 > .box > .field > .input::placeholder
{
	color: var(--ot-text-3);
	font-weight: 400;
}

/* Hide native indicator — the whole field opens the picker now. */
.e-283879c1 > .box > .field > .input::-webkit-calendar-picker-indicator
{
	display: none;
}

.e-283879c1 > .box > .field > .input:disabled
{
	cursor: not-allowed;
}

/* Action */

.e-283879c1 > .box > .field > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	border: none;
	background: transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-283879c1 > .box > .field > .action:hover
{
	background: var(--ot-bg-2-hover);
	color: var(--ot-text-1);
}

.e-283879c1 > .box > .field > .action > i
{
	font-size: 14px;
}

/* Presets */

.e-283879c1 > .box > .presets
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-x);
}

.e-283879c1 > .box > .presets > .preset
{
	display: inline-flex;
	align-items: center;
	padding: var(--ot-spacing-x) 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-2);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-283879c1 > .box > .presets > .preset:hover:not(.disabled):not(.active)
{
	background: var(--ot-bg-2-hover);
	color: var(--ot-text-1);
	transform: translateY(-1px);
}

.e-283879c1 > .box > .presets > .preset.active
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand);
	color: var(--ot-brand);
}

.e-283879c1 > .box > .presets > .preset.disabled
{
	opacity: 0.4;
	cursor: not-allowed;
}

/* Disabled */

.e-283879c1 > .box.disabled > .field
{
	cursor: not-allowed;
	opacity: 0.55;
}

/* ===== BACKGROUND ===== */

.e-283879c1 > .box.bg-1 > .field { background: var(--ot-bg-1); }
.e-283879c1 > .box.bg-2 > .field { background: var(--ot-bg-2); }
.e-283879c1 > .box.bg-3 > .field { background: var(--ot-bg-3); }
.e-283879c1 > .box.bg-4 > .field { background: var(--ot-bg-4); }

.e-283879c1 > .box.bg-1 > .field:hover:not(:focus-within) { background: var(--ot-bg-1-hover); }
.e-283879c1 > .box.bg-2 > .field:hover:not(:focus-within) { background: var(--ot-bg-2-hover); }
.e-283879c1 > .box.bg-3 > .field:hover:not(:focus-within) { background: var(--ot-bg-3-hover); }
.e-283879c1 > .box.bg-4 > .field:hover:not(:focus-within) { background: var(--ot-bg-4-hover); }

.e-283879c1 > .box.bg-1 > .field > .action:hover { background: var(--ot-bg-1-hover); }
.e-283879c1 > .box.bg-2 > .field > .action:hover { background: var(--ot-bg-2-hover); }
.e-283879c1 > .box.bg-3 > .field > .action:hover { background: var(--ot-bg-3-hover); }
.e-283879c1 > .box.bg-4 > .field > .action:hover { background: var(--ot-bg-4-hover); }

/* Transparent */

.e-283879c1 > .box.transparent > .field
{
	background: transparent;
	padding: 0;
}

/* Border */

.e-283879c1 > .box.border > .field { border-color: var(--ot-bg-2-border); }
.e-283879c1 > .box.bg-1.border > .field { border-color: var(--ot-bg-1-border); }
.e-283879c1 > .box.bg-2.border > .field { border-color: var(--ot-bg-2-border); }
.e-283879c1 > .box.bg-3.border > .field { border-color: var(--ot-bg-3-border); }
.e-283879c1 > .box.bg-4.border > .field { border-color: var(--ot-bg-4-border); }

/* Today */

.e-283879c1 > .box.today > .field,
.e-283879c1 > .box.today.border > .field
{
	border-color: var(--ot-brand);
}

/* ===== SIZE ===== */

.e-283879c1 > .box.size-s > .field
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-s);
}

.e-283879c1 > .box.size-s > .field > .icon { font-size: 15px; }
.e-283879c1 > .box.size-s > .field > .input { font-size: var(--ot-size-s); }
.e-283879c1 > .box.size-s > .field > .action { width: 18px; height: 18px; }
.e-283879c1 > .box.size-s > .field > .action > i { font-size: 13px; }
.e-283879c1 > .box.size-s > .presets > .preset { font-size: 10.5px; padding: 3px 8px; }

.e-283879c1 > .box.size-m > .field
{
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
}

.e-283879c1 > .box.size-l > .field
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-l);
}

.e-283879c1 > .box.size-l > .field > .icon { font-size: 20px; }
.e-283879c1 > .box.size-l > .field > .action { width: 26px; height: 26px; }
.e-283879c1 > .box.size-l > .field > .action > i { font-size: 16px; }
.e-283879c1 > .box.size-l > .presets > .preset { font-size: 12.5px; padding: 5px 12px; }
/* ===== FORM EDITOR ===== */

.e-2248d40
{
	display: contents;
}

/* Box */

.e-2248d40 > .box
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	border-radius: var(--ot-radius-m);
	overflow: visible;
	transition: border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-2248d40 > .box:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Toolbar */

.e-2248d40 > .box > .bar
{
	display: flex;
	align-items: center;
	gap: 2px;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
	flex-wrap: wrap;
	border-radius: var(--ot-radius-m) var(--ot-radius-m) 0 0;
}

.e-2248d40 > .box > .bar > div
{
	display: inline-flex;
	align-items: center;
}

.e-2248d40 > .box > .bar .btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-2248d40 > .box > .bar .btn:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-2248d40 > .box > .bar .btn.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-2248d40 > .box > .bar .btn > i
{
	font-size: 18px;
}

.e-2248d40 > .box > .bar .sep
{
	width: 1px;
	height: 20px;
	background: var(--ot-bg-2-border);
	margin: 0 6px;
}

/* Area */

.e-2248d40 > .box > .area
{
	position: relative;
	padding: var(--ot-spacing-l);
	width: 100%;
	border-radius: 0 0 var(--ot-radius-m) var(--ot-radius-m);
}

/* Body (contenteditable) */

.e-2248d40 > .box > .area > .body
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	line-height: 1.75;
	color: var(--ot-text-1);
	outline: none;
	min-height: 200px;
	word-break: break-word;
	overflow-wrap: break-word;
}

/* Placeholder */

.e-2248d40 > .box > .area > .body:empty::before,
.e-2248d40 > .box > .area > .body > p:only-child:empty::before
{
	content: attr(data-placeholder);
	color: var(--ot-text-3);
	pointer-events: none;
}

.e-2248d40 > .box > .area > .body > *:first-child { margin-top: 0; }
.e-2248d40 > .box > .area > .body > *:last-child { margin-bottom: 0; }

/* Headings */

.e-2248d40 > .box > .area > .body :is(h2, h3, h4)
{
	font-family: var(--ot-font-secondary);
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	line-height: 1.2;
}

.e-2248d40 > .box > .area > .body h2 { font-size: 26px; margin: 1.2em 0 0.5em; }
.e-2248d40 > .box > .area > .body h3 { font-size: 21px; margin: 1.1em 0 0.45em; }
.e-2248d40 > .box > .area > .body h4 { font-size: 17px; margin: 1em 0 0.4em; }

.e-2248d40 > .box > .area > .body :is(h2, h3, h4) + :is(h2, h3, h4)
{
	margin-top: 0;
}

/* Paragraphs */

.e-2248d40 > .box > .area > .body p
{
	margin: 0 0 1em;
	color: var(--ot-text-2);
}

/* Inline formatting */

.e-2248d40 > .box > .area > .body strong { font-weight: 700; color: var(--ot-text-1); }
.e-2248d40 > .box > .area > .body em { font-style: italic; }
.e-2248d40 > .box > .area > .body s { text-decoration: line-through; color: var(--ot-text-3); }
.e-2248d40 > .box > .area > .body u { text-decoration: underline; }

/* Links */

.e-2248d40 > .box > .area > .body a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-decoration-color: var(--ot-brand-opacity);
	text-underline-offset: 3px;
	transition: text-decoration-color var(--ot-transition-fast);
}

.e-2248d40 > .box > .area > .body a:hover
{
	text-decoration-color: var(--ot-brand);
}

/* Lists */

.e-2248d40 > .box > .area > .body :is(ul, ol)
{
	margin: 0 0 1em;
	padding-left: 1.6em;
}

.e-2248d40 > .box > .area > .body ul { list-style: disc; }
.e-2248d40 > .box > .area > .body ol { list-style: decimal; }

.e-2248d40 > .box > .area > .body li
{
	margin: 0 0 0.3em;
	color: var(--ot-text-2);
}

.e-2248d40 > .box > .area > .body li:last-child
{
	margin-bottom: 0;
}

/* Blockquote */

.e-2248d40 > .box > .area > .body blockquote
{
	margin: 1.3em 0;
	padding: 0.2em 0 0.2em 1em;
	border-left: 3px solid var(--ot-brand);
	font-family: var(--ot-font-secondary);
	font-size: 1.15em;
	font-style: italic;
	line-height: 1.5;
	color: var(--ot-text-1);
}

.e-2248d40 > .box > .area > .body blockquote p
{
	margin: 0;
	color: inherit;
}

/* Inline code */

.e-2248d40 > .box > .area > .body code
{
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 0.9em;
	padding: 0.1em 0.35em;
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
}

/* Pre / code block */

.e-2248d40 > .box > .area > .body pre
{
	margin: 1.3em 0;
	padding: 1em 1.2em;
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	overflow-x: auto;
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 0.9em;
	line-height: 1.6;
}

.e-2248d40 > .box > .area > .body pre > code
{
	background: transparent;
	border: none;
	padding: 0;
}

/* Images */

.e-2248d40 > .box > .area > .body img
{
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: var(--ot-radius-m);
	margin: 1.5em 0;
}

/* HR */

.e-2248d40 > .box > .area > .body hr
{
	border: none;
	height: 1px;
	background: var(--ot-bg-2-border);
	margin: 2em 0;
}

/* Tables */

.e-2248d40 > .box > .area > .body table
{
	width: 100%;
	border-collapse: collapse;
	margin: 1.5em 0;
	font-size: var(--ot-size-s);
}

.e-2248d40 > .box > .area > .body th,
.e-2248d40 > .box > .area > .body td
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border: 1px solid var(--ot-bg-2-border);
	text-align: left;
	vertical-align: top;
}

.e-2248d40 > .box > .area > .body thead td,
.e-2248d40 > .box > .area > .body th
{
	font-weight: 600;
	color: var(--ot-text-1);
	background: var(--ot-bg-2);
}

.e-2248d40 > .box > .area > .body td
{
	color: var(--ot-text-2);
}

/* ===== BACKGROUND ===== */

.e-2248d40 > .box.bg-1 { background: var(--ot-bg-1); }
.e-2248d40 > .box.bg-1 > .bar { background: var(--ot-bg-1); }

.e-2248d40 > .box.bg-2 { background: var(--ot-bg-2); }
.e-2248d40 > .box.bg-2 > .bar { background: var(--ot-bg-2); border-bottom-color: var(--ot-bg-2-border); }
.e-2248d40 > .box.bg-2 > .bar .btn:hover { background: var(--ot-bg-3); }
.e-2248d40 > .box.bg-2 > .bar .sep { background: var(--ot-bg-2-border); }

.e-2248d40 > .box.bg-3 { background: var(--ot-bg-3); }
.e-2248d40 > .box.bg-3 > .bar { background: var(--ot-bg-3); border-bottom-color: var(--ot-bg-3-border); }
.e-2248d40 > .box.bg-3 > .bar .btn:hover { background: var(--ot-bg-4); }
.e-2248d40 > .box.bg-3 > .bar .sep { background: var(--ot-bg-3-border); }

.e-2248d40 > .box.bg-4 { background: var(--ot-bg-4); }
.e-2248d40 > .box.bg-4 > .bar { background: var(--ot-bg-4); border-bottom-color: var(--ot-bg-4-border); }
.e-2248d40 > .box.bg-4 > .bar .btn:hover { background: var(--ot-bg-3); }
.e-2248d40 > .box.bg-4 > .bar .sep { background: var(--ot-bg-4-border); }

/* ===== BORDER ===== */

.e-2248d40 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-2248d40 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-2248d40 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-2248d40 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-2248d40 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-2248d40 > .box.size-s > .bar { padding: var(--ot-spacing-x) var(--ot-spacing-s); }
.e-2248d40 > .box.size-s > .bar .btn { width: 26px; height: 26px; }
.e-2248d40 > .box.size-s > .bar .btn > i { font-size: 16px; }
.e-2248d40 > .box.size-s > .area { padding: var(--ot-spacing-m); }
.e-2248d40 > .box.size-s > .area > .body { font-size: var(--ot-size-s); min-height: 140px; }

.e-2248d40 > .box.size-m > .bar { padding: var(--ot-spacing-s) var(--ot-spacing-m); }
.e-2248d40 > .box.size-m > .area { padding: var(--ot-spacing-l); }

.e-2248d40 > .box.size-l > .bar { padding: var(--ot-spacing-m) var(--ot-spacing-l); }
.e-2248d40 > .box.size-l > .bar .btn { width: 34px; height: 34px; }
.e-2248d40 > .box.size-l > .bar .btn > i { font-size: 20px; }
.e-2248d40 > .box.size-l > .area { padding: var(--ot-spacing-l); }
.e-2248d40 > .box.size-l > .area > .body { min-height: 280px; }

/* ===== COMPACT ===== */

.e-2248d40 > .box.compact > .area { padding: var(--ot-spacing-m); }
.e-2248d40 > .box.compact > .area > .body { min-height: 120px; }
/* ===== FORM FIELD ===== */

.e-2109a6b9
{
	display: contents;
}

/* Box */

.e-2109a6b9 > .box
{
	display: flex;
	width: 100%;
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-l);
}

.e-2109a6b9 > .box.horizontal
{
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
}

.e-2109a6b9 > .box.vertical
{
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

/* Info */

.e-2109a6b9 > .box > .info
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	min-width: 0;
	flex: 1;
}

.e-2109a6b9 > .box.horizontal > .info
{
	padding-top: 6px;
	max-width: 240px;
}

/* Label */

.e-2109a6b9 > .box > .info > .label
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	line-height: 1.3;
	cursor: default;
}

.e-2109a6b9 > .box > .info > .label > .required
{
	color: var(--ot-red);
	font-weight: 600;
}

.e-2109a6b9 > .box > .info > .label > .hint
{
	font-size: 16px;
	color: var(--ot-text-3);
	cursor: help;
	transition: color var(--ot-transition);
}

.e-2109a6b9 > .box > .info > .label > .hint:hover
{
	color: var(--ot-text-1);
}

/* Description */

.e-2109a6b9 > .box > .info > .description
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.5;
}

/* Control */

.e-2109a6b9 > .box > .control
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	flex: 1;
	min-width: 0;
}

.e-2109a6b9 > .box.horizontal > .control
{
	flex: 1.5;
}

.e-2109a6b9 > .box.vertical > .control
{
	width: 100%;
}

/* Input slot */

.e-2109a6b9 > .box > .control > .input
{
	display: flex;
	width: 100%;
}

.e-2109a6b9 > .box > .control > .input > *
{
	width: 100%;
}

/* Error message */

.e-2109a6b9 > .box > .control > .message
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-red);
	animation: e-2109a6b9-shake 0.3s cubic-bezier(0.36, 0.07, 0.19, 0.97);
}

.e-2109a6b9 > .box > .control > .message > i
{
	font-size: 14px;
	font-variation-settings: 'FILL' 1;
}

@keyframes e-2109a6b9-shake
{
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-3px); }
	75% { transform: translateX(3px); }
}

/* Error state */

.e-2109a6b9 > .box.error > .control > .input > *
{
	--ot-brand: var(--ot-red);
	--ot-brand-opacity: var(--ot-red-opacity);
}

/* ===== VARIANT ===== */

.e-2109a6b9 > .box.clean
{
	padding: 0;
}

.e-2109a6b9 > .box.border
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* ===== SIZE ===== */

/* Small */

.e-2109a6b9 > .box.size-s
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	gap: var(--ot-spacing-m);
}

.e-2109a6b9 > .box.size-s.vertical
{
	gap: var(--ot-spacing-x);
}

.e-2109a6b9 > .box.size-s > .info > .label
{
	font-size: var(--ot-size-s);
}

.e-2109a6b9 > .box.size-s > .info > .description
{
	font-size: var(--ot-size-s);
}

/* Medium */

.e-2109a6b9 > .box.size-m
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-m);
}

/* Large */

.e-2109a6b9 > .box.size-l
{
	padding: var(--ot-spacing-l) var(--ot-spacing-m);
	gap: var(--ot-spacing-l);
}

.e-2109a6b9 > .box.size-l.vertical
{
	gap: var(--ot-spacing-s);
}

.e-2109a6b9 > .box.size-l > .info > .label
{
	font-size: 15px;
}

.e-2109a6b9 > .box.size-l > .info > .description
{
	font-size: var(--ot-size-m);
}

/* Clean overrides */

.e-2109a6b9 > .box.clean.size-s,
.e-2109a6b9 > .box.clean.size-m,
.e-2109a6b9 > .box.clean.size-l
{
	padding: 0;
}
/* ===== FORM INPUT ===== */

.e-20dcefe9
{
	display: contents;
}

/* Box */

.e-20dcefe9 > .box
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-20dcefe9 > .box:focus-within
{
	border-color: var(--ot-brand);
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Field */

.e-20dcefe9 > .box > .field
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
}

/* Icon */

.e-20dcefe9 > .box > .field > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition);
}

.e-20dcefe9 > .box:focus-within > .field > .icon
{
	color: var(--ot-text-1);
}

/* Affix */

.e-20dcefe9 > .box > .field > .affix
{
	flex-shrink: 0;
	color: var(--ot-text-3);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	user-select: none;
}

/* Input */

.e-20dcefe9 > .box > .field > .input
{
	flex: 1;
	min-width: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
}

.e-20dcefe9 > .box > .field > .input::placeholder
{
	color: var(--ot-text-3);
	font-weight: 400;
}

.e-20dcefe9 > .box > .field > .input:disabled
{
	cursor: not-allowed;
}

/* Action */

.e-20dcefe9 > .box > .field > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	border: none;
	background: transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-20dcefe9 > .box > .field > .action:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-20dcefe9 > .box > .field > .action > i
{
	font-size: 14px;
}

/* Dropdown */

.e-20dcefe9 > .box > .dropdown
{
	position: absolute;
	top: calc(100% + var(--ot-spacing-x));
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	padding: var(--ot-spacing-x);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--ot-shadow-m);
	z-index: 10;
	max-height: 240px;
	overflow-y: auto;
	animation: e-20dcefe9-drop var(--ot-transition);
}

@keyframes e-20dcefe9-drop
{
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

.e-20dcefe9 > .box > .dropdown > .option
{
	display: flex;
	align-items: center;
	width: 100%;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-20dcefe9 > .box > .dropdown > .option:hover,
.e-20dcefe9 > .box > .dropdown > .option.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

/* Disabled */

.e-20dcefe9 > .box.disabled
{
	cursor: not-allowed;
	opacity: 0.5;
}

/* ===== BACKGROUND ===== */

.e-20dcefe9 > .box.bg-1 { background: var(--ot-bg-1); }
.e-20dcefe9 > .box.bg-2 { background: var(--ot-bg-2); }
.e-20dcefe9 > .box.bg-3 { background: var(--ot-bg-3); }
.e-20dcefe9 > .box.bg-4 { background: var(--ot-bg-4); }
.e-20dcefe9 > .box.transparent { background: transparent; }

.e-20dcefe9 > .box.bg-1:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-1-hover); }
.e-20dcefe9 > .box.bg-2:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-2-hover); }
.e-20dcefe9 > .box.bg-3:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-3-hover); }
.e-20dcefe9 > .box.bg-4:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-4-hover); }

/* ===== BORDER ===== */

.e-20dcefe9 > .box.border { border-color: var(--ot-bg-2-border); }
.e-20dcefe9 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-20dcefe9 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-20dcefe9 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-20dcefe9 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-20dcefe9 > .box.size-s > .field
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-s);
}

.e-20dcefe9 > .box.size-s > .field > .icon
{
	font-size: 15px;
}

.e-20dcefe9 > .box.size-s > .field > .affix,
.e-20dcefe9 > .box.size-s > .field > .input
{
	font-size: var(--ot-size-s);
}

.e-20dcefe9 > .box.size-s > .field > .action
{
	width: 18px;
	height: 18px;
}

.e-20dcefe9 > .box.size-s > .field > .action > i
{
	font-size: 13px;
}

.e-20dcefe9 > .box.size-m > .field
{
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
}

.e-20dcefe9 > .box.size-l > .field
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-l);
}

.e-20dcefe9 > .box.size-l > .field > .icon
{
	font-size: 20px;
}

.e-20dcefe9 > .box.size-l > .field > .action
{
	width: 26px;
	height: 26px;
}

.e-20dcefe9 > .box.size-l > .field > .action > i
{
	font-size: 16px;
}
/* ===== FORM RADIO ===== */

.e-206433b8
{
	display: contents;
}

/* Box */

.e-206433b8 > .box
{
	position: relative;
	display: inline-flex;
	align-items: flex-start;
	gap: var(--ot-spacing-s);
	cursor: pointer;
	font-family: var(--ot-font-primary);
}

.e-206433b8 > .box.reverse
{
	flex-direction: row-reverse;
}

/* Input */

.e-206433b8 > .box > input
{
	position: absolute;
	opacity: 0;
	cursor: pointer;
	width: 0;
	height: 0;
	margin: 0;
}

/* Info */

.e-206433b8 > .box > .info
{
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	padding-top: 1px;
}

.e-206433b8 > .box > .info > .label
{
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	line-height: 1.3;
	user-select: none;
	transition: color var(--ot-transition);
}

.e-206433b8 > .box > .info > .description
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.4;
	user-select: none;
	transition: color var(--ot-transition);
}

/* Mark */

.e-206433b8 > .box > .mark
{
	position: relative;
	display: block;
	flex-shrink: 0;
	border-radius: 50%;
	border: 1px solid transparent;
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), transform var(--ot-transition-fast), box-shadow var(--ot-transition);
}

/* Dot */

.e-206433b8 > .box > .mark::after
{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	background: white;
	transform: translate(-50%, -50%) scale(0);
	opacity: 0;
	transition: transform var(--ot-transition), opacity var(--ot-transition-fast);
}

.e-206433b8 > .box > input:checked ~ .mark::after
{
	transform: translate(-50%, -50%) scale(1);
	opacity: 1;
}

/* Focus */

.e-206433b8 > .box > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Active */

.e-206433b8 > .box:active > .mark
{
	transform: scale(0.92);
}

/* Disabled */

.e-206433b8 > .box.disabled
{
	cursor: not-allowed;
}

.e-206433b8 > .box.disabled > .mark
{
	opacity: 0.45;
}

.e-206433b8 > .box.disabled > .info > .label,
.e-206433b8 > .box.disabled > .info > .description
{
	color: var(--ot-text-3);
	opacity: 0.6;
}

/* ===== SIZE ===== */

.e-206433b8 > .box.size-s > .mark
{
	width: 16px;
	height: 16px;
}

.e-206433b8 > .box.size-s > .mark::after
{
	width: 6px;
	height: 6px;
}

.e-206433b8 > .box.size-s > .info > .label
{
	font-size: var(--ot-size-s);
}

.e-206433b8 > .box.size-s > .info > .description
{
	font-size: 10.5px;
}

.e-206433b8 > .box.size-m > .mark
{
	width: 20px;
	height: 20px;
}

.e-206433b8 > .box.size-m > .mark::after
{
	width: 8px;
	height: 8px;
}

.e-206433b8 > .box.size-m > .info > .label
{
	font-size: var(--ot-size-m);
}

.e-206433b8 > .box.size-l > .mark
{
	width: 24px;
	height: 24px;
}

.e-206433b8 > .box.size-l > .mark::after
{
	width: 10px;
	height: 10px;
}

.e-206433b8 > .box.size-l > .info > .label
{
	font-size: var(--ot-size-m);
}

/* ===== BACKGROUND ===== */

.e-206433b8 > .box.bg-1 > .mark
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-1-border);
}

.e-206433b8 > .box.bg-1:hover:not(.disabled) > input:not(:checked) ~ .mark
{
	background: var(--ot-bg-1-hover);
}

.e-206433b8 > .box.bg-2 > .mark
{
	background: var(--ot-bg-2);
	border-color: var(--ot-bg-2-border);
}

.e-206433b8 > .box.bg-2:hover:not(.disabled) > input:not(:checked) ~ .mark
{
	background: var(--ot-bg-2-hover);
}

.e-206433b8 > .box.bg-3 > .mark
{
	background: var(--ot-bg-3);
	border-color: var(--ot-bg-3-border);
}

.e-206433b8 > .box.bg-3:hover:not(.disabled) > input:not(:checked) ~ .mark
{
	background: var(--ot-bg-3-hover);
}

.e-206433b8 > .box.bg-4 > .mark
{
	background: var(--ot-bg-4);
	border-color: var(--ot-bg-4-border);
}

.e-206433b8 > .box.bg-4:hover:not(.disabled) > input:not(:checked) ~ .mark
{
	background: var(--ot-bg-4-hover);
}

/* Transparent */

.e-206433b8 > .box.transparent > .mark
{
	background: transparent;
	border-color: transparent;
}

.e-206433b8 > .box.transparent > input:not(:checked) ~ .mark::after
{
	background: var(--ot-text-1);
}

/* Border */

.e-206433b8 > .box.border > .mark
{
	background: transparent;
	border-color: var(--ot-bg-2-border);
}

.e-206433b8 > .box.border:hover:not(.disabled) > input:not(:checked) ~ .mark
{
	border-color: var(--ot-text-3);
}

/* ===== CHECKED ===== */

.e-206433b8 > .box.bg-1 > input:checked ~ .mark,
.e-206433b8 > .box.bg-2 > input:checked ~ .mark,
.e-206433b8 > .box.bg-3 > input:checked ~ .mark,
.e-206433b8 > .box.bg-4 > input:checked ~ .mark,
.e-206433b8 > .box.transparent > input:checked ~ .mark,
.e-206433b8 > .box.border > input:checked ~ .mark
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
}

/* ===== COLOR ===== */

.e-206433b8 > .box.color-brand > input:checked ~ .mark
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
}

.e-206433b8 > .box.color-blue > input:checked ~ .mark
{
	background: var(--ot-blue);
	border-color: var(--ot-blue);
}

.e-206433b8 > .box.color-red > input:checked ~ .mark
{
	background: var(--ot-red);
	border-color: var(--ot-red);
}

.e-206433b8 > .box.color-orange > input:checked ~ .mark
{
	background: var(--ot-orange);
	border-color: var(--ot-orange);
}

.e-206433b8 > .box.color-green > input:checked ~ .mark
{
	background: var(--ot-green);
	border-color: var(--ot-green);
}

/* Color focus rings */

.e-206433b8 > .box.color-blue > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-blue-opacity);
}

.e-206433b8 > .box.color-red > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-red-opacity);
}

.e-206433b8 > .box.color-orange > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-orange-opacity);
}

.e-206433b8 > .box.color-green > input:focus-visible ~ .mark
{
	box-shadow: 0 0 0 1px var(--ot-green-opacity);
}

/* ===== ICON ===== */

.e-206433b8 > .box > .icon
{
	font-size: 18px;
	color: var(--ot-text-2);
	flex-shrink: 0;
	align-self: center;
}

.e-206433b8 > .box.size-s > .icon { font-size: 16px; }
.e-206433b8 > .box.size-l > .icon { font-size: 20px; }

/* ===== COUNT ===== */

.e-206433b8 > .box > .count
{
	margin-left: auto;
	padding-left: var(--ot-spacing-s);
	font-size: var(--ot-size-s);
	font-weight: 700;
	color: var(--ot-text-3);
	font-variant-numeric: tabular-nums;
	align-self: center;
}
/* ===== FORM SECTION ===== */

.e-5c75a80e
{
	display: contents;
}

/* Box */

.e-5c75a80e > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-l);
	transition: border-color var(--ot-transition);
}

/* ===== HEADER ===== */

.e-5c75a80e > .box > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	border-bottom: 1px solid transparent;
	transition: border-color var(--ot-transition);
}

.e-5c75a80e > .box:not(.collapsed) > .head
{
	border-bottom-color: var(--ot-bg-2-border);
}

/* Head main */

.e-5c75a80e > .box > .head > .head-main
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	flex: 1;
	min-width: 0;
}

.e-5c75a80e > .box.collapsible > .head > .head-main
{
	cursor: pointer;
}

/* Icon */

.e-5c75a80e > .box > .head > .head-main > .icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-5c75a80e > .box > .head > .head-main > .icon > i
{
	font-size: 22px;
}

/* Text */

.e-5c75a80e > .box > .head > .head-main > .text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.e-5c75a80e > .box > .head > .head-main > .text > .eyebrow
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ot-brand);
}

.e-5c75a80e > .box > .head > .head-main > .text > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	line-height: 1.25;
	font-variation-settings: 'opsz' 144;
}

.e-5c75a80e > .box > .head > .head-main > .text > .description
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	color: var(--ot-text-2);
	line-height: 1.5;
}

/* Chevron */

.e-5c75a80e > .box > .head > .head-main > .chevron
{
	flex-shrink: 0;
	font-size: 22px;
	color: var(--ot-text-3);
	transition: transform var(--ot-transition-slow), color var(--ot-transition);
}

.e-5c75a80e > .box.collapsible > .head > .head-main:hover > .chevron
{
	color: var(--ot-text-1);
}

.e-5c75a80e > .box.collapsed > .head > .head-main > .chevron
{
	transform: rotate(-90deg);
}

/* Actions */

.e-5c75a80e > .box > .head > .actions
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
}

/* ===== CONTENT ===== */

.e-5c75a80e > .box > .content
{
	display: flex;
	flex-direction: column;
	animation: e-5c75a80e-expand 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-5c75a80e-expand
{
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Padded content */

.e-5c75a80e > .box.padded > .content
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-m);
}

.e-5c75a80e > .box.padded.size-s > .content
{
	padding: var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-5c75a80e > .box.padded.size-l > .content
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-l);
}

/* ===== BACKGROUND ===== */

.e-5c75a80e > .box.bg-1 { background: var(--ot-bg-1); }
.e-5c75a80e > .box.bg-2 { background: var(--ot-bg-2); }
.e-5c75a80e > .box.bg-3 { background: var(--ot-bg-3); }
.e-5c75a80e > .box.bg-4 { background: var(--ot-bg-4); }

.e-5c75a80e > .box.bg-1:not(.collapsed) > .head { border-bottom-color: var(--ot-bg-1-border); }
.e-5c75a80e > .box.bg-2:not(.collapsed) > .head { border-bottom-color: var(--ot-bg-2-border); }
.e-5c75a80e > .box.bg-3:not(.collapsed) > .head { border-bottom-color: var(--ot-bg-3-border); }
.e-5c75a80e > .box.bg-4:not(.collapsed) > .head { border-bottom-color: var(--ot-bg-4-border); }

/* ===== BORDER ===== */

.e-5c75a80e > .box.border { border-color: var(--ot-bg-2-border); }
.e-5c75a80e > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-5c75a80e > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-5c75a80e > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-5c75a80e > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== CLEAN ===== */

.e-5c75a80e > .box.clean
{
	background: transparent;
	border: none;
	border-radius: 0;
	gap: var(--ot-spacing-m);
}

.e-5c75a80e > .box.clean > .head
{
	padding: 0 0 var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-5c75a80e > .box.clean > .content
{
	padding: 0;
}

/* ===== SIZE: SMALL ===== */

.e-5c75a80e > .box.size-s > .head
{
	padding: var(--ot-spacing-m);
}

.e-5c75a80e > .box.size-s > .head > .head-main
{
	gap: var(--ot-spacing-s);
}

.e-5c75a80e > .box.size-s > .head > .head-main > .icon
{
	width: 34px;
	height: 34px;
	border-radius: var(--ot-radius-s);
}

.e-5c75a80e > .box.size-s > .head > .head-main > .icon > i
{
	font-size: 18px;
}

.e-5c75a80e > .box.size-s > .head > .head-main > .text > .eyebrow
{
	font-size: 10px;
}

.e-5c75a80e > .box.size-s > .head > .head-main > .text > .title
{
	font-size: 15px;
}

.e-5c75a80e > .box.size-s > .head > .head-main > .text > .description
{
	font-size: var(--ot-size-s);
}

.e-5c75a80e > .box.size-s > .head > .head-main > .chevron
{
	font-size: 20px;
}

/* ===== SIZE: LARGE ===== */

.e-5c75a80e > .box.size-l > .head
{
	padding: var(--ot-spacing-l);
}

.e-5c75a80e > .box.size-l > .head > .head-main > .icon
{
	width: 52px;
	height: 52px;
	border-radius: var(--ot-radius-l);
}

.e-5c75a80e > .box.size-l > .head > .head-main > .icon > i
{
	font-size: 26px;
}

.e-5c75a80e > .box.size-l > .head > .head-main > .text > .title
{
	font-size: 22px;
}

.e-5c75a80e > .box.size-l > .head > .head-main > .text > .description
{
	font-size: 14px;
}

.e-5c75a80e > .box.size-l > .head > .head-main > .chevron
{
	font-size: 26px;
}

/* Clean size overrides */

.e-5c75a80e > .box.clean.size-s > .head { padding: 0 0 var(--ot-spacing-s); }
.e-5c75a80e > .box.clean.size-l > .head { padding: 0 0 var(--ot-spacing-l); }
/* ===== FORM SELECT ===== */

.e-15ce864f
{
	display: contents;
}

/* Box */

.e-15ce864f > .box
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-15ce864f > .box.open
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Trigger */

.e-15ce864f > .box > .trigger
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
	cursor: pointer;
	user-select: none;
}

.e-15ce864f > .box > .trigger > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition);
}

.e-15ce864f > .box.open > .trigger > .icon
{
	color: var(--ot-text-1);
}

.e-15ce864f > .box > .trigger > .selected
{
	flex: 1;
	min-width: 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-15ce864f > .box > .trigger > .placeholder
{
	flex: 1;
	min-width: 0;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Action (clear) */

.e-15ce864f > .box > .trigger > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	margin-left: auto;
	border: none;
	background: transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-15ce864f > .box > .trigger > .action:hover
{
	background: var(--ot-bg-2-hover);
	color: var(--ot-text-1);
}

.e-15ce864f > .box > .trigger > .action > i
{
	font-size: 14px;
}

/* Arrow */

.e-15ce864f > .box > .trigger > .arrow
{
	flex-shrink: 0;
	font-size: 20px;
	color: var(--ot-text-3);
	margin-left: auto;
	transition: transform var(--ot-transition), color var(--ot-transition);
}

.e-15ce864f > .box > .trigger > .action + .arrow
{
	margin-left: 0;
}

.e-15ce864f > .box.open > .trigger > .arrow
{
	transform: rotate(180deg);
	color: var(--ot-brand);
}

/* ===== DROPDOWN (rendered via float overlay) ===== */

.e-15ce864f > .box > .dropdown
{
	position: absolute;
	top: calc(100% + var(--ot-spacing-x));
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--ot-shadow-m);
	z-index: 100;
	overflow: hidden;
	animation: e-15ce864f-drop var(--ot-transition);
}

@keyframes e-15ce864f-drop
{
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

.e-15ce864f > .box.above > .dropdown
{
	top: auto;
	bottom: calc(100% + var(--ot-spacing-x));
	animation: e-15ce864f-drop-above var(--ot-transition);
}

@keyframes e-15ce864f-drop-above
{
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Search */

.e-15ce864f > .box > .dropdown > .search
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: 0 var(--ot-spacing-m);
	height: var(--ot-height-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-15ce864f > .box > .dropdown > .search > i
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
}

.e-15ce864f > .box > .dropdown > .search > input
{
	flex: 1;
	min-width: 0;
	width: 100%;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
}

.e-15ce864f > .box > .dropdown > .search > input::placeholder
{
	color: var(--ot-text-3);
	font-weight: 400;
}

/* List */

.e-15ce864f > .box > .dropdown > .list
{
	display: flex;
	flex-direction: column;
	padding: var(--ot-spacing-x);
	max-height: 280px;
	overflow-y: auto;
}

/* Option */

.e-15ce864f > .box > .dropdown > .list > .option
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-15ce864f > .box > .dropdown > .list > .option > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition-fast);
}

.e-15ce864f > .box > .dropdown > .list > .option > .text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.e-15ce864f > .box > .dropdown > .list > .option > .text > .label
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-15ce864f > .box > .dropdown > .list > .option > .text > .description
{
	font-size: var(--ot-size-s);
	font-weight: 400;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-15ce864f > .box > .dropdown > .list > .option > .check
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 18px;
	color: var(--ot-brand);
}

.e-15ce864f > .box > .dropdown > .list > .option:hover:not(.disabled),
.e-15ce864f > .box > .dropdown > .list > .option.active:not(.disabled)
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-15ce864f > .box > .dropdown > .list > .option:hover:not(.disabled) > .icon,
.e-15ce864f > .box > .dropdown > .list > .option.active:not(.disabled) > .icon
{
	color: var(--ot-brand);
}

.e-15ce864f > .box > .dropdown > .list > .option.selected
{
	color: var(--ot-brand);
}

.e-15ce864f > .box > .dropdown > .list > .option.selected > .icon
{
	color: var(--ot-brand);
}

.e-15ce864f > .box > .dropdown > .list > .option.disabled
{
	opacity: 0.4;
	cursor: not-allowed;
}

/* Empty */

.e-15ce864f > .box > .dropdown > .list > .empty
{
	padding: var(--ot-spacing-m);
	text-align: center;
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

/* ===== DISABLED ===== */

.e-15ce864f > .box.disabled
{
	cursor: not-allowed;
	opacity: 0.55;
}

.e-15ce864f > .box.disabled > .trigger
{
	cursor: not-allowed;
}

/* ===== BACKGROUND ===== */

.e-15ce864f > .box.bg-1 { background: var(--ot-bg-1); }
.e-15ce864f > .box.bg-2 { background: var(--ot-bg-2); }
.e-15ce864f > .box.bg-3 { background: var(--ot-bg-3); }
.e-15ce864f > .box.bg-4 { background: var(--ot-bg-4); }

.e-15ce864f > .box.bg-1:hover:not(.open):not(.disabled) { background: var(--ot-bg-1-hover); }
.e-15ce864f > .box.bg-2:hover:not(.open):not(.disabled) { background: var(--ot-bg-2-hover); }
.e-15ce864f > .box.bg-3:hover:not(.open):not(.disabled) { background: var(--ot-bg-3-hover); }
.e-15ce864f > .box.bg-4:hover:not(.open):not(.disabled) { background: var(--ot-bg-4-hover); }

.e-15ce864f > .box.bg-1 > .trigger > .action:hover { background: var(--ot-bg-1-hover); }
.e-15ce864f > .box.bg-2 > .trigger > .action:hover { background: var(--ot-bg-2-hover); }
.e-15ce864f > .box.bg-3 > .trigger > .action:hover { background: var(--ot-bg-3-hover); }
.e-15ce864f > .box.bg-4 > .trigger > .action:hover { background: var(--ot-bg-4-hover); }

.e-15ce864f > .box.transparent { background: transparent; }

/* Border */

.e-15ce864f > .box.border { border-color: var(--ot-bg-2-border); }
.e-15ce864f > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-15ce864f > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-15ce864f > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-15ce864f > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-15ce864f > .box.size-s > .trigger
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-s);
}

.e-15ce864f > .box.size-s > .trigger > .icon { font-size: 15px; }

.e-15ce864f > .box.size-s > .trigger > .selected,
.e-15ce864f > .box.size-s > .trigger > .placeholder { font-size: var(--ot-size-s); }

.e-15ce864f > .box.size-s > .trigger > .arrow { font-size: 17px; }

.e-15ce864f > .box.size-s > .trigger > .action { width: 18px; height: 18px; }
.e-15ce864f > .box.size-s > .trigger > .action > i { font-size: 13px; }

.e-15ce864f > .box.size-m > .trigger
{
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
}

.e-15ce864f > .box.size-l > .trigger
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-l);
}

.e-15ce864f > .box.size-l > .trigger > .icon { font-size: 20px; }
.e-15ce864f > .box.size-l > .trigger > .arrow { font-size: 22px; }
.e-15ce864f > .box.size-l > .trigger > .action { width: 26px; height: 26px; }
.e-15ce864f > .box.size-l > .trigger > .action > i { font-size: 16px; }
/* ===== FORM TAGS ===== */

.e-283fbe2c
{
	display: contents;
}

/* Box */

.e-283fbe2c > .box
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-283fbe2c > .box:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Field */

.e-283fbe2c > .box > .field
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ot-spacing-x);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	min-height: var(--ot-height-m);
}

/* Tag */

.e-283fbe2c > .box > .field > .tag
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	padding: 3px 4px 3px var(--ot-spacing-s);
	border-radius: 100px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1;
	transition: background var(--ot-transition), border-color var(--ot-transition), transform var(--ot-transition);
}

.e-283fbe2c > .box > .field > .tag > .text
{
	padding: 0 var(--ot-spacing-x);
}

/* Remove button */

.e-283fbe2c > .box > .field > .tag > .remove
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	padding: 0;
	border: none;
	background: transparent;
	border-radius: 50%;
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-283fbe2c > .box > .field > .tag > .remove:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-283fbe2c > .box > .field > .tag > .remove > i
{
	font-size: 13px;
}

/* Shake */

.e-283fbe2c > .box > .field > .tag.shake
{
	animation: e-283fbe2c-shake 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-283fbe2c-shake
{
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-3px); }
	40% { transform: translateX(3px); }
	60% { transform: translateX(-2px); }
	80% { transform: translateX(2px); }
}

/* Input */

.e-283fbe2c > .box > .field > .input
{
	flex: 1;
	min-width: 80px;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
}

.e-283fbe2c > .box > .field > .input::placeholder
{
	color: var(--ot-text-3);
}

.e-283fbe2c > .box > .field > .input:disabled
{
	cursor: not-allowed;
}

/* Dropdown */

.e-283fbe2c > .box > .dropdown
{
	position: absolute;
	top: calc(100% + var(--ot-spacing-x));
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	padding: var(--ot-spacing-x);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--ot-shadow-m);
	z-index: 10;
	max-height: 240px;
	overflow-y: auto;
	animation: e-283fbe2c-drop var(--ot-transition);
}

@keyframes e-283fbe2c-drop
{
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: translateY(0); }
}

.e-283fbe2c > .box.above > .dropdown
{
	top: auto;
	bottom: calc(100% + var(--ot-spacing-x));
	animation: e-283fbe2c-drop-above var(--ot-transition);
}

@keyframes e-283fbe2c-drop-above
{
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}

.e-283fbe2c > .box > .dropdown > .option
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-283fbe2c > .box > .dropdown > .option > .label
{
	font-weight: 500;
	flex-shrink: 0;
}

.e-283fbe2c > .box > .dropdown > .option > .description
{
	color: var(--ot-text-3);
	font-size: var(--ot-size-s);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}

.e-283fbe2c > .box > .dropdown > .option:hover,
.e-283fbe2c > .box > .dropdown > .option.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

/* Chips (select mode) */

.e-283fbe2c > .box > .chips
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-x);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	min-height: var(--ot-height-m);
}

.e-283fbe2c > .box > .chips > .placeholder
{
	color: var(--ot-text-3);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 400;
	user-select: none;
}

.e-283fbe2c > .box > .chips > .chip
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	padding: 4px var(--ot-spacing-s);
	border-radius: 100px;
	background: var(--ot-bg-3);
	border: 1px solid var(--ot-bg-3-border);
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	outline: none;
	user-select: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-283fbe2c > .box > .chips > .chip:hover
{
	background: var(--ot-bg-3-hover);
	color: var(--ot-text-1);
}

.e-283fbe2c > .box > .chips > .chip:active
{
	transform: scale(0.95);
}

.e-283fbe2c > .box > .chips > .chip.selected
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand);
	color: var(--ot-brand);
}

.e-283fbe2c > .box > .chips > .chip:disabled
{
	cursor: not-allowed;
	opacity: 0.5;
}

/* Disabled */

.e-283fbe2c > .box.disabled
{
	cursor: not-allowed;
	opacity: 0.55;
}

.e-283fbe2c > .box.disabled > .field
{
	cursor: not-allowed;
}

/* ===== BACKGROUND ===== */

.e-283fbe2c > .box.bg-1 { background: var(--ot-bg-1); }

.e-283fbe2c > .box.bg-1 > .field > .tag
{
	background: var(--ot-bg-2);
	border-color: var(--ot-bg-1-border);
}

.e-283fbe2c > .box.bg-1 > .field > .tag > .remove:hover { background: var(--ot-bg-3); }
.e-283fbe2c > .box.bg-1 > .dropdown { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }

.e-283fbe2c > .box.bg-2 { background: var(--ot-bg-2); }

.e-283fbe2c > .box.bg-2 > .field > .tag
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
}

.e-283fbe2c > .box.bg-2 > .field > .tag > .remove:hover { background: var(--ot-bg-2-hover); }
.e-283fbe2c > .box.bg-2 > .dropdown { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }

.e-283fbe2c > .box.bg-3 { background: var(--ot-bg-3); }

.e-283fbe2c > .box.bg-3 > .field > .tag
{
	background: var(--ot-bg-2);
	border-color: var(--ot-bg-3-border);
}

.e-283fbe2c > .box.bg-3 > .field > .tag > .remove:hover { background: var(--ot-bg-3-hover); }
.e-283fbe2c > .box.bg-3 > .dropdown { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }

.e-283fbe2c > .box.bg-4 { background: var(--ot-bg-4); }

.e-283fbe2c > .box.bg-4 > .field > .tag
{
	background: var(--ot-bg-3);
	border-color: var(--ot-bg-4-border);
}

.e-283fbe2c > .box.bg-4 > .field > .tag > .remove:hover { background: var(--ot-bg-4-hover); }
.e-283fbe2c > .box.bg-4 > .dropdown { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

.e-283fbe2c > .box.bg-1:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-1-hover); }
.e-283fbe2c > .box.bg-2:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-2-hover); }
.e-283fbe2c > .box.bg-3:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-3-hover); }
.e-283fbe2c > .box.bg-4:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-4-hover); }

/* Transparent */

.e-283fbe2c > .box.transparent { background: transparent; }

/* Border */

.e-283fbe2c > .box.border { border-color: var(--ot-bg-2-border); }
.e-283fbe2c > .box.border.bg-1 { border-color: var(--ot-bg-1-border); }
.e-283fbe2c > .box.border.bg-2 { border-color: var(--ot-bg-2-border); }
.e-283fbe2c > .box.border.bg-3 { border-color: var(--ot-bg-3-border); }
.e-283fbe2c > .box.border.bg-4 { border-color: var(--ot-bg-4-border); }

/* ===== COLOR (tag chips) ===== */

.e-283fbe2c > .box.brand > .field > .tag { background: var(--ot-brand-opacity); border-color: var(--ot-brand); color: var(--ot-brand); }
.e-283fbe2c > .box.brand > .field > .tag > .remove { color: var(--ot-brand); }
.e-283fbe2c > .box.brand > .field > .tag > .remove:hover { background: var(--ot-brand); color: #fff; }
.e-283fbe2c > .box.brand > .chips > .chip.selected { background: var(--ot-brand-opacity); border-color: var(--ot-brand); color: var(--ot-brand); }

.e-283fbe2c > .box.blue > .field > .tag { background: var(--ot-blue-opacity); border-color: var(--ot-blue); color: var(--ot-blue); }
.e-283fbe2c > .box.blue > .field > .tag > .remove { color: var(--ot-blue); }
.e-283fbe2c > .box.blue > .field > .tag > .remove:hover { background: var(--ot-blue); color: #fff; }
.e-283fbe2c > .box.blue > .chips > .chip.selected { background: var(--ot-blue-opacity); border-color: var(--ot-blue); color: var(--ot-blue); }

.e-283fbe2c > .box.red > .field > .tag { background: var(--ot-red-opacity); border-color: var(--ot-red); color: var(--ot-red); }
.e-283fbe2c > .box.red > .field > .tag > .remove { color: var(--ot-red); }
.e-283fbe2c > .box.red > .field > .tag > .remove:hover { background: var(--ot-red); color: #fff; }
.e-283fbe2c > .box.red > .chips > .chip.selected { background: var(--ot-red-opacity); border-color: var(--ot-red); color: var(--ot-red); }

.e-283fbe2c > .box.orange > .field > .tag { background: var(--ot-orange-opacity); border-color: var(--ot-orange); color: var(--ot-orange); }
.e-283fbe2c > .box.orange > .field > .tag > .remove { color: var(--ot-orange); }
.e-283fbe2c > .box.orange > .field > .tag > .remove:hover { background: var(--ot-orange); color: #fff; }
.e-283fbe2c > .box.orange > .chips > .chip.selected { background: var(--ot-orange-opacity); border-color: var(--ot-orange); color: var(--ot-orange); }

.e-283fbe2c > .box.green > .field > .tag { background: var(--ot-green-opacity); border-color: var(--ot-green); color: var(--ot-green); }
.e-283fbe2c > .box.green > .field > .tag > .remove { color: var(--ot-green); }
.e-283fbe2c > .box.green > .field > .tag > .remove:hover { background: var(--ot-green); color: #fff; }
.e-283fbe2c > .box.green > .chips > .chip.selected { background: var(--ot-green-opacity); border-color: var(--ot-green); color: var(--ot-green); }

/* ===== SIZE ===== */

/* Small */

.e-283fbe2c > .box.size-s > .field,
.e-283fbe2c > .box.size-s > .chips
{
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
	min-height: var(--ot-height-s);
}

.e-283fbe2c > .box.size-s > .field > .tag
{
	font-size: 10.5px;
	padding: 2px 3px 2px 7px;
}

.e-283fbe2c > .box.size-s > .field > .tag > .remove
{
	width: 14px;
	height: 14px;
}

.e-283fbe2c > .box.size-s > .field > .tag > .remove > i
{
	font-size: 11px;
}

.e-283fbe2c > .box.size-s > .field > .input
{
	font-size: var(--ot-size-s);
}

.e-283fbe2c > .box.size-s > .chips > .chip
{
	font-size: 10.5px;
	padding: 2px var(--ot-spacing-s);
}

/* Medium */

.e-283fbe2c > .box.size-m > .field,
.e-283fbe2c > .box.size-m > .chips
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	min-height: var(--ot-height-m);
}

/* Large */

.e-283fbe2c > .box.size-l > .field,
.e-283fbe2c > .box.size-l > .chips
{
	padding: var(--ot-spacing-s) var(--ot-spacing-l);
	min-height: var(--ot-height-l);
}

.e-283fbe2c > .box.size-l > .field > .tag
{
	font-size: 12.5px;
	padding: 4px 5px 4px var(--ot-spacing-s);
}

.e-283fbe2c > .box.size-l > .field > .tag > .remove
{
	width: 18px;
	height: 18px;
}

.e-283fbe2c > .box.size-l > .field > .tag > .remove > i
{
	font-size: 14px;
}

.e-283fbe2c > .box.size-l > .field > .input
{
	font-size: var(--ot-size-m);
}

.e-283fbe2c > .box.size-l > .chips > .chip
{
	font-size: 12.5px;
	padding: 5px var(--ot-spacing-m);
}
/* ===== FORM TEXTAREA ===== */

.e-5973ffcd
{
	display: contents;
}

/* Box */

.e-5973ffcd > .box
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	background: transparent;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5973ffcd > .box:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Textarea */

.e-5973ffcd > .box > textarea
{
	width: 100%;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	line-height: 1.6;
}

.e-5973ffcd > .box > textarea::placeholder
{
	color: var(--ot-text-3);
	font-weight: 400;
}

.e-5973ffcd > .box > textarea:disabled
{
	cursor: not-allowed;
}

/* Counter */

.e-5973ffcd > .box > .counter
{
	display: flex;
	align-items: center;
	gap: 2px;
	align-self: flex-end;
	margin-top: var(--ot-spacing-x);
	padding-top: var(--ot-spacing-x);
	font-family: var(--ot-font-primary);
	font-size: 10.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	font-variant-numeric: tabular-nums;
	transition: color var(--ot-transition);
	pointer-events: none;
}

.e-5973ffcd > .box > .counter > .slash
{
	opacity: 0.5;
}

.e-5973ffcd > .box > .counter > .full
{
	color: var(--ot-red);
	font-weight: 600;
}

/* Disabled */

.e-5973ffcd > .box.disabled
{
	cursor: not-allowed;
	opacity: 0.55;
}

/* ===== BACKGROUND ===== */

.e-5973ffcd > .box.bg-1 { background: var(--ot-bg-1); }
.e-5973ffcd > .box.bg-2 { background: var(--ot-bg-2); }
.e-5973ffcd > .box.bg-3 { background: var(--ot-bg-3); }
.e-5973ffcd > .box.bg-4 { background: var(--ot-bg-4); }

.e-5973ffcd > .box.bg-1:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-1-hover); }
.e-5973ffcd > .box.bg-2:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-2-hover); }
.e-5973ffcd > .box.bg-3:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-3-hover); }
.e-5973ffcd > .box.bg-4:hover:not(:focus-within):not(.disabled) { background: var(--ot-bg-4-hover); }

/* Transparent */

.e-5973ffcd > .box.transparent
{
	background: transparent;
	padding: 0;
}

/* ===== BORDER ===== */

.e-5973ffcd > .box.border { border-color: var(--ot-bg-2-border); }
.e-5973ffcd > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-5973ffcd > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-5973ffcd > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-5973ffcd > .box.bg-4.border { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-5973ffcd > .box.size-s
{
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
}

.e-5973ffcd > .box.size-s > textarea
{
	font-size: var(--ot-size-s);
	line-height: 1.5;
}

.e-5973ffcd > .box.size-m
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
}

.e-5973ffcd > .box.size-m > textarea
{
	font-size: var(--ot-size-m);
	line-height: 1.6;
}

.e-5973ffcd > .box.size-l
{
	padding: var(--ot-spacing-m) var(--ot-spacing-l);
}

.e-5973ffcd > .box.size-l > textarea
{
	font-size: var(--ot-size-m);
	line-height: 1.7;
}

/* Variable button */
.e-5973ffcd > .box
{
	position: relative;
}

.e-5973ffcd > .box > .variable-btn
{
	position: absolute;
	top: 6px;
	right: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
	z-index: 1;
}

.e-5973ffcd > .box > .variable-btn:hover
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-5973ffcd > .box > .variable-btn > i
{
	font-size: 14px;
}
/* ===== FORM TOGGLE ===== */

.e-180e0ca7
{
	display: contents;
}

/* Expression wrapper */

.e-180e0ca7 > .expression
{
	display: block;
	width: 100%;
}

/* Variable button */

.e-180e0ca7 > .box > .variable-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--ot-height-s);
	height: var(--ot-height-s);
	padding: 0;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-180e0ca7 > .box > .variable-btn:hover
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-180e0ca7 > .box > .variable-btn > i
{
	font-size: 14px;
}

/* Box */

.e-180e0ca7 > .box
{
	position: relative;
	display: inline-flex;
	align-items: flex-start;
	gap: var(--ot-spacing-s);
	cursor: pointer;
	user-select: none;
	font-family: var(--ot-font-primary);
}

.e-180e0ca7 > .box.reverse
{
	flex-direction: row-reverse;
}

/* Hidden input */

.e-180e0ca7 > .box > input
{
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	margin: 0;
}

/* Track */

.e-180e0ca7 > .box > .track
{
	position: relative;
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	border-radius: 100px;
	background: var(--ot-bg-3);
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

/* Thumb */

.e-180e0ca7 > .box > .track > .thumb
{
	position: absolute;
	top: 50%;
	border-radius: 50%;
	background: #fff;
	box-shadow: var(--ot-shadow-s);
	transform: translateY(-50%);
	transition: transform var(--ot-transition);
}

/* Active */

.e-180e0ca7 > .box.active > .track
{
	background: var(--ot-brand);
}

/* Press feedback */

.e-180e0ca7 > .box:active:not(.disabled) > .track > .thumb
{
	transform: translateY(-50%) scaleX(1.1);
}

/* Focus ring */

.e-180e0ca7 > .box > input:focus-visible ~ .track
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Info */

.e-180e0ca7 > .box > .info
{
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	padding-top: 1px;
}

.e-180e0ca7 > .box > .info > .label
{
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	line-height: 1.3;
	transition: color var(--ot-transition);
}

.e-180e0ca7 > .box > .info > .desc
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.4;
	transition: color var(--ot-transition);
}

/* Disabled */

.e-180e0ca7 > .box.disabled
{
	cursor: not-allowed;
}

.e-180e0ca7 > .box.disabled > .track
{
	opacity: 0.45;
}

.e-180e0ca7 > .box.disabled > .info > .label,
.e-180e0ca7 > .box.disabled > .info > .desc
{
	color: var(--ot-text-3);
	opacity: 0.6;
}

/* ===== BACKGROUND ===== */

.e-180e0ca7 > .box.bg-1 > .track { background: var(--ot-bg-1); }
.e-180e0ca7 > .box.bg-2 > .track { background: var(--ot-bg-2); }
.e-180e0ca7 > .box.bg-3 > .track { background: var(--ot-bg-3); }
.e-180e0ca7 > .box.bg-4 > .track { background: var(--ot-bg-4); }

/* Border */

.e-180e0ca7 > .box.border.bg-1 > .track { border: 1px solid var(--ot-bg-1-border); }
.e-180e0ca7 > .box.border.bg-2 > .track { border: 1px solid var(--ot-bg-2-border); }
.e-180e0ca7 > .box.border.bg-3 > .track { border: 1px solid var(--ot-bg-3-border); }
.e-180e0ca7 > .box.border.bg-4 > .track { border: 1px solid var(--ot-bg-4-border); }

/* ===== COLOR (active state) ===== */

.e-180e0ca7 > .box.active.brand > .track { background: var(--ot-brand); border-color: var(--ot-brand); }
.e-180e0ca7 > .box.active.blue > .track { background: var(--ot-blue); border-color: var(--ot-blue); }
.e-180e0ca7 > .box.active.red > .track { background: var(--ot-red); border-color: var(--ot-red); }
.e-180e0ca7 > .box.active.orange > .track { background: var(--ot-orange); border-color: var(--ot-orange); }
.e-180e0ca7 > .box.active.green > .track { background: var(--ot-green); border-color: var(--ot-green); }

/* Focus per color */

.e-180e0ca7 > .box.blue > input:focus-visible ~ .track { box-shadow: 0 0 0 1px var(--ot-blue-opacity); }
.e-180e0ca7 > .box.red > input:focus-visible ~ .track { box-shadow: 0 0 0 1px var(--ot-red-opacity); }
.e-180e0ca7 > .box.orange > input:focus-visible ~ .track { box-shadow: 0 0 0 1px var(--ot-orange-opacity); }
.e-180e0ca7 > .box.green > input:focus-visible ~ .track { box-shadow: 0 0 0 1px var(--ot-green-opacity); }

/* ===== SIZE ===== */

/* Small */

.e-180e0ca7 > .box.size-s > .track
{
	width: 28px;
	height: 16px;
}

.e-180e0ca7 > .box.size-s > .track > .thumb
{
	width: 12px;
	height: 12px;
	left: 2px;
}

.e-180e0ca7 > .box.size-s.active > .track > .thumb
{
	transform: translate(12px, -50%);
}

.e-180e0ca7 > .box.size-s:active:not(.disabled) > .track > .thumb
{
	transform: translateY(-50%) scaleX(1.1);
}

.e-180e0ca7 > .box.size-s.active:active:not(.disabled) > .track > .thumb
{
	transform: translate(10px, -50%) scaleX(1.2);
}

.e-180e0ca7 > .box.size-s > .info > .label
{
	font-size: var(--ot-size-s);
}

.e-180e0ca7 > .box.size-s > .info > .desc
{
	font-size: 10.5px;
}

/* Medium */

.e-180e0ca7 > .box.size-m > .track
{
	width: 36px;
	height: 20px;
}

.e-180e0ca7 > .box.size-m > .track > .thumb
{
	width: 16px;
	height: 16px;
	left: 2px;
}

.e-180e0ca7 > .box.size-m.active > .track > .thumb
{
	transform: translate(16px, -50%);
}

.e-180e0ca7 > .box.size-m:active:not(.disabled) > .track > .thumb
{
	transform: translateY(-50%) scaleX(1.15);
}

.e-180e0ca7 > .box.size-m.active:active:not(.disabled) > .track > .thumb
{
	transform: translate(13px, -50%) scaleX(1.25);
}

/* Large */

.e-180e0ca7 > .box.size-l > .track
{
	width: 44px;
	height: 24px;
}

.e-180e0ca7 > .box.size-l > .track > .thumb
{
	width: 20px;
	height: 20px;
	left: 2px;
}

.e-180e0ca7 > .box.size-l.active > .track > .thumb
{
	transform: translate(20px, -50%);
}

.e-180e0ca7 > .box.size-l:active:not(.disabled) > .track > .thumb
{
	transform: translateY(-50%) scaleX(1.15);
}

.e-180e0ca7 > .box.size-l.active:active:not(.disabled) > .track > .thumb
{
	transform: translate(17px, -50%) scaleX(1.25);
}

.e-180e0ca7 > .box.size-l > .info > .label
{
	font-size: var(--ot-size-m);
}
/* ===== FORM TRANSFER ===== */

.e-1e66ff82
{
	display: contents;
}

/* Box */

.e-1e66ff82 > .box
{
	display: flex;
	align-items: stretch;
	gap: var(--ot-spacing-m);
	width: 100%;
	min-height: 320px;
}

/* ===== PANEL ===== */

.e-1e66ff82 > .box > .panel
{
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	border-radius: var(--ot-radius-m);
	border: 1px solid transparent;
	overflow: hidden;
}

/* Head */

.e-1e66ff82 > .box > .panel > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	flex-shrink: 0;
}

.e-1e66ff82 > .box > .panel > .head > .title
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-1e66ff82 > .box > .panel > .head > .counter
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-3);
}

/* Search */

.e-1e66ff82 > .box > .panel > .search
{
	padding: 0 var(--ot-spacing-s) var(--ot-spacing-s);
	flex-shrink: 0;
}

/* List */

.e-1e66ff82 > .box > .panel > .list
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 0 var(--ot-spacing-s) var(--ot-spacing-s);
	flex: 1;
	min-height: 0;
	max-height: 300px;
	overflow-y: auto;
}

/* Empty */

.e-1e66ff82 > .box > .panel > .list > .empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-s);
	flex: 1;
	min-height: 160px;
	color: var(--ot-text-3);
}

.e-1e66ff82 > .box > .panel > .list > .empty > i
{
	font-size: 28px;
	opacity: 0.6;
}

.e-1e66ff82 > .box > .panel > .list > .empty > span
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
}

/* Item */

.e-1e66ff82 > .box > .panel > .list > .item
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: var(--ot-spacing-s);
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-s);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), border-color var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-1e66ff82 > .box > .panel > .list > .item:hover:not(.disabled)
{
	background: var(--ot-bg-2);
}

.e-1e66ff82 > .box > .panel > .list > .item.disabled
{
	opacity: 0.4;
	cursor: not-allowed;
}

/* Item icon */

.e-1e66ff82 > .box > .panel > .list > .item > .item-icon
{
	flex-shrink: 0;
	font-size: 20px;
	color: var(--ot-text-2);
}


/* Item text */

.e-1e66ff82 > .box > .panel > .list > .item > .item-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	flex: 1;
	min-width: 0;
}

.e-1e66ff82 > .box > .panel > .list > .item > .item-text > .item-label
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-1e66ff82 > .box > .panel > .list > .item > .item-text > .item-desc
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Item move indicator (revealed on hover) */

.e-1e66ff82 > .box > .panel > .list > .item > .item-move
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	opacity: 0;
	transition: opacity var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-1e66ff82 > .box > .panel > .list > .item:hover:not(.disabled) > .item-move
{
	opacity: 1;
	color: var(--ot-brand);
}

/* ===== CONTROLS ===== */

.e-1e66ff82 > .box > .controls
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
	padding: var(--ot-spacing-s);
}

.e-1e66ff82 > .box > .controls > .control
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--ot-height-m);
	height: var(--ot-height-m);
	padding: 0;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast), border-color var(--ot-transition-fast), transform var(--ot-transition-fast);
}

.e-1e66ff82 > .box > .controls > .control:hover:not(:disabled)
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-3-border);
}

.e-1e66ff82 > .box > .controls > .control.accent:not(:disabled)
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-1e66ff82 > .box > .controls > .control.accent:hover:not(:disabled)
{
	background: var(--ot-brand-hover);
	border-color: var(--ot-brand-hover);
	transform: translateX(2px);
}

.e-1e66ff82 > .box > .controls > .control.accent:nth-child(3):hover:not(:disabled)
{
	transform: translateX(-2px);
}

.e-1e66ff82 > .box > .controls > .control:disabled
{
	opacity: 0.35;
	cursor: not-allowed;
}

.e-1e66ff82 > .box > .controls > .control > i
{
	font-size: 18px;
}

/* ===== BACKGROUND ===== */

.e-1e66ff82 > .box.bg-1 > .panel { background: var(--ot-bg-1); }
.e-1e66ff82 > .box.bg-2 > .panel { background: var(--ot-bg-2); }
.e-1e66ff82 > .box.bg-3 > .panel { background: var(--ot-bg-3); }
.e-1e66ff82 > .box.bg-4 > .panel { background: var(--ot-bg-4); }

/* Border */

.e-1e66ff82 > .box.border.bg-1 > .panel { border-color: var(--ot-bg-1-border); }
.e-1e66ff82 > .box.border.bg-2 > .panel { border-color: var(--ot-bg-2-border); }
.e-1e66ff82 > .box.border.bg-3 > .panel { border-color: var(--ot-bg-3-border); }
.e-1e66ff82 > .box.border.bg-4 > .panel { border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-1e66ff82 > .box.size-s > .panel > .head
{
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
}

.e-1e66ff82 > .box.size-s > .panel > .list > .item
{
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
	gap: var(--ot-spacing-x);
}

.e-1e66ff82 > .box.size-s > .panel > .list > .item > .item-icon
{
	font-size: 16px;
}

.e-1e66ff82 > .box.size-s > .controls > .control
{
	width: var(--ot-height-s);
	height: var(--ot-height-s);
}

.e-1e66ff82 > .box.size-s > .controls > .control > i
{
	font-size: 15px;
}

.e-1e66ff82 > .box.size-l > .panel > .head
{
	padding: var(--ot-spacing-m) var(--ot-spacing-l);
}

.e-1e66ff82 > .box.size-l > .panel > .list > .item
{
	padding: var(--ot-spacing-m) var(--ot-spacing-l);
	gap: var(--ot-spacing-m);
}

.e-1e66ff82 > .box.size-l > .panel > .list > .item > .item-icon
{
	font-size: 22px;
}

.e-1e66ff82 > .box.size-l > .controls > .control
{
	width: var(--ot-height-l);
	height: var(--ot-height-l);
}

.e-1e66ff82 > .box.size-l > .controls > .control > i
{
	font-size: 20px;
}

/* ===== DISABLED ===== */

.e-1e66ff82 > .box.disabled
{
	opacity: 0.65;
	pointer-events: none;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 767.98px)
{
	.e-1e66ff82 > .box
	{
		flex-direction: column;
	}

	.e-1e66ff82 > .box > .controls
	{
		flex-direction: row;
		width: 100%;
		justify-content: center;
	}
}
/* ===== FORM UPLOAD ===== */

.e-3f8bc2c8
{
	display: contents;
}

/* Box */

.e-3f8bc2c8 > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	width: 100%;
}

.e-3f8bc2c8 > .box.disabled
{
	opacity: 0.5;
	pointer-events: none;
}

/* ===== DROPZONE ===== */

.e-3f8bc2c8 > .box > .zone
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 160px;
	padding: var(--ot-spacing-l);
	background: var(--ot-bg-2);
	border: 1.5px dashed var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	cursor: pointer;
	transition: background var(--ot-transition), border-color var(--ot-transition), transform var(--ot-transition);
}

.e-3f8bc2c8 > .box > .zone:hover
{
	background: var(--ot-bg-3);
	border-color: var(--ot-bg-3-border);
}

/* Hidden input */

.e-3f8bc2c8 > .box > .zone > .input
{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* Prompt */

.e-3f8bc2c8 > .box > .zone > .prompt
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ot-spacing-s);
	text-align: center;
	cursor: pointer;
}

.e-3f8bc2c8 > .box > .zone > .prompt > .badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-2);
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition), transform var(--ot-transition);
}

.e-3f8bc2c8 > .box > .zone > .prompt > .badge > i
{
	font-size: 24px;
}

.e-3f8bc2c8 > .box > .zone > .prompt > .badge > .spin
{
	font-size: 24px;
	animation: e-3f8bc2c8-spin 0.8s linear infinite;
}

@keyframes e-3f8bc2c8-spin
{
	to { transform: rotate(360deg); }
}

.e-3f8bc2c8 > .box > .zone > .prompt > .text
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-3f8bc2c8 > .box > .zone > .prompt > .text > .label
{
	font-size: var(--ot-size-m);
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-3f8bc2c8 > .box > .zone > .prompt > .text > .hint
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

/* Has files — zone becomes grid container */

.e-3f8bc2c8 > .box > .zone.compact
{
	min-height: auto;
	padding: var(--ot-spacing-s);
	align-items: stretch;
	justify-content: stretch;
}

/* ===== GRID (inside zone) ===== */

.e-3f8bc2c8 > .box > .zone > .grid
{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: var(--ot-spacing-s);
	width: 100%;
}

/* Card */

.e-3f8bc2c8 > .box > .zone > .grid > .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: var(--ot-radius-s);
	overflow: hidden;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	animation: e-3f8bc2c8-in 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-3f8bc2c8-in
{
	from { opacity: 0; transform: scale(0.95); }
	to { opacity: 1; transform: scale(1); }
}

/* Drag and drop reorder */

.e-3f8bc2c8 > .box > .zone > .grid > .card[draggable="true"]
{
	cursor: grab;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.dragging
{
	opacity: 0.4;
	cursor: grabbing;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.drag-over
{
	border-color: var(--ot-brand);
	background: var(--ot-brand-opacity);
}

/* Thumbnail */

.e-3f8bc2c8 > .box > .zone > .grid > .card > .thumb
{
	width: 100%;
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: var(--ot-radius-s);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card > .thumb > img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card > .thumb.placeholder
{
	color: var(--ot-text-3);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card > .thumb.placeholder > i
{
	font-size: 28px;
}

/* Remove button */

.e-3f8bc2c8 > .box > .zone > .grid > .card > .remove
{
	position: absolute;
	top: var(--ot-spacing-x);
	right: var(--ot-spacing-x);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	padding: 0;
	background: var(--ot-bg-1-opacity);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	border: none;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	cursor: pointer;
	opacity: 0;
	transition: opacity var(--ot-transition-fast), background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card:hover > .remove
{
	opacity: 1;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card > .remove:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card > .remove > i
{
	font-size: 14px;
}

/* Add card */

.e-3f8bc2c8 > .box > .zone > .grid > .card.add
{
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	border: 1.5px dashed var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-1);
	cursor: pointer;
	color: var(--ot-text-3);
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.add:hover
{
	background: var(--ot-bg-3);
	border-color: var(--ot-bg-3-border);
	color: var(--ot-text-1);
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.add.loading
{
	cursor: default;
	border-style: solid;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.add .spin
{
	animation: e-3f8bc2c8-spin 0.8s linear infinite;
}

.e-3f8bc2c8 > .box > .zone > .grid > .card.add > i
{
	font-size: 24px;
}

/* ===== FOOTER ===== */

.e-3f8bc2c8 > .box > .footer
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
}

.e-3f8bc2c8 > .box > .footer > .count
{
	font-size: var(--ot-size-s);
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-3f8bc2c8 > .box > .footer > .clear
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-x);
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-3);
	cursor: pointer;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-3f8bc2c8 > .box > .footer > .clear:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

.e-3f8bc2c8 > .box > .footer > .clear > i
{
	font-size: 14px;
}


/* ===== BACKGROUND ===== */

.e-3f8bc2c8 > .box.bg-1 > .zone { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-3f8bc2c8 > .box.bg-1 > .zone:hover { background: var(--ot-bg-2); }
.e-3f8bc2c8 > .box.bg-1 > .zone > .prompt > .badge { background: var(--ot-bg-2); }

.e-3f8bc2c8 > .box.bg-2 > .zone { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-3f8bc2c8 > .box.bg-2 > .zone:hover { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }

.e-3f8bc2c8 > .box.bg-3 > .zone { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-3f8bc2c8 > .box.bg-3 > .zone:hover { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

.e-3f8bc2c8 > .box.bg-4 > .zone { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

/* ===== SIZE ===== */

.e-3f8bc2c8 > .box.size-s > .zone
{
	min-height: 100px;
	padding: var(--ot-spacing-m);
}

.e-3f8bc2c8 > .box.size-s > .zone > .prompt > .badge
{
	width: 36px;
	height: 36px;
}

.e-3f8bc2c8 > .box.size-s > .zone > .prompt > .badge > i
{
	font-size: 18px;
}

.e-3f8bc2c8 > .box.size-s > .zone > .grid
{
	grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
	gap: var(--ot-spacing-x);
}

.e-3f8bc2c8 > .box.size-l > .zone
{
	min-height: 220px;
	padding: var(--ot-spacing-l);
}

.e-3f8bc2c8 > .box.size-l > .zone > .prompt > .badge
{
	width: 60px;
	height: 60px;
}

.e-3f8bc2c8 > .box.size-l > .zone > .prompt > .badge > i
{
	font-size: 30px;
}

.e-3f8bc2c8 > .box.size-l > .zone > .grid
{
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}
/* ===== FORM UPLOAD INPUT ===== */

.e-37c1b86d
{
	display: contents;
}

/* Box */

.e-37c1b86d > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
}

.e-37c1b86d > .box.disabled
{
	opacity: 0.5;
	pointer-events: none;
}

/* Field */

.e-37c1b86d > .box > .field
{
	display: flex;
	align-items: center;
	width: 100%;
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-37c1b86d > .box > .field:focus-within
{
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

/* Preview */

.e-37c1b86d > .box > .field > .preview
{
	flex-shrink: 0;
	width: var(--ot-height-s);
	height: var(--ot-height-s);
	border-radius: var(--ot-radius-s);
	overflow: hidden;
	margin-right: var(--ot-spacing-s);
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-bg-1);
}

.e-37c1b86d > .box > .field > .preview > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.e-37c1b86d > .box > .field > .preview.placeholder
{
	color: var(--ot-text-3);
}

.e-37c1b86d > .box > .field > .preview.placeholder > i
{
	font-size: 16px;
}

/* Icon */

.e-37c1b86d > .box > .field > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	margin-right: var(--ot-spacing-s);
	transition: color var(--ot-transition);
}

.e-37c1b86d > .box > .field:focus-within > .icon
{
	color: var(--ot-text-1);
}

.e-37c1b86d > .box > .field > .icon.spin
{
	margin-right: 0;
	margin-left: var(--ot-spacing-s);
	animation: e-37c1b86d-spin 0.8s linear infinite;
}

@keyframes e-37c1b86d-spin
{
	to { transform: rotate(360deg); }
}

/* Input */

.e-37c1b86d > .box > .field > .input
{
	flex: 1;
	min-width: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
}

.e-37c1b86d > .box > .field > .input::placeholder
{
	color: var(--ot-text-3);
	font-weight: 400;
}

/* Action buttons */

.e-37c1b86d > .box > .field > .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	padding: 0;
	margin-left: var(--ot-spacing-x);
	border: none;
	background: transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-37c1b86d > .box > .field > .action:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-37c1b86d > .box > .field > .action > i
{
	font-size: 14px;
}

/* Hidden file input */

.e-37c1b86d > .box > .picker
{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* ===== BACKGROUNDS ===== */

.e-37c1b86d > .box.bg-1 > .field { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-37c1b86d > .box.bg-2 > .field { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-37c1b86d > .box.bg-3 > .field { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-37c1b86d > .box.bg-4 > .field { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

.e-37c1b86d > .box.bg-1 > .field:hover:not(:focus-within) { background: var(--ot-bg-1-hover); }
.e-37c1b86d > .box.bg-2 > .field:hover:not(:focus-within) { background: var(--ot-bg-2-hover); }
.e-37c1b86d > .box.bg-3 > .field:hover:not(:focus-within) { background: var(--ot-bg-3-hover); }
.e-37c1b86d > .box.bg-4 > .field:hover:not(:focus-within) { background: var(--ot-bg-4-hover); }

/* Border */

.e-37c1b86d > .box.border > .field { border-color: var(--ot-bg-2-border); }
.e-37c1b86d > .box.bg-1.border > .field { border-color: var(--ot-bg-1-border); }
.e-37c1b86d > .box.bg-3.border > .field { border-color: var(--ot-bg-3-border); }
.e-37c1b86d > .box.bg-4.border > .field { border-color: var(--ot-bg-4-border); }

/* Border bottom */

.e-37c1b86d > .box.border-bottom > .field
{
	border-radius: 0;
	border-color: transparent;
	border-bottom-color: var(--ot-bg-2-border);
}

/* ===== SIZES ===== */

.e-37c1b86d > .box.size-s > .field
{
	height: var(--ot-height-s);
	padding: 0 var(--ot-spacing-s);
}

.e-37c1b86d > .box.size-s > .field > .preview
{
	width: 20px;
	height: 20px;
}

.e-37c1b86d > .box.size-s > .field > .icon { font-size: 15px; }
.e-37c1b86d > .box.size-s > .field > .input { font-size: var(--ot-size-s); }
.e-37c1b86d > .box.size-s > .field > .action { width: 18px; height: 18px; }
.e-37c1b86d > .box.size-s > .field > .action > i { font-size: 13px; }

.e-37c1b86d > .box.size-l > .field
{
	height: var(--ot-height-l);
	padding: 0 var(--ot-spacing-l);
}

.e-37c1b86d > .box.size-l > .field > .preview
{
	width: var(--ot-height-m);
	height: var(--ot-height-m);
}

.e-37c1b86d > .box.size-l > .field > .icon { font-size: 20px; }
.e-37c1b86d > .box.size-l > .field > .action { width: 26px; height: 26px; }
.e-37c1b86d > .box.size-l > .field > .action > i { font-size: 16px; }
/* Root */

.e-18fbce40
{
	display: block;
	width: 100%;
}

/* Holder */

.e-18fbce40 > .holder
{
	position: relative;
	width: 100%;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background-color: #1a1a20;
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: flex-end;
}

/* Overlay */

.e-18fbce40 > .holder > .overlay
{
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.e-18fbce40 > .holder.image > .overlay
{
	background: linear-gradient(180deg, rgba(20, 20, 30, 0.05) 0%, rgba(20, 20, 30, 0.55) 100%);
}

.e-18fbce40 > .holder.dark
{
	background: linear-gradient(160deg, #1a1a20 0%, #2c2632 100%);
}

.e-18fbce40 > .holder.dark > .overlay
{
	background: radial-gradient(circle at 100% 0%, rgba(214, 138, 58, 0.35) 0%, transparent 50%);
}

/* Content */

.e-18fbce40 > .holder > .content
{
	position: relative;
	width: 100%;
	color: white;
	display: flex;
	flex-direction: column;
}

/* Icon (dark variant) */

.e-18fbce40 > .holder > .content > .icon
{
	width: 42px;
	height: 42px;
	border-radius: 11px;
	background: rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--ot-spacing-m);
	flex-shrink: 0;
}

.e-18fbce40 > .holder > .content > .icon > i
{
	color: #ffd9a8;
	font-size: 22px;
}

/* Eyebrow */

.e-18fbce40 > .holder > .content > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: 5px 12px 5px 7px;
	background: rgba(255, 255, 255, 0.14);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 500;
	color: white;
	margin-bottom: var(--ot-spacing-m);
	width: fit-content;
	font-family: var(--ot-font-primary);
}

.e-18fbce40 > .holder > .content > .eyebrow > .dot
{
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.95);
	display: flex;
	align-items: center;
	justify-content: center;
}

.e-18fbce40 > .holder > .content > .eyebrow > .dot > i
{
	font-size: 11px;
	color: var(--ot-brand);
}

/* Title */

.e-18fbce40 > .holder > .content > .title
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.025em;
	color: white;
	font-variation-settings: 'opsz' 144, 'wght' 400;
	margin: 0 0 var(--ot-spacing-s);
	max-width: 720px;
}

.e-18fbce40 > .holder > .content > .title em
{
	font-style: italic;
	color: #ffd9a8;
	font-weight: 400;
}

/* Description */

.e-18fbce40 > .holder > .content > .description
{
	font-size: 14.5px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.85);
	max-width: 540px;
	margin: 0;
	font-family: var(--ot-font-primary);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Bottom slot */

.e-18fbce40 > .holder > .content > .bottom:not(:empty)
{
	display: flex;
	align-items: center;
	margin-top: var(--ot-spacing-l);
}

.e-18fbce40 > .holder > .content > .title
{
	line-height: 1.0;
}

.e-18fbce40 > .holder.dark
{
	align-items: flex-start;
}

.e-18fbce40 > .holder.dark > .content > .title
{
	font-size: 26px;
}

/* Size variants */

.e-18fbce40 > .holder.size-s > .content
{
	padding: 32px 24px;
}

.e-18fbce40 > .holder.size-s > .content > .title
{
	font-size: 26px;
}

.e-18fbce40 > .holder.size-s > .content > .description
{
	font-size: 13px;
}

.e-18fbce40 > .holder.size-m > .content
{
	padding: 48px 36px;
}

.e-18fbce40 > .holder.size-m > .content > .title
{
	font-size: 36px;
}

.e-18fbce40 > .holder.size-l > .content
{
	padding: 44px 48px;
}

.e-18fbce40 > .holder.size-l > .content > .title
{
	font-size: 52px;
}
/* ===== GLOBAL CODE ===== */

.e-4a15b201
{
	display: contents;

	--code-background: var(--ot-bg-2);
	--code-border: var(--ot-bg-2-border);
	--code-overlay: var(--ot-bg-1-opacity);
	--code-hover: var(--ot-bg-4);
	--code-text: var(--ot-text-1);
	--code-muted: var(--ot-text-3);

	--code-keyword: #cf222e;
	--code-string: #0a3069;
	--code-number: #953800;
	--code-comment: #6e7781;
	--code-function: #8250df;
	--code-tag: #116329;
	--code-attribute: #0550ae;
}

/* Box */

.e-4a15b201 > .box
{
	display: flex;
	flex-direction: column;
	width: 100%;
	background: var(--code-background);
	border: 1px solid var(--code-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

.e-4a15b201 > .box.bg-1 { --code-background: var(--ot-bg-1); --code-border: var(--ot-bg-1-border); }
.e-4a15b201 > .box.bg-2 { --code-background: var(--ot-bg-2); --code-border: var(--ot-bg-2-border); }
.e-4a15b201 > .box.bg-3 { --code-background: var(--ot-bg-3); --code-border: var(--ot-bg-3-border); }
.e-4a15b201 > .box.bg-4 { --code-background: var(--ot-bg-4); --code-border: var(--ot-bg-4-border); }

/* Head */

.e-4a15b201 > .box > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: var(--code-overlay);
	border-bottom: 1px solid var(--code-border);
}

/* Dots */

.e-4a15b201 > .box > .head > .dots
{
	display: flex;
	gap: 6px;
	flex-shrink: 0;
}

.e-4a15b201 > .box > .head > .dots > span
{
	width: 11px;
	height: 11px;
	border-radius: 50%;
}

.e-4a15b201 > .box > .head > .dots > span:nth-child(1) { background: #ff5f56; }
.e-4a15b201 > .box > .head > .dots > span:nth-child(2) { background: #ffbd2e; }
.e-4a15b201 > .box > .head > .dots > span:nth-child(3) { background: #27c93f; }

/* Filename / Language */

.e-4a15b201 > .box > .head > .filename,
.e-4a15b201 > .box > .head > .language
{
	flex: 1;
	text-align: center;
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 12px;
	font-weight: 500;
	color: var(--code-muted);
}

.e-4a15b201 > .box > .head > .language
{
	text-transform: uppercase;
	font-size: 10.5px;
	letter-spacing: 0.06em;
}

/* Copy */

.e-4a15b201 > .box > .head > .copy
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	background: var(--ot-bg-3);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 600;
	cursor: pointer;
	flex-shrink: 0;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-4a15b201 > .box > .head > .copy:hover
{
	background: var(--code-hover);
	color: var(--code-text);
}

.e-4a15b201 > .box > .head > .copy > i
{
	font-size: 13px;
}

.e-4a15b201 > .box > .head > .copy.copied
{
	background: var(--ot-green-opacity);
	border-color: var(--ot-green-border);
	color: var(--ot-green);
}

/* Body */

.e-4a15b201 > .box > .body
{
	margin: 0;
	padding: var(--ot-spacing-m);
	overflow-x: auto;
	font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
	font-size: var(--ot-size-m);
	line-height: 1.65;
	color: var(--code-text);
	tab-size: 4;
}

.e-4a15b201 > .box > .body > code
{
	font-family: inherit;
	font-size: inherit;
	background: none;
	padding: 0;
	border: none;
	color: inherit;
	display: block;
	white-space: pre;
}

/* Scrollbar */

.e-4a15b201 > .box > .body::-webkit-scrollbar { height: 8px; }
.e-4a15b201 > .box > .body::-webkit-scrollbar-track { background: transparent; }
.e-4a15b201 > .box > .body::-webkit-scrollbar-thumb { background: var(--ot-bg-4); border-radius: 100px; }
.e-4a15b201 > .box > .body::-webkit-scrollbar-thumb:hover { background: var(--ot-bg-4-hover); }

/* ===== LINE NUMBERS ===== */

.e-4a15b201 .numbered
{
	display: flex;
	flex-direction: column;
}

.e-4a15b201 .line
{
	display: flex;
	padding: 0 var(--ot-spacing-m) 0 0;
	margin: 0 calc(var(--ot-spacing-m) * -1);
	transition: background var(--ot-transition-fast);
}

.e-4a15b201 .line > .number
{
	width: 40px;
	padding-right: 14px;
	text-align: right;
	color: var(--code-muted);
	user-select: none;
	flex-shrink: 0;
	border-right: 1px solid var(--code-border);
	margin-right: 14px;
}

.e-4a15b201 .line > .code
{
	flex: 1;
	min-width: 0;
}

/* Highlighted line */

.e-4a15b201 .line.highlighted
{
	background: var(--ot-brand-opacity);
	box-shadow: inset 2px 0 0 var(--ot-brand);
}

.e-4a15b201 .line.highlighted > .number
{
	color: var(--ot-brand);
}

/* Plain (no numbers) */

.e-4a15b201 .plain
{
	display: block;
	white-space: pre;
}

/* ===== SYNTAX TOKENS ===== */

.e-4a15b201 .t-keyword { color: var(--code-keyword); font-weight: 500; }
.e-4a15b201 .t-string { color: var(--code-string); }
.e-4a15b201 .t-number { color: var(--code-number); }
.e-4a15b201 .t-comment { color: var(--code-comment); font-style: italic; }
.e-4a15b201 .t-fn { color: var(--code-function); }
.e-4a15b201 .t-tag { color: var(--code-tag); }
.e-4a15b201 .t-attr { color: var(--code-attribute); }
.e-4a15b201 .t-selector { color: var(--code-tag); }
.e-4a15b201 .t-prop { color: var(--code-attribute); }

/* ===== BORDER ===== */

.e-4a15b201 > .box.border { border-color: var(--code-border); }

/* ===== SIZE ===== */

.e-4a15b201 > .box.size-s > .head
{
	padding: var(--ot-spacing-x) var(--ot-spacing-s);
}

.e-4a15b201 > .box.size-s > .body
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	font-size: 12px;
	line-height: 1.55;
}

.e-4a15b201 > .box.size-l > .head
{
	padding: var(--ot-spacing-m) var(--ot-spacing-l);
}

.e-4a15b201 > .box.size-l > .body
{
	padding: var(--ot-spacing-l);
	font-size: 14px;
	line-height: 1.75;
}
/* ===== GLOBAL GALLERY ===== */

.e-ee00abe
{
	display: block;
	width: 100%;
}

/* Box */

.e-ee00abe > .box
{
	position: relative;
	width: 100%;
	overflow: hidden;
}

.e-ee00abe > .box.rounded
{
	border-radius: var(--ot-radius-l);
}

/* ===== BENTO LAYOUT ===== */

.e-ee00abe > .box > .bento
{
	display: grid;
	grid-template-columns: 2fr 1fr;
	height: 480px;
	width: 100%;
}

.e-ee00abe > .box.compact > .bento
{
	height: 360px;
}

.e-ee00abe > .box.tall > .bento
{
	height: 560px;
}

/* Bento main */

.e-ee00abe > .box > .bento > .bento-main
{
	overflow: hidden;
	cursor: pointer;
}

.e-ee00abe > .box > .bento > .bento-main > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter var(--ot-transition-slow), transform var(--ot-transition-slow);
}

.e-ee00abe > .box > .bento > .bento-main:hover > img
{
	filter: brightness(0.92);
	transform: scale(1.02);
}

/* Bento side */

.e-ee00abe > .box > .bento > .bento-side
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
}

.e-ee00abe > .box > .bento > .bento-side > .bento-thumb
{
	overflow: hidden;
	cursor: pointer;
}

.e-ee00abe > .box > .bento > .bento-side > .bento-thumb > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter var(--ot-transition-slow), transform var(--ot-transition-slow);
}

.e-ee00abe > .box > .bento > .bento-side > .bento-thumb:hover > img
{
	filter: brightness(0.88);
	transform: scale(1.03);
}

/* Show all button */

.e-ee00abe > .box > .bento > .show-all
{
	position: absolute;
	bottom: 18px;
	right: 18px;
	display: inline-flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: 10px 20px;
	background: var(--ot-text-1);
	border: none;
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-bg-1);
	cursor: pointer;
	box-shadow: var(--ot-shadow-m);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
	z-index: 1;
}

.e-ee00abe > .box > .bento > .show-all:hover
{
	transform: translateY(-2px);
	box-shadow: var(--ot-shadow-l);
}

.e-ee00abe > .box > .bento > .show-all > i
{
	font-size: 16px;
}

/* ===== GRID LAYOUT ===== */

.e-ee00abe > .box > .grid
{
	display: grid;
	width: 100%;
}

.e-ee00abe > .box > .grid > .grid-item
{
	overflow: hidden;
	cursor: pointer;
	border-radius: var(--ot-radius-m);
}

.e-ee00abe > .box > .grid > .grid-item > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter var(--ot-transition-slow), transform var(--ot-transition-slow);
}

.e-ee00abe > .box > .grid > .grid-item:hover > img
{
	filter: brightness(0.92);
	transform: scale(1.04);
}

/* ===== CAROUSEL LAYOUT ===== */

.e-ee00abe > .box > .carousel
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	width: 100%;
}

/* Carousel stage */

.e-ee00abe > .box > .carousel > .carousel-stage
{
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-2);
}

.e-ee00abe > .box > .carousel > .carousel-stage > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: zoom-in;
	animation: e-ee00abe-fade var(--ot-transition-slow);
}

@keyframes e-ee00abe-fade
{
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Carousel nav */

.e-ee00abe > .box > .carousel > .carousel-stage > .carousel-nav
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--ot-bg-1-opacity);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	box-shadow: var(--ot-shadow-m);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
	z-index: 1;
}

.e-ee00abe > .box > .carousel > .carousel-stage > .prev { left: 16px; }
.e-ee00abe > .box > .carousel > .carousel-stage > .next { right: 16px; }

.e-ee00abe > .box > .carousel > .carousel-stage > .carousel-nav:hover
{
	box-shadow: var(--ot-shadow-l);
}

.e-ee00abe > .box > .carousel > .carousel-stage > .prev:hover { transform: translateY(-50%) translateX(-2px); }
.e-ee00abe > .box > .carousel > .carousel-stage > .next:hover { transform: translateY(-50%) translateX(2px); }

.e-ee00abe > .box > .carousel > .carousel-stage > .carousel-nav > i
{
	font-size: 22px;
}

/* Carousel counter */

.e-ee00abe > .box > .carousel > .carousel-stage > .carousel-counter
{
	position: absolute;
	bottom: 16px;
	right: 16px;
	padding: 6px 12px;
	background: var(--ot-bg-1-opacity);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	border-radius: 100px;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	letter-spacing: 0.04em;
}

/* Carousel thumbs */

.e-ee00abe > .box > .carousel > .carousel-thumbs
{
	display: flex;
	gap: var(--ot-spacing-x);
	overflow-x: auto;
	padding: 2px 0;
	scrollbar-width: none;
}

.e-ee00abe > .box > .carousel > .carousel-thumbs::-webkit-scrollbar
{
	display: none;
}

.e-ee00abe > .box > .carousel > .carousel-thumbs > .carousel-thumb
{
	flex-shrink: 0;
	width: 80px;
	height: 56px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: var(--ot-radius-s);
	background: transparent;
	overflow: hidden;
	cursor: pointer;
	transition: border-color var(--ot-transition), opacity var(--ot-transition);
	opacity: 0.65;
}

.e-ee00abe > .box > .carousel > .carousel-thumbs > .carousel-thumb:hover
{
	opacity: 1;
}

.e-ee00abe > .box > .carousel > .carousel-thumbs > .carousel-thumb.active
{
	opacity: 1;
	border-color: var(--ot-brand);
}

.e-ee00abe > .box > .carousel > .carousel-thumbs > .carousel-thumb > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ===== LIGHTBOX ===== */

.lightbox-box
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100vw;
	height: 100vh;
	padding: 80px 80px 140px;
	box-sizing: border-box;
}

/* Lightbox close */

.lightbox-close
{
	position: absolute;
	top: 20px;
	right: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
	z-index: 10;
}

.lightbox-close:hover
{
	background: rgba(255, 255, 255, 0.2);
	transform: rotate(90deg);
}

.lightbox-close > i
{
	font-size: 22px;
}

/* Lightbox counter */

.lightbox-counter
{
	position: absolute;
	top: 28px;
	left: 50%;
	transform: translateX(-50%);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 100px;
	color: #fff;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	letter-spacing: 0.04em;
	z-index: 10;
}

/* Lightbox nav */

.lightbox-nav
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: var(--ot-blur);
	-webkit-backdrop-filter: var(--ot-blur);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
	z-index: 10;
}

.lightbox-nav.prev { left: 32px; }
.lightbox-nav.next { right: 32px; }

.lightbox-nav:hover { background: rgba(255, 255, 255, 0.2); }
.lightbox-nav.prev:hover { transform: translateY(-50%) translateX(-3px); }
.lightbox-nav.next:hover { transform: translateY(-50%) translateX(3px); }

.lightbox-nav > i
{
	font-size: 26px;
}

/* Lightbox stage */

.lightbox-stage
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ot-spacing-m);
	max-width: 100%;
	max-height: 100%;
}

.lightbox-stage > img
{
	max-width: 100%;
	max-height: calc(100vh - 220px);
	object-fit: contain;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
	animation: e-ee00abe-lightbox-in var(--ot-transition-slow);
}

@keyframes e-ee00abe-lightbox-in
{
	from { opacity: 0; transform: scale(0.96); }
	to { opacity: 1; transform: scale(1); }
}

/* Lightbox caption */

.lightbox-caption
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	color: rgba(255, 255, 255, 0.85);
	text-align: center;
	max-width: 600px;
	line-height: 1.5;
}

/* Lightbox thumbs */

.lightbox-thumbs
{
	position: absolute;
	bottom: 28px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 6px;
	padding: 10px 14px;
	background: rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 14px;
	max-width: calc(100vw - 64px);
	overflow-x: auto;
	scrollbar-width: none;
	z-index: 10;
}

.lightbox-thumbs::-webkit-scrollbar
{
	display: none;
}

.lightbox-thumbs > .lightbox-thumb
{
	flex-shrink: 0;
	width: 56px;
	height: 44px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: var(--ot-radius-s);
	background: transparent;
	overflow: hidden;
	cursor: pointer;
	transition: border-color var(--ot-transition), opacity var(--ot-transition);
	opacity: 0.55;
}

.lightbox-thumbs > .lightbox-thumb:hover
{
	opacity: 0.9;
}

.lightbox-thumbs > .lightbox-thumb.active
{
	opacity: 1;
	border-color: #fff;
}

.lightbox-thumbs > .lightbox-thumb > img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 767.98px)
{
	.e-ee00abe > .box > .bento
	{
		height: 320px;
	}

	.e-ee00abe > .box > .bento > .bento-side
	{
		display: none;
	}

	.e-ee00abe > .box > .carousel > .carousel-thumbs > .carousel-thumb
	{
		width: 60px;
		height: 42px;
	}

	.lightbox-box
	{
		padding: 60px 16px 120px;
	}

	.lightbox-nav.prev { left: 12px; }
	.lightbox-nav.next { right: 12px; }

	.lightbox-nav
	{
		width: 40px;
		height: 40px;
	}

	.lightbox-nav > i
	{
		font-size: 20px;
	}
}
/* ===== GLOBAL HEADING ===== */

.e-49fb116e
{
	display: contents;
}

/* Box */

.e-49fb116e > .box
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-l);
	width: 100%;
}

.e-49fb116e > .box.border
{
	padding-bottom: var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* Top */

.e-49fb116e > .box > .top
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
}

/* Icon */

.e-49fb116e > .box > .top > .icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-49fb116e > .box > .top > .icon > i
{
	font-size: 26px;
}

/* Text */

.e-49fb116e > .box > .top > .text
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	min-width: 0;
	flex: 1;
}

/* Eyebrow */

.e-49fb116e > .box > .top > .text > .eyebrow
{
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ot-brand);
}

/* Title */

.e-49fb116e > .box > .top > .text > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	letter-spacing: -0.022em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.05;
}

.e-49fb116e > .box > .top > .text > .title em
{
	font-style: italic;
	color: var(--ot-brand);
	font-weight: 500;
}

/* Description */

.e-49fb116e > .box > .top > .text > .description
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	line-height: 1.55;
	color: var(--ot-text-2);
	max-width: 560px;
}

/* Right */

.e-49fb116e > .box > .top > .right
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
}

.e-49fb116e > .box > .top > .right:empty
{
	display: none;
}

/* Bottom */

.e-49fb116e > .box > .bottom
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-wrap: wrap;
}

/* ===== ALIGN ===== */

.e-49fb116e > .box.center > .top
{
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.e-49fb116e > .box.center > .top > .text
{
	align-items: center;
	flex: 0 1 auto;
}

.e-49fb116e > .box.center > .top > .text > .description
{
	max-width: 540px;
}

.e-49fb116e > .box.center > .bottom
{
	justify-content: center;
}

.e-49fb116e > .box.right > .top
{
	flex-direction: row-reverse;
	text-align: right;
}

.e-49fb116e > .box.right > .top > .text
{
	align-items: flex-end;
}

.e-49fb116e > .box.right > .bottom
{
	justify-content: flex-end;
}

/* ===== SIZE ===== */

/* Small */

.e-49fb116e > .box.size-s > .top > .icon
{
	width: 36px;
	height: 36px;
}

.e-49fb116e > .box.size-s > .top > .icon > i
{
	font-size: 20px;
}

.e-49fb116e > .box.size-s > .top > .text > .title
{
	font-size: var(--ot-size-l);
	line-height: 1.15;
}

.e-49fb116e > .box.size-s > .top > .text > .description
{
	font-size: var(--ot-size-m);
}

/* Medium */

.e-49fb116e > .box.size-m > .top > .text > .title
{
	font-size: 32px;
	line-height: 1.05;
}

.e-49fb116e > .box.size-m > .top > .text > .description
{
	font-size: 14px;
}

/* Large */

.e-49fb116e > .box.size-l > .top > .icon
{
	width: 60px;
	height: 60px;
}

.e-49fb116e > .box.size-l > .top > .icon > i
{
	font-size: 32px;
}

.e-49fb116e > .box.size-l > .top > .text > .title
{
	font-size: 48px;
	line-height: 1;
}

.e-49fb116e > .box.size-l > .top > .text > .description
{
	font-size: 16px;
	max-width: 640px;
}
/* ===== GLOBAL MARKDOWN ===== */

.e-4696d703
{
	display: contents;
}

/* Box */

.e-4696d703 > .box
{
	position: relative;
	width: 100%;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

/* Body */

.e-4696d703 > .box > .body
{
	overflow: hidden;
	transition: max-height var(--ot-transition-slow);
}

.e-4696d703 > .box.expanded > .body
{
	max-height: none !important;
}

/* Prose */

.e-4696d703 .prose
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	line-height: 1.75;
	color: var(--ot-text-1);
}

.e-4696d703 .prose > .segment + .segment
{
	margin-top: 1.5em;
}

.e-4696d703 .prose > .segment:first-child .line:first-child > *,
.e-4696d703 .prose > .segment:first-child > *:first-child,
.e-4696d703 .prose > *:first-child
{
	margin-top: 0;
	padding-top: 0;
}

.e-4696d703 .prose > .segment:last-child .line:last-child > *,
.e-4696d703 .prose > .segment:last-child > *:last-child,
.e-4696d703 .prose > *:last-child
{
	margin-bottom: 0;
	padding-bottom: 0;
}

/* ===== HEADINGS ===== */

.e-4696d703 .prose :is(h1, h2, h3, h4, h5, h6)
{
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.15;
}

.e-4696d703 .prose h1 { font-size: 2.25em; margin: 0 0 0.9em; }
.e-4696d703 .prose h2 { font-size: 1.5em; margin: 1em 0 0.75em; }
.e-4696d703 .prose h3 { font-size: 1.25em; margin: 1.6em 0 0.6em; }
.e-4696d703 .prose h4 { font-size: 1.1em; margin: 1.5em 0 0.5em; }

.e-4696d703 .prose :is(h1, h2, h3, h4) + :is(h1, h2, h3, h4)
{
	margin-top: 0;
}

/* ===== INLINE ===== */

.e-4696d703 .prose em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-4696d703 .prose strong
{
	font-weight: 700;
	color: var(--ot-text-1);
}

.e-4696d703 .prose del
{
	text-decoration: line-through;
	opacity: 0.6;
}

/* ===== PARAGRAPH ===== */

.e-4696d703 .prose p
{
	margin: 0 0 1.25em;
	color: var(--ot-text-2);
	line-height: 1.75;
}

.e-4696d703 .prose > p:first-child
{
	color: var(--ot-text-1);
}

/* ===== LINKS ===== */

.e-4696d703 .prose a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-decoration-color: var(--ot-brand-opacity);
	text-underline-offset: 3px;
	transition: text-decoration-color var(--ot-transition);
}

.e-4696d703 .prose a:hover
{
	text-decoration-color: var(--ot-brand);
}

/* ===== LISTS ===== */

.e-4696d703 .prose :is(ul, ol)
{
	margin: 0 0 1.25em;
	padding-left: 1.6em;
}

.e-4696d703 .prose ul { list-style: disc; }
.e-4696d703 .prose ol { list-style: decimal; }

.e-4696d703 .prose li
{
	margin: 0 0 0.5em;
	color: var(--ot-text-2);
	line-height: 1.7;
}

.e-4696d703 .prose li::marker
{
	color: var(--ot-brand);
}

.e-4696d703 .prose li:last-child
{
	margin-bottom: 0;
}

/* ===== BLOCKQUOTE ===== */

.e-4696d703 .prose blockquote
{
	margin: 1.6em 0;
	padding: 0.25em 0 0.25em 1.2em;
	border-left: 3px solid var(--ot-brand);
	font-family: var(--ot-font-secondary);
	font-size: 1.3em;
	font-style: italic;
	line-height: 1.45;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-4696d703 .prose blockquote p
{
	margin: 0;
	color: inherit;
}

/* ===== INLINE CODE ===== */

.e-4696d703 .prose code,
.e-4696d703 .prose code.inline
{
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 0.88em;
	padding: 0.15em 0.4em;
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-brand);
}

/* ===== IMAGES ===== */

.e-4696d703 .prose img
{
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--ot-radius-l);
	margin: 2em 0 0.5em;
}

.e-4696d703 .prose img + em
{
	display: block;
	font-size: 0.85em;
	font-style: italic;
	color: var(--ot-text-3);
	text-align: center;
	margin-bottom: 2em;
}

/* ===== HR ===== */

.e-4696d703 .prose hr
{
	border: none;
	height: 1px;
	background: var(--ot-bg-2-border);
	margin: 3em 0;
}

/* ===== TABLE ===== */

.e-4696d703 .prose table
{
	margin: 1.5em 0;
	width: 100%;
	border-collapse: collapse;
}

.e-4696d703 .prose th
{
	font-size: 0.85em;
	font-weight: 600;
	text-align: left;
	padding: 0.6em 1em;
	border-bottom: 2px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
}

.e-4696d703 .prose td
{
	font-size: 0.9em;
	padding: 0.6em 1em;
	border-bottom: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-2);
}

.e-4696d703 .prose tr:last-child td
{
	border-bottom: none;
}

/* ===== LINE WRAPPER ===== */

.e-4696d703 .prose > .line:empty
{
	height: var(--ot-spacing-m);
}

.e-4696d703 .prose > .line:first-child > *
{
	margin-top: 0;
	padding-top: 0;
}

.e-4696d703 .prose > .line:last-child > *
{
	margin-bottom: 0;
	padding-bottom: 0;
}

/* ===== COLLAPSIBLE ===== */

.e-4696d703 > .box.collapsible:not(.expanded) > .fade
{
	position: absolute;
	bottom: 44px;
	left: 0;
	right: 0;
	height: 80px;
	background: linear-gradient(180deg, transparent 0%, var(--ot-bg-1) 100%);
	pointer-events: none;
}

.e-4696d703 > .box.collapsible > .toggle
{
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-x);
	width: 100%;
	margin-top: var(--ot-spacing-m);
	padding-top: var(--ot-spacing-m);
	background: transparent;
	border: none;
	border-top: 1px solid var(--ot-bg-1-border);
	color: var(--ot-brand);
	font-size: var(--ot-size-s);
	font-weight: 600;
	font-family: var(--ot-font-primary);
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-4696d703 > .box.collapsible > .toggle:hover
{
	color: var(--ot-brand-hover);
}

.e-4696d703 > .box.collapsible > .toggle > i
{
	font-size: 18px;
}

/* ===== BACKGROUND ===== */

.e-4696d703 > .box.bg-1 { background: var(--ot-bg-1); padding: var(--ot-spacing-l); }
.e-4696d703 > .box.bg-2 { background: var(--ot-bg-2); padding: var(--ot-spacing-l); }
.e-4696d703 > .box.bg-3 { background: var(--ot-bg-3); padding: var(--ot-spacing-l); }
.e-4696d703 > .box.bg-4 { background: var(--ot-bg-4); padding: var(--ot-spacing-l); }

.e-4696d703 > .box.bg-1.collapsible:not(.expanded) > .fade { background: linear-gradient(180deg, transparent 0%, var(--ot-bg-1) 100%); }
.e-4696d703 > .box.bg-2.collapsible:not(.expanded) > .fade { background: linear-gradient(180deg, transparent 0%, var(--ot-bg-2) 100%); }
.e-4696d703 > .box.bg-3.collapsible:not(.expanded) > .fade { background: linear-gradient(180deg, transparent 0%, var(--ot-bg-3) 100%); }
.e-4696d703 > .box.bg-4.collapsible:not(.expanded) > .fade { background: linear-gradient(180deg, transparent 0%, var(--ot-bg-4) 100%); }

.e-4696d703 > .box.bg-1.collapsible > .toggle { border-top-color: var(--ot-bg-1-border); }
.e-4696d703 > .box.bg-2.collapsible > .toggle { border-top-color: var(--ot-bg-2-border); }
.e-4696d703 > .box.bg-3.collapsible > .toggle { border-top-color: var(--ot-bg-3-border); }
.e-4696d703 > .box.bg-4.collapsible > .toggle { border-top-color: var(--ot-bg-4-border); }

/* ===== BORDER ===== */

.e-4696d703 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-4696d703 > .box.bg-1.border { border-color: var(--ot-bg-1-border); }
.e-4696d703 > .box.bg-2.border { border-color: var(--ot-bg-2-border); }
.e-4696d703 > .box.bg-3.border { border-color: var(--ot-bg-3-border); }
.e-4696d703 > .box.bg-4.border { border-color: var(--ot-bg-4-border); }
/* ===== GLOBAL MENU ===== */

.e-4a1a1973
{
	display: contents;
}

/* Box */

.e-4a1a1973 > .box
{
	display: flex;
	flex-direction: column;
	min-width: 180px;
	padding: var(--ot-spacing-x);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--ot-shadow-m);
	overflow: hidden;
}

/* Option */

.e-4a1a1973 > .box > .entry > .option
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition-fast), color var(--ot-transition-fast);
}

.e-4a1a1973 > .box > .entry > .option > .icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition-fast);
}

.e-4a1a1973 > .box > .entry > .option > .label
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-4a1a1973 > .box > .entry > .option:hover
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-4a1a1973 > .box > .entry > .option:hover > .icon
{
	color: var(--ot-brand);
}

/* Danger */

.e-4a1a1973 > .box > .entry > .option.danger
{
	color: var(--ot-red);
}

.e-4a1a1973 > .box > .entry > .option.danger > .icon
{
	color: var(--ot-red);
}

.e-4a1a1973 > .box > .entry > .option.danger:hover
{
	background: var(--ot-red-opacity);
	color: var(--ot-red);
}

/* Separator */

.e-4a1a1973 > .box > .entry > .separator
{
	height: 1px;
	margin: var(--ot-spacing-x) 0;
	background: var(--ot-bg-2-border);
}

/* Entry wrapper */

.e-4a1a1973 > .box > .entry
{
	display: contents;
}
/* ===== GLOBAL NOTICE ===== */

.e-2e3de5ec
{
	display: contents;
}

/* Box */

.e-2e3de5ec > .box
{
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	width: 100%;
	padding: var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	font-family: var(--ot-font-primary);
	transition: opacity var(--ot-transition), transform var(--ot-transition);
}

/* Icon */

.e-2e3de5ec > .box > .icon
{
	flex-shrink: 0;
	font-size: 20px;
	line-height: 1.3;
	font-variation-settings: 'FILL' 1;
}

/* Body */

.e-2e3de5ec > .box > .body
{
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-2e3de5ec > .box > .body > .title
{
	font-size: var(--ot-size-m);
	font-weight: 600;
	line-height: 1.3;
}

.e-2e3de5ec > .box > .body > .text
{
	font-size: 12.5px;
	line-height: 1.5;
	opacity: 0.85;
}

/* Actions */

.e-2e3de5ec > .box > .actions
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
}

.e-2e3de5ec > .box > .actions:empty
{
	display: none;
}

/* Close */

.e-2e3de5ec > .box > .close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: var(--ot-radius-s);
	color: currentColor;
	cursor: pointer;
	flex-shrink: 0;
	opacity: 0.6;
	transition: background var(--ot-transition), opacity var(--ot-transition);
}

.e-2e3de5ec > .box > .close:hover
{
	opacity: 1;
	background: rgba(255, 255, 255, 0.1);
}

.e-2e3de5ec > .box > .close > i
{
	font-size: 18px;
}

/* ===== TONE: SOFT (opacity background) ===== */

.e-2e3de5ec > .box.soft.brand  { background: var(--ot-brand-opacity);  border-color: var(--ot-brand-border);  color: var(--ot-brand); }
.e-2e3de5ec > .box.soft.blue   { background: var(--ot-blue-opacity);   border-color: var(--ot-blue-border);   color: var(--ot-blue); }
.e-2e3de5ec > .box.soft.red    { background: var(--ot-red-opacity);    border-color: var(--ot-red-border);    color: var(--ot-red); }
.e-2e3de5ec > .box.soft.orange { background: var(--ot-orange-opacity); border-color: var(--ot-orange-border); color: var(--ot-orange); }
.e-2e3de5ec > .box.soft.green  { background: var(--ot-green-opacity);  border-color: var(--ot-green-border);  color: var(--ot-green); }

.e-2e3de5ec > .box.soft > .body > .title { color: inherit; }
.e-2e3de5ec > .box.soft > .body > .text  { color: var(--ot-text-1); }

/* ===== TONE: FILLED (solid background) ===== */

.e-2e3de5ec > .box.filled.brand  { background: var(--ot-brand);  border-color: var(--ot-brand);  color: #fff; }
.e-2e3de5ec > .box.filled.blue   { background: var(--ot-blue);   border-color: var(--ot-blue);   color: #fff; }
.e-2e3de5ec > .box.filled.red    { background: var(--ot-red);    border-color: var(--ot-red);    color: #fff; }
.e-2e3de5ec > .box.filled.orange { background: var(--ot-orange); border-color: var(--ot-orange); color: #fff; }
.e-2e3de5ec > .box.filled.green  { background: var(--ot-green);  border-color: var(--ot-green);  color: #fff; }

.e-2e3de5ec > .box.filled > .body > .title { color: #fff; }
.e-2e3de5ec > .box.filled > .body > .text  { color: #fff; opacity: 0.9; }

/* ===== TONE: ACCENT (left border bar) ===== */

.e-2e3de5ec > .box.accent
{
	border-left-width: 3px;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.e-2e3de5ec > .box.accent.brand  { background: var(--ot-brand-opacity);  border-color: transparent; border-left-color: var(--ot-brand);  color: var(--ot-brand); }
.e-2e3de5ec > .box.accent.blue   { background: var(--ot-blue-opacity);   border-color: transparent; border-left-color: var(--ot-blue);   color: var(--ot-blue); }
.e-2e3de5ec > .box.accent.red    { background: var(--ot-red-opacity);    border-color: transparent; border-left-color: var(--ot-red);    color: var(--ot-red); }
.e-2e3de5ec > .box.accent.orange { background: var(--ot-orange-opacity); border-color: transparent; border-left-color: var(--ot-orange); color: var(--ot-orange); }
.e-2e3de5ec > .box.accent.green  { background: var(--ot-green-opacity);  border-color: transparent; border-left-color: var(--ot-green);  color: var(--ot-green); }

.e-2e3de5ec > .box.accent > .body > .title { color: inherit; }
.e-2e3de5ec > .box.accent > .body > .text  { color: var(--ot-text-1); }

/* ===== BACKGROUND (neutral) ===== */

.e-2e3de5ec > .box.bg-1 { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); color: var(--ot-text-2); }
.e-2e3de5ec > .box.bg-2 { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); color: var(--ot-text-2); }
.e-2e3de5ec > .box.bg-3 { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); color: var(--ot-text-2); }
.e-2e3de5ec > .box.bg-4 { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); color: var(--ot-text-2); }

.e-2e3de5ec > .box.bg-1 > .body > .title,
.e-2e3de5ec > .box.bg-2 > .body > .title,
.e-2e3de5ec > .box.bg-3 > .body > .title,
.e-2e3de5ec > .box.bg-4 > .body > .title
{
	color: var(--ot-text-1);
}

/* ===== SIZE ===== */

.e-2e3de5ec > .box.size-s
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	gap: var(--ot-spacing-s);
}

.e-2e3de5ec > .box.size-s > .icon
{
	font-size: 17px;
}

.e-2e3de5ec > .box.size-s > .body > .title
{
	font-size: 12px;
}

.e-2e3de5ec > .box.size-s > .body > .text
{
	font-size: var(--ot-size-s);
}

.e-2e3de5ec > .box.size-s > .close
{
	width: 24px;
	height: 24px;
}

.e-2e3de5ec > .box.size-s > .close > i
{
	font-size: 15px;
}

.e-2e3de5ec > .box.size-l
{
	padding: var(--ot-spacing-l);
	gap: var(--ot-spacing-m);
}

.e-2e3de5ec > .box.size-l > .icon
{
	font-size: 24px;
}

.e-2e3de5ec > .box.size-l > .body > .title
{
	font-size: 15px;
}

.e-2e3de5ec > .box.size-l > .body > .text
{
	font-size: 13.5px;
}

.e-2e3de5ec > .box.size-l > .close
{
	width: 32px;
	height: 32px;
}

.e-2e3de5ec > .box.size-l > .close > i
{
	font-size: 20px;
}
/* ===== NAVIGATION DOCK ===== */

.e-1a845976
{
	display: contents;
}

/* Box */

.e-1a845976 > .box
{
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-shrink: 0;
	width: 68px;
	height: 100%;
	padding: var(--ot-spacing-s) 0;
	overflow: hidden;
}

/* Logo */

.e-1a845976 > .box > .logo
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	margin-bottom: var(--ot-spacing-s);
	transition: transform var(--ot-transition);
}

.e-1a845976 > .box > .logo:hover
{
	transform: scale(1.06);
}

.e-1a845976 > .box > .logo > img
{
	width: 22px;
	height: 22px;
	object-fit: contain;
}

/* Stack */

.e-1a845976 > .box > .stack
{
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-shrink: 0;
	width: 100%;
}

.e-1a845976 > .box > .stack.bottom
{
	margin-top: auto;
}

/* Separator */

.e-1a845976 .separator
{
	width: 32px;
	height: 1px;
	background: var(--ot-bg-2-border);
	margin: var(--ot-spacing-s) auto;
	flex-shrink: 0;
}

/* Group */

.e-1a845976 .group
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ot-spacing-x);
	flex-shrink: 0;
}

/* Item */

.e-1a845976 .item
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-2);
	text-decoration: none;
	transition: background var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-1a845976 .item:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-1a845976 .item:active
{
	transform: scale(0.94);
	transition-duration: 100ms;
}

.e-1a845976 .item > i
{
	font-size: 20px;
	font-variation-settings: 'wght' 400;
}

/* Active */

.e-1a845976 .item.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-1a845976 .item.active > i
{
	font-variation-settings: 'wght' 500;
}

.e-1a845976 .item.active::before
{
	content: '';
	position: absolute;
	left: calc(var(--ot-spacing-s) * -1);
	top: 50%;
	width: 3px;
	height: 50%;
	border-radius: 0 3px 3px 0;
	background: var(--ot-brand);
	transform: translateY(-50%);
}

/* Badge */

.e-1a845976 .item > .badge
{
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 100px;
	background: var(--ot-brand);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	font-family: var(--ot-font-primary);
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--ot-bg-2);
}

/* ===== BACKGROUND ===== */

.e-1a845976 > .box.bg-1 { background: var(--ot-bg-1); }
.e-1a845976 > .box.bg-1 .item:hover { background: var(--ot-bg-1-hover); }
.e-1a845976 > .box.bg-1 .separator { background: var(--ot-bg-1-border); }
.e-1a845976 > .box.bg-1 .item > .badge { border-color: var(--ot-bg-1); }

.e-1a845976 > .box.bg-2 { background: var(--ot-bg-2); }
.e-1a845976 > .box.bg-2 .item:hover { background: var(--ot-bg-2-hover); }
.e-1a845976 > .box.bg-2 .separator { background: var(--ot-bg-2-border); }
.e-1a845976 > .box.bg-2 .item > .badge { border-color: var(--ot-bg-2); }

.e-1a845976 > .box.bg-3 { background: var(--ot-bg-3); }
.e-1a845976 > .box.bg-3 .item:hover { background: var(--ot-bg-3-hover); }
.e-1a845976 > .box.bg-3 .separator { background: var(--ot-bg-3-border); }
.e-1a845976 > .box.bg-3 .item > .badge { border-color: var(--ot-bg-3); }

.e-1a845976 > .box.bg-4 { background: var(--ot-bg-4); }
.e-1a845976 > .box.bg-4 .item:hover { background: var(--ot-bg-4-hover); }
.e-1a845976 > .box.bg-4 .separator { background: var(--ot-bg-4-border); }
.e-1a845976 > .box.bg-4 .item > .badge { border-color: var(--ot-bg-4); }

/* ===== BORDER ===== */

.e-1a845976 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-1a845976 > .box.border-top { border-top: 1px solid var(--ot-bg-2-border); }
.e-1a845976 > .box.border-right { border-right: 1px solid var(--ot-bg-2-border); }
.e-1a845976 > .box.border-bottom { border-bottom: 1px solid var(--ot-bg-2-border); }
.e-1a845976 > .box.border-left { border-left: 1px solid var(--ot-bg-2-border); }

.e-1a845976 > .box.bg-1.border,
.e-1a845976 > .box.bg-1.border-top,
.e-1a845976 > .box.bg-1.border-right,
.e-1a845976 > .box.bg-1.border-bottom,
.e-1a845976 > .box.bg-1.border-left { border-color: var(--ot-bg-1-border); }

.e-1a845976 > .box.bg-2.border,
.e-1a845976 > .box.bg-2.border-top,
.e-1a845976 > .box.bg-2.border-right,
.e-1a845976 > .box.bg-2.border-bottom,
.e-1a845976 > .box.bg-2.border-left { border-color: var(--ot-bg-2-border); }

.e-1a845976 > .box.bg-3.border,
.e-1a845976 > .box.bg-3.border-top,
.e-1a845976 > .box.bg-3.border-right,
.e-1a845976 > .box.bg-3.border-bottom,
.e-1a845976 > .box.bg-3.border-left { border-color: var(--ot-bg-3-border); }

.e-1a845976 > .box.bg-4.border,
.e-1a845976 > .box.bg-4.border-top,
.e-1a845976 > .box.bg-4.border-right,
.e-1a845976 > .box.bg-4.border-bottom,
.e-1a845976 > .box.bg-4.border-left { border-color: var(--ot-bg-4-border); }
/* ===== NAVIGATION SIDEBAR ===== */

/* Root */

.e-210c16c7
{
	display: flex;
	flex-shrink: 0;
	height: 100%;
}

/* Box */

.e-210c16c7 > .box
{
	display: flex;
	flex-direction: column;
	width: 260px;
	height: 100%;
	overflow-y: auto;
}

/* ===== HEAD ===== */

.e-210c16c7 > .box > .head
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	flex-shrink: 0;
	padding: var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-210c16c7 > .box > .head > .title
{
	font-family: var(--ot-font-secondary);
	font-size: var(--ot-size-l);
	font-weight: 500;
	letter-spacing: -0.018em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.1;
}

.e-210c16c7 > .box > .head > .subtitle
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	font-family: var(--ot-font-primary);
	line-height: 1.4;
}

.e-210c16c7 > .box > .head > .version
{
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	padding: 3px 9px;
	margin-top: var(--ot-spacing-x);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	font-family: var(--ot-font-primary);
}

/* ===== STACK ===== */

.e-210c16c7 > .box > .stack
{
	display: flex;
	flex-direction: column;
	padding: var(--ot-spacing-s);
	gap: var(--ot-spacing-x);
}

.e-210c16c7 > .box > .stack.bottom
{
	margin-top: auto;
	border-top: 1px solid var(--ot-bg-2-border);
}

/* ===== GROUP ===== */

.e-210c16c7 .group
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-210c16c7 .group + .group
{
	margin-top: var(--ot-spacing-s);
}

.e-210c16c7 .group-title
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ot-text-3);
	padding: var(--ot-spacing-s) var(--ot-spacing-s) var(--ot-spacing-x);
	font-family: var(--ot-font-primary);
}

/* ===== ITEM ===== */

.e-210c16c7 .item
{
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	height: var(--ot-height-m);
	padding: 0 var(--ot-spacing-s);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-2);
	font-size: 12px;
	font-weight: 500;
	text-decoration: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-210c16c7 .item.child
{
	margin-left: calc(var(--depth) * 13px + var(--ot-spacing-s));
}

.e-210c16c7 .item.child::before
{
	content: '';
	position: absolute;
	left: calc(var(--ot-spacing-s) * -1);
	top: 0;
	bottom: 0;
	border-left: 1px solid var(--ot-bg-2-border);
}

.e-210c16c7 .item > i
{
	color: var(--ot-text-2);
	font-size: 16px;
	flex-shrink: 0;
	transition: color var(--ot-transition);
}

.e-210c16c7 .item > .label
{
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-210c16c7 .item > .chevron
{
	opacity: 0;
	font-size: 16px;
	transform: translateX(-4px);
	transition: opacity var(--ot-transition), transform var(--ot-transition);
	margin-left: auto;
}

.e-210c16c7 .item:hover
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-210c16c7 .item:hover > i
{
	color: var(--ot-text-1);
}

.e-210c16c7 .item:hover > .chevron
{
	opacity: 1;
	transform: translateX(0);
}

/* Active */

.e-210c16c7 .item.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-210c16c7 .item.active > i
{
	color: var(--ot-brand);
	font-variation-settings: 'FILL' 0, 'wght' 500;
}

.e-210c16c7 .item.active > .chevron
{
	opacity: 1;
	transform: translateX(0);
	color: var(--ot-brand);
}

.e-210c16c7 .item.active::after
{
	content: '';
	position: absolute;
	left: calc(var(--ot-spacing-s) * -1);
	top: 50%;
	width: 3px;
	height: 50%;
	border-radius: 0 3px 3px 0;
	background: var(--ot-brand);
	transform: translateY(-50%);
}


/* ===== BADGE ===== */

.e-210c16c7 .item > .badge
{
	min-width: 20px;
	height: 20px;
	padding: 0 7px;
	background: var(--ot-brand);
	color: white;
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ot-font-primary);
	line-height: 1;
	margin-left: auto;
}

/* Count */

.e-210c16c7 .item > .count
{
	min-width: 20px;
	height: 20px;
	padding: 0 7px;
	background: var(--ot-bg-3);
	color: var(--ot-text-2);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ot-font-primary);
	line-height: 1;
	margin-left: auto;
}

.e-210c16c7 .item.active > .count
{
	background: var(--ot-brand);
	color: white;
}

/* Soon badge */

.e-210c16c7 .item > .soon-badge
{
	font-size: 9.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 3px 7px;
	background: var(--ot-bg-3);
	color: var(--ot-text-3);
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	margin-left: auto;
}

/* Soon / Disabled */

.e-210c16c7 .item.soon,
.e-210c16c7 .item.disabled
{
	cursor: not-allowed;
	opacity: 0.55;
}

.e-210c16c7 .item.soon:hover,
.e-210c16c7 .item.disabled:hover
{
	background: transparent;
	color: var(--ot-text-2);
}

.e-210c16c7 .item.soon:hover > i,
.e-210c16c7 .item.disabled:hover > i
{
	color: var(--ot-text-3);
}

/* ===== FOOT ===== */

.e-210c16c7 > .box > .foot
{
	flex-shrink: 0;
	padding: var(--ot-spacing-m);
	border-top: 1px solid var(--ot-bg-2-border);
}

/* ===== BACKGROUND ===== */

.e-210c16c7 > .box.bg-1 { background: var(--ot-bg-1); }
.e-210c16c7 > .box.bg-1 > .head,
.e-210c16c7 > .box.bg-1 > .stack.bottom,
.e-210c16c7 > .box.bg-1 > .foot { border-color: var(--ot-bg-1-border); }
.e-210c16c7 > .box.bg-1 .item:hover { background: var(--ot-bg-1-hover); }
.e-210c16c7 > .box.bg-1 .item > .count { background: var(--ot-bg-2); }

.e-210c16c7 > .box.bg-2 { background: var(--ot-bg-2); }
.e-210c16c7 > .box.bg-2 > .head,
.e-210c16c7 > .box.bg-2 > .stack.bottom,
.e-210c16c7 > .box.bg-2 > .foot { border-color: var(--ot-bg-2-border); }
.e-210c16c7 > .box.bg-2 .item:hover { background: var(--ot-bg-2-hover); }
.e-210c16c7 > .box.bg-2 .item > .count { background: var(--ot-bg-3); }

.e-210c16c7 > .box.bg-3 { background: var(--ot-bg-3); }
.e-210c16c7 > .box.bg-3 > .head,
.e-210c16c7 > .box.bg-3 > .stack.bottom,
.e-210c16c7 > .box.bg-3 > .foot { border-color: var(--ot-bg-3-border); }
.e-210c16c7 > .box.bg-3 .item:hover { background: var(--ot-bg-3-hover); }
.e-210c16c7 > .box.bg-3 .item > .count { background: var(--ot-bg-4); }

.e-210c16c7 > .box.bg-4 { background: var(--ot-bg-4); }
.e-210c16c7 > .box.bg-4 > .head,
.e-210c16c7 > .box.bg-4 > .stack.bottom,
.e-210c16c7 > .box.bg-4 > .foot { border-color: var(--ot-bg-4-border); }
.e-210c16c7 > .box.bg-4 .item:hover { background: var(--ot-bg-4-hover); }
.e-210c16c7 > .box.bg-4 .item > .count { background: var(--ot-bg-3); }

/* ===== BORDER ===== */

.e-210c16c7 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-210c16c7 > .box.border-top { border-top: 1px solid var(--ot-bg-2-border); }
.e-210c16c7 > .box.border-right { border-right: 1px solid var(--ot-bg-2-border); }
.e-210c16c7 > .box.border-bottom { border-bottom: 1px solid var(--ot-bg-2-border); }
.e-210c16c7 > .box.border-left { border-left: 1px solid var(--ot-bg-2-border); }

.e-210c16c7 > .box.bg-1.border,
.e-210c16c7 > .box.bg-1.border-top,
.e-210c16c7 > .box.bg-1.border-right,
.e-210c16c7 > .box.bg-1.border-bottom,
.e-210c16c7 > .box.bg-1.border-left { border-color: var(--ot-bg-1-border); }

.e-210c16c7 > .box.bg-2.border,
.e-210c16c7 > .box.bg-2.border-top,
.e-210c16c7 > .box.bg-2.border-right,
.e-210c16c7 > .box.bg-2.border-bottom,
.e-210c16c7 > .box.bg-2.border-left { border-color: var(--ot-bg-2-border); }

.e-210c16c7 > .box.bg-3.border,
.e-210c16c7 > .box.bg-3.border-top,
.e-210c16c7 > .box.bg-3.border-right,
.e-210c16c7 > .box.bg-3.border-bottom,
.e-210c16c7 > .box.bg-3.border-left { border-color: var(--ot-bg-3-border); }

.e-210c16c7 > .box.bg-4.border,
.e-210c16c7 > .box.bg-4.border-top,
.e-210c16c7 > .box.bg-4.border-right,
.e-210c16c7 > .box.bg-4.border-bottom,
.e-210c16c7 > .box.bg-4.border-left { border-color: var(--ot-bg-4-border); }
/* ===== NAVIGATION STEPS ===== */

.e-36dc8444
{
	display: contents;
}

/* Box */

.e-36dc8444 > .box
{
	display: flex;
	width: 100%;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-36dc8444 > .box.vertical
{
	flex-direction: column;
}

.e-36dc8444 > .box.horizontal
{
	flex-direction: row;
	align-items: stretch;
}

/* Step */

.e-36dc8444 .step
{
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	background: transparent;
	border: none;
	text-align: left;
	font-family: var(--ot-font-primary);
	cursor: pointer;
	transition: background var(--ot-transition);
}

.e-36dc8444 > .box.vertical > .step
{
	width: 100%;
}

.e-36dc8444 > .box.horizontal > .step
{
	flex: 1;
	flex-direction: column;
	text-align: center;
	align-items: center;
}

.e-36dc8444 .step:hover:not(.disabled)
{
	background: var(--ot-bg-2-opacity);
}

/* Marker */

.e-36dc8444 .step > .marker
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-2);
	font-weight: 600;
	z-index: 1;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition), transform var(--ot-transition);
}

.e-36dc8444 .step > .marker > i
{
	font-variation-settings: 'wght' 500;
}

/* Text */

.e-36dc8444 .step > .text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.e-36dc8444 .step > .text > .label
{
	font-weight: 600;
	color: var(--ot-text-2);
	line-height: 1.3;
	transition: color var(--ot-transition);
}

.e-36dc8444 .step > .text > .description
{
	color: var(--ot-text-3);
	line-height: 1.4;
	font-weight: 400;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

/* ===== STATES ===== */

/* Done */

.e-36dc8444 .step.done > .marker
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-36dc8444 .step.done > .text > .label
{
	color: var(--ot-text-1);
}

/* Active */

.e-36dc8444 .step.active > .marker
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
	transform: scale(1.05);
	box-shadow: 0 0 0 4px var(--ot-brand-opacity);
}

.e-36dc8444 .step.active > .text > .label
{
	color: var(--ot-brand);
}

.e-36dc8444 .step.active > .text > .description
{
	color: var(--ot-text-2);
}

/* Disabled */

.e-36dc8444 .step.disabled
{
	cursor: not-allowed;
	opacity: 0.45;
}

.e-36dc8444 .step.disabled:hover
{
	background: transparent;
}

/* ===== CONNECTED ===== */

.e-36dc8444 > .box.vertical.connected > .step + .step::before
{
	content: '';
	position: absolute;
	width: 2px;
	background: var(--ot-bg-2-border);
	transition: background var(--ot-transition);
	z-index: 0;
}

.e-36dc8444 > .box.vertical.connected > .step.done + .step::before
{
	background: var(--ot-brand);
}

.e-36dc8444 > .box.horizontal.connected > .step + .step::before
{
	content: '';
	position: absolute;
	height: 2px;
	background: var(--ot-bg-2-border);
	transition: background var(--ot-transition);
	z-index: 0;
}

.e-36dc8444 > .box.horizontal.connected > .step.done + .step::before
{
	background: var(--ot-brand);
}

/* ===== CLEAN ===== */

.e-36dc8444 > .box.clean
{
	background: transparent !important;
	border: none !important;
	border-radius: 0;
}

/* ===== BACKGROUND ===== */

.e-36dc8444 > .box.bg-1 { background: var(--ot-bg-1); }
.e-36dc8444 > .box.bg-1 .step.upcoming > .marker { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-36dc8444 > .box.bg-1 .step:hover:not(.disabled) { background: var(--ot-bg-1-hover); }

.e-36dc8444 > .box.bg-2 { background: var(--ot-bg-2); }
.e-36dc8444 > .box.bg-2 .step.upcoming > .marker { background: var(--ot-bg-1); border-color: var(--ot-bg-2-border); }
.e-36dc8444 > .box.bg-2 .step:hover:not(.disabled) { background: var(--ot-bg-2-hover); }

.e-36dc8444 > .box.bg-3 { background: var(--ot-bg-3); }
.e-36dc8444 > .box.bg-3 .step.upcoming > .marker { background: var(--ot-bg-2); border-color: var(--ot-bg-3-border); }
.e-36dc8444 > .box.bg-3 .step:hover:not(.disabled) { background: var(--ot-bg-3-hover); }

.e-36dc8444 > .box.bg-4 { background: var(--ot-bg-4); }
.e-36dc8444 > .box.bg-4 .step.upcoming > .marker { background: var(--ot-bg-3); border-color: var(--ot-bg-4-border); }
.e-36dc8444 > .box.bg-4 .step:hover:not(.disabled) { background: var(--ot-bg-4-hover); }

/* ===== BORDER ===== */

.e-36dc8444 > .box.border { border: 1px solid var(--ot-bg-2-border); }
.e-36dc8444 > .box.border-top { border-top: 1px solid var(--ot-bg-2-border); }
.e-36dc8444 > .box.border-right { border-right: 1px solid var(--ot-bg-2-border); }
.e-36dc8444 > .box.border-bottom { border-bottom: 1px solid var(--ot-bg-2-border); }
.e-36dc8444 > .box.border-left { border-left: 1px solid var(--ot-bg-2-border); }

.e-36dc8444 > .box.bg-1.border,
.e-36dc8444 > .box.bg-1.border-top,
.e-36dc8444 > .box.bg-1.border-right,
.e-36dc8444 > .box.bg-1.border-bottom,
.e-36dc8444 > .box.bg-1.border-left { border-color: var(--ot-bg-1-border); }

.e-36dc8444 > .box.bg-2.border,
.e-36dc8444 > .box.bg-2.border-top,
.e-36dc8444 > .box.bg-2.border-right,
.e-36dc8444 > .box.bg-2.border-bottom,
.e-36dc8444 > .box.bg-2.border-left { border-color: var(--ot-bg-2-border); }

.e-36dc8444 > .box.bg-3.border,
.e-36dc8444 > .box.bg-3.border-top,
.e-36dc8444 > .box.bg-3.border-right,
.e-36dc8444 > .box.bg-3.border-bottom,
.e-36dc8444 > .box.bg-3.border-left { border-color: var(--ot-bg-3-border); }

.e-36dc8444 > .box.bg-4.border,
.e-36dc8444 > .box.bg-4.border-top,
.e-36dc8444 > .box.bg-4.border-right,
.e-36dc8444 > .box.bg-4.border-bottom,
.e-36dc8444 > .box.bg-4.border-left { border-color: var(--ot-bg-4-border); }

/* Connected line per background */

.e-36dc8444 > .box.bg-1.connected > .step + .step::before { background: var(--ot-bg-1-border); }
.e-36dc8444 > .box.bg-2.connected > .step + .step::before { background: var(--ot-bg-2-border); }
.e-36dc8444 > .box.bg-3.connected > .step + .step::before { background: var(--ot-bg-3-border); }
.e-36dc8444 > .box.bg-4.connected > .step + .step::before { background: var(--ot-bg-4-border); }

.e-36dc8444 > .box.bg-1.connected > .step.done + .step::before,
.e-36dc8444 > .box.bg-2.connected > .step.done + .step::before,
.e-36dc8444 > .box.bg-3.connected > .step.done + .step::before,
.e-36dc8444 > .box.bg-4.connected > .step.done + .step::before { background: var(--ot-brand); }

/* ===== SIZE — vertical ===== */

.e-36dc8444 > .box.vertical.size-s > .step { padding: var(--ot-spacing-s) var(--ot-spacing-m); gap: var(--ot-spacing-s); }
.e-36dc8444 > .box.vertical.size-s .step > .marker { width: 24px; height: 24px; font-size: 11px; }
.e-36dc8444 > .box.vertical.size-s .step > .marker > i { font-size: 15px; }
.e-36dc8444 > .box.vertical.size-s .step > .text > .label { font-size: 12px; }
.e-36dc8444 > .box.vertical.size-s .step > .text > .description { font-size: 10.5px; }
.e-36dc8444 > .box.vertical.size-s.connected > .step + .step::before
{
	left: calc(var(--ot-spacing-m) + 12px - 1px);
	top: calc(-1 * var(--ot-spacing-s));
	height: calc(var(--ot-spacing-s) * 2);
}

.e-36dc8444 > .box.vertical.size-m > .step { padding: var(--ot-spacing-m); gap: var(--ot-spacing-m); }
.e-36dc8444 > .box.vertical.size-m .step > .marker { width: 32px; height: 32px; font-size: 13px; }
.e-36dc8444 > .box.vertical.size-m .step > .marker > i { font-size: 18px; }
.e-36dc8444 > .box.vertical.size-m .step > .text > .label { font-size: 13px; }
.e-36dc8444 > .box.vertical.size-m .step > .text > .description { font-size: 11.5px; }
.e-36dc8444 > .box.vertical.size-m.connected > .step + .step::before
{
	left: calc(var(--ot-spacing-m) + 16px - 1px);
	top: calc(-1 * var(--ot-spacing-m));
	height: calc(var(--ot-spacing-m) * 2);
}

.e-36dc8444 > .box.vertical.size-l > .step { padding: var(--ot-spacing-l) var(--ot-spacing-m); gap: var(--ot-spacing-m); }
.e-36dc8444 > .box.vertical.size-l .step > .marker { width: 40px; height: 40px; font-size: 15px; }
.e-36dc8444 > .box.vertical.size-l .step > .marker > i { font-size: 20px; }
.e-36dc8444 > .box.vertical.size-l .step > .text > .label { font-size: 15px; }
.e-36dc8444 > .box.vertical.size-l .step > .text > .description { font-size: 13px; }
.e-36dc8444 > .box.vertical.size-l.connected > .step + .step::before
{
	left: calc(var(--ot-spacing-m) + 20px - 1px);
	top: calc(-1 * var(--ot-spacing-l));
	height: calc(var(--ot-spacing-l) * 2);
}

/* ===== SIZE — horizontal ===== */

.e-36dc8444 > .box.horizontal.size-s > .step { padding: var(--ot-spacing-s); gap: var(--ot-spacing-x); }
.e-36dc8444 > .box.horizontal.size-s .step > .marker { width: 24px; height: 24px; font-size: 11px; }
.e-36dc8444 > .box.horizontal.size-s .step > .marker > i { font-size: 15px; }
.e-36dc8444 > .box.horizontal.size-s .step > .text > .label { font-size: 12px; }
.e-36dc8444 > .box.horizontal.size-s .step > .text > .description { font-size: 10.5px; }
.e-36dc8444 > .box.horizontal.size-s.connected > .step + .step::before
{
	top: calc(var(--ot-spacing-s) + 12px - 1px);
	left: calc(-50% + 12px);
	width: calc(100% - 24px);
}

.e-36dc8444 > .box.horizontal.size-m > .step { padding: var(--ot-spacing-m); gap: var(--ot-spacing-s); }
.e-36dc8444 > .box.horizontal.size-m .step > .marker { width: 32px; height: 32px; font-size: 13px; }
.e-36dc8444 > .box.horizontal.size-m .step > .marker > i { font-size: 18px; }
.e-36dc8444 > .box.horizontal.size-m .step > .text > .label { font-size: 13px; }
.e-36dc8444 > .box.horizontal.size-m .step > .text > .description { font-size: 11.5px; }
.e-36dc8444 > .box.horizontal.size-m.connected > .step + .step::before
{
	top: calc(var(--ot-spacing-m) + 16px - 1px);
	left: calc(-50% + 16px);
	width: calc(100% - 32px);
}

.e-36dc8444 > .box.horizontal.size-l > .step { padding: var(--ot-spacing-l) var(--ot-spacing-m); gap: var(--ot-spacing-s); }
.e-36dc8444 > .box.horizontal.size-l .step > .marker { width: 40px; height: 40px; font-size: 15px; }
.e-36dc8444 > .box.horizontal.size-l .step > .marker > i { font-size: 20px; }
.e-36dc8444 > .box.horizontal.size-l .step > .text > .label { font-size: 15px; }
.e-36dc8444 > .box.horizontal.size-l .step > .text > .description { font-size: 13px; }
.e-36dc8444 > .box.horizontal.size-l.connected > .step + .step::before
{
	top: calc(var(--ot-spacing-l) + 20px - 1px);
	left: calc(-50% + 20px);
	width: calc(100% - 40px);
}
/* ===== NAVIGATION TABS ===== */

.e-1a8b6ac1
{
	display: contents;
}

/* Box */

.e-1a8b6ac1 > .box
{
	display: flex;
	flex-direction: column;
}

/* Tabs nav */

.e-1a8b6ac1 > .box > .tabs
{
	display: flex;
	align-items: center;
	overflow-x: auto;
	scrollbar-width: none;
	overflow: hidden;
}

.e-1a8b6ac1 > .box > .tabs::-webkit-scrollbar
{
	display: none;
}

/* Tab base */

.e-1a8b6ac1 .tab
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-s);
	white-space: nowrap;
	cursor: pointer;
	text-decoration: none;
	font-family: var(--ot-font-primary);
	font-weight: 500;
	color: var(--ot-text-2);
	user-select: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition);
}

.e-1a8b6ac1 .tab:hover:not(.disabled)
{
	color: var(--ot-text-1);
}

.e-1a8b6ac1 .tab.active
{
	color: var(--ot-text-1);
	font-weight: 600;
}

.e-1a8b6ac1 .tab.disabled
{
	cursor: not-allowed;
	opacity: 0.45;
}

/* Count badge */

.e-1a8b6ac1 .tab > .count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	padding: 0 6px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	line-height: 18px;
	font-family: var(--ot-font-primary);
}

.e-1a8b6ac1 .tab.active > .count
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

/* Content panels */

.e-1a8b6ac1 > .box > .body
{
	padding-top: var(--ot-spacing-l);
}

/* When a background or border is set, wrap the panel content in a card. */

.e-1a8b6ac1 > .box.border > .body,
.e-1a8b6ac1 > .box.bg-1 > .body,
.e-1a8b6ac1 > .box.bg-2 > .body,
.e-1a8b6ac1 > .box.bg-3 > .body,
.e-1a8b6ac1 > .box.bg-4 > .body
{
	margin-top: var(--ot-spacing-s);
	padding: var(--ot-spacing-m) var(--ot-spacing-l);
	border-radius: var(--ot-radius-l);
}

.e-1a8b6ac1 > .box.bg-1 > .body { background: var(--ot-bg-1); }
.e-1a8b6ac1 > .box.bg-2 > .body { background: var(--ot-bg-2); }
.e-1a8b6ac1 > .box.bg-3 > .body { background: var(--ot-bg-3); }
.e-1a8b6ac1 > .box.bg-4 > .body { background: var(--ot-bg-4); }

.e-1a8b6ac1 > .box.border > .body
{
	border: 1px solid var(--ot-bg-2-border);
}

.e-1a8b6ac1 > .box > .body .panel
{
	display: none;
}

.e-1a8b6ac1 > .box > .body .panel.active
{
	display: block;
	animation: e-1a8b6ac1-fade 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-1a8b6ac1-fade
{
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* ===== TONE: UNDERLINE ===== */

.e-1a8b6ac1 > .box.underline > .tabs
{
	gap: var(--ot-spacing-l);
}

.e-1a8b6ac1 > .box.underline > .tabs > .tab
{
	padding: 14px 0;
}

.e-1a8b6ac1 > .box.underline > .tabs > .tab.active::after
{
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--ot-brand);
	border-radius: 2px 2px 0 0;
}

/* ===== TONE: PILLS ===== */

.e-1a8b6ac1 > .box.pills > .tabs
{
	gap: var(--ot-spacing-s);
}

.e-1a8b6ac1 > .box.pills > .tabs > .tab
{
	padding: 8px 16px;
	border-radius: 100px;
	background: transparent;
	border: 1px solid transparent;
}

.e-1a8b6ac1 > .box.pills > .tabs > .tab:hover:not(.disabled)
{
	background: var(--ot-bg-2);
}

.e-1a8b6ac1 > .box.pills > .tabs > .tab.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-1a8b6ac1 > .box.pills > .tabs > .tab.active > .count
{
	background: var(--ot-brand);
	color: white;
}

/* ===== TONE: CONTAINED ===== */

.e-1a8b6ac1 > .box.contained > .tabs
{
	padding: var(--ot-spacing-x);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	gap: 2px;
}

.e-1a8b6ac1 > .box.contained > .tabs > .tab
{
	padding: 8px 14px;
	border-radius: calc(var(--ot-radius-m) - 2px);
}

.e-1a8b6ac1 > .box.contained > .tabs > .tab:hover:not(.disabled)
{
	background: var(--ot-bg-2-hover);
}

.e-1a8b6ac1 > .box.contained > .tabs > .tab.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-1a8b6ac1 > .box.contained > .tabs > .tab.active > .count
{
	background: var(--ot-brand);
	color: white;
}

/* ===== TONE: SEGMENTED ===== */

.e-1a8b6ac1 > .box.segmented > .tabs
{
	padding: 3px;
	background: var(--ot-bg-3);
	border-radius: 100px;
	gap: 0;
	display: inline-flex;
	align-self: flex-start;
}

.e-1a8b6ac1 > .box.segmented > .tabs > .tab
{
	padding: 8px 18px;
	border-radius: 100px;
	flex: 1;
}

.e-1a8b6ac1 > .box.border.segmented > .tabs { border: 1px solid var(--ot-bg-2-border); }
.e-1a8b6ac1 > .box.bg-1.border.segmented > .tabs { border-color: var(--ot-bg-1-border); }
.e-1a8b6ac1 > .box.bg-2.border.segmented > .tabs { border-color: var(--ot-bg-2-border); }
.e-1a8b6ac1 > .box.bg-3.border.segmented > .tabs { border-color: var(--ot-bg-3-border); }
.e-1a8b6ac1 > .box.bg-4.border.segmented > .tabs { border-color: var(--ot-bg-4-border); }

.e-1a8b6ac1 > .box.segmented > .tabs > .tab:hover:not(.disabled)
{
	color: var(--ot-text-1);
}

.e-1a8b6ac1 > .box.segmented > .tabs > .tab.active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-1a8b6ac1 > .box.segmented > .tabs > .tab.active > .count
{
	background: var(--ot-brand);
	color: white;
}

/* ===== BACKGROUND ===== */

/* underline / pills — bg on box */

.e-1a8b6ac1 > .box.bg-1.underline,
.e-1a8b6ac1 > .box.bg-1.pills { background: var(--ot-bg-1); padding: 0 var(--ot-spacing-m); }

.e-1a8b6ac1 > .box.bg-2.underline,
.e-1a8b6ac1 > .box.bg-2.pills { background: var(--ot-bg-2); padding: 0 var(--ot-spacing-m); }

.e-1a8b6ac1 > .box.bg-3.underline,
.e-1a8b6ac1 > .box.bg-3.pills { background: var(--ot-bg-3); padding: 0 var(--ot-spacing-m); }

.e-1a8b6ac1 > .box.bg-4.underline,
.e-1a8b6ac1 > .box.bg-4.pills { background: var(--ot-bg-4); padding: 0 var(--ot-spacing-m); }

/* contained — bg on track */

.e-1a8b6ac1 > .box.bg-1.contained > .tabs { background: var(--ot-bg-1); border-color: var(--ot-bg-1-border); }
.e-1a8b6ac1 > .box.bg-2.contained > .tabs { background: var(--ot-bg-2); border-color: var(--ot-bg-2-border); }
.e-1a8b6ac1 > .box.bg-3.contained > .tabs { background: var(--ot-bg-3); border-color: var(--ot-bg-3-border); }
.e-1a8b6ac1 > .box.bg-4.contained > .tabs { background: var(--ot-bg-4); border-color: var(--ot-bg-4-border); }

/* segmented — bg on track */

.e-1a8b6ac1 > .box.bg-1.segmented > .tabs { background: var(--ot-bg-1); }
.e-1a8b6ac1 > .box.bg-2.segmented > .tabs { background: var(--ot-bg-2); }
.e-1a8b6ac1 > .box.bg-3.segmented > .tabs { background: var(--ot-bg-3); }
.e-1a8b6ac1 > .box.bg-4.segmented > .tabs { background: var(--ot-bg-4); }

/* pills hover per bg */

.e-1a8b6ac1 > .box.bg-1.pills > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-1-hover); }
.e-1a8b6ac1 > .box.bg-2.pills > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-2-hover); }
.e-1a8b6ac1 > .box.bg-3.pills > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-3-hover); }
.e-1a8b6ac1 > .box.bg-4.pills > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-4-hover); }

/* contained hover per bg */

.e-1a8b6ac1 > .box.bg-1.contained > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-1-hover); }
.e-1a8b6ac1 > .box.bg-2.contained > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-2-hover); }
.e-1a8b6ac1 > .box.bg-3.contained > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-3-hover); }
.e-1a8b6ac1 > .box.bg-4.contained > .tabs > .tab:hover:not(.disabled) { background: var(--ot-bg-4-hover); }

/* count badge per bg */

.e-1a8b6ac1 > .box.bg-1 .tab > .count { background: var(--ot-bg-2); }
.e-1a8b6ac1 > .box.bg-2 .tab > .count { background: var(--ot-bg-3); }
.e-1a8b6ac1 > .box.bg-3 .tab > .count { background: var(--ot-bg-4); }
.e-1a8b6ac1 > .box.bg-4 .tab > .count { background: var(--ot-bg-3); }

/* ===== BORDER ===== */

.e-1a8b6ac1 > .box.border.underline,
.e-1a8b6ac1 > .box.border.pills { border-bottom: 1px solid var(--ot-bg-2-border); }

.e-1a8b6ac1 > .box.bg-1.border.underline,
.e-1a8b6ac1 > .box.bg-1.border.pills { border-bottom-color: var(--ot-bg-1-border); }

.e-1a8b6ac1 > .box.bg-2.border.underline,
.e-1a8b6ac1 > .box.bg-2.border.pills { border-bottom-color: var(--ot-bg-2-border); }

.e-1a8b6ac1 > .box.bg-3.border.underline,
.e-1a8b6ac1 > .box.bg-3.border.pills { border-bottom-color: var(--ot-bg-3-border); }

.e-1a8b6ac1 > .box.bg-4.border.underline,
.e-1a8b6ac1 > .box.bg-4.border.pills { border-bottom-color: var(--ot-bg-4-border); }

/* ===== STRETCH ===== */

.e-1a8b6ac1 > .box.stretch > .tabs
{
	width: 100%;
}

.e-1a8b6ac1 > .box.stretch.segmented > .tabs
{
	align-self: stretch;
}

.e-1a8b6ac1 > .box.stretch > .tabs > .tab
{
	flex: 1;
}

/* ===== SIZE: S ===== */

.e-1a8b6ac1 > .box.size-s .tab
{
	font-size: 12px;
}

.e-1a8b6ac1 > .box.size-s .tab > i
{
	font-size: 14px;
}

.e-1a8b6ac1 > .box.size-s .tab > .count
{
	min-width: 16px;
	font-size: 10px;
	line-height: 16px;
	padding: 0 5px;
}

.e-1a8b6ac1 > .box.size-s.underline > .tabs > .tab { padding: 10px 0; }
.e-1a8b6ac1 > .box.size-s.underline > .tabs { gap: var(--ot-spacing-m); }
.e-1a8b6ac1 > .box.size-s.pills > .tabs > .tab { padding: 6px 12px; }
.e-1a8b6ac1 > .box.size-s.contained > .tabs > .tab { padding: 6px 10px; }
.e-1a8b6ac1 > .box.size-s.segmented > .tabs > .tab { padding: 6px 14px; }

/* ===== SIZE: M ===== */

.e-1a8b6ac1 > .box.size-m .tab
{
	font-size: 13px;
}

.e-1a8b6ac1 > .box.size-m .tab > i
{
	font-size: 16px;
}

/* ===== SIZE: L ===== */

.e-1a8b6ac1 > .box.size-l .tab
{
	font-size: 14px;
}

.e-1a8b6ac1 > .box.size-l .tab > i
{
	font-size: 18px;
}

.e-1a8b6ac1 > .box.size-l .tab > .count
{
	min-width: 22px;
	font-size: 11.5px;
	line-height: 22px;
	padding: 0 8px;
}

.e-1a8b6ac1 > .box.size-l.underline > .tabs > .tab { padding: 18px 0; }
.e-1a8b6ac1 > .box.size-l.pills > .tabs > .tab { padding: 12px 22px; }
.e-1a8b6ac1 > .box.size-l.contained > .tabs > .tab { padding: 12px 18px; }
.e-1a8b6ac1 > .box.size-l.segmented > .tabs > .tab { padding: 12px 24px; }
/* ===== STATUS CODE ===== */

.e-471f3f12
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 320px;
	padding: var(--ot-spacing-l);
}

/* Box */

.e-471f3f12 > .box
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ot-spacing-m);
	text-align: center;
	max-width: 480px;
}

/* Code number */

.e-471f3f12 > .box > .code
{
	font-family: var(--ot-font-secondary);
	font-size: 140px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--ot-brand);
	background: linear-gradient(180deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	font-variation-settings: 'opsz' 144;
	user-select: none;
	margin-bottom: var(--ot-spacing-s);
}

/* Title */

.e-471f3f12 > .box > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	line-height: 1.15;
	font-variation-settings: 'opsz' 144;
}

/* Description */

.e-471f3f12 > .box > .description
{
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
}

/* ===== COLOR ===== */

.e-471f3f12 > .box.brand > .code  { background: linear-gradient(180deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);   -webkit-background-clip: text; background-clip: text; }
.e-471f3f12 > .box.blue > .code   { background: linear-gradient(180deg, var(--ot-blue) 0%, var(--ot-blue-hover) 100%);     -webkit-background-clip: text; background-clip: text; }
.e-471f3f12 > .box.red > .code    { background: linear-gradient(180deg, var(--ot-red) 0%, var(--ot-red-hover) 100%);       -webkit-background-clip: text; background-clip: text; }
.e-471f3f12 > .box.orange > .code { background: linear-gradient(180deg, var(--ot-orange) 0%, var(--ot-orange-hover) 100%); -webkit-background-clip: text; background-clip: text; }
.e-471f3f12 > .box.green > .code  { background: linear-gradient(180deg, var(--ot-green) 0%, var(--ot-green-hover) 100%);   -webkit-background-clip: text; background-clip: text; }

/* ===== SIZE ===== */

.e-471f3f12 > .box.size-s
{
	min-height: 240px;
	padding: var(--ot-spacing-m);
}

.e-471f3f12 > .box.size-s > .code        { font-size: 96px; }
.e-471f3f12 > .box.size-s > .title       { font-size: 20px; }
.e-471f3f12 > .box.size-s > .description { font-size: var(--ot-size-m); }

.e-471f3f12 > .box.size-m > .code  { font-size: 140px; }
.e-471f3f12 > .box.size-m > .title { font-size: 26px; }

.e-471f3f12 > .box.size-l
{
	min-height: 480px;
}

.e-471f3f12 > .box.size-l > .code        { font-size: 200px; letter-spacing: -0.05em; }
.e-471f3f12 > .box.size-l > .title       { font-size: 36px; }
.e-471f3f12 > .box.size-l > .description { font-size: 16px; max-width: 560px; }
/* ===== STATUS EMPTY ===== */

.e-631be738
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 320px;
	padding: var(--ot-spacing-l);
}

/* Box */

.e-631be738 > .box
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ot-spacing-m);
	text-align: center;
	max-width: 420px;
}

/* Circle */

.e-631be738 > .box > .circle
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	margin-bottom: var(--ot-spacing-s);
}

.e-631be738 > .box > .circle::before
{
	content: '';
	position: absolute;
	inset: -8px;
	border-radius: 50%;
	opacity: 0.6;
}

.e-631be738 > .box > .circle > i
{
	font-size: 32px;
	font-variation-settings: 'wght' 400;
}

/* Title */

.e-631be738 > .box > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	font-size: 22px;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	line-height: 1.2;
	font-variation-settings: 'opsz' 144;
}

/* Description */

.e-631be738 > .box > .description
{
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
}

/* ===== COLOR ===== */

.e-631be738 > .box.brand > .circle { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-631be738 > .box.brand > .circle::before { border: 1px dashed var(--ot-brand-opacity); }

.e-631be738 > .box.blue > .circle { background: var(--ot-blue-opacity); color: var(--ot-blue); }
.e-631be738 > .box.blue > .circle::before { border: 1px dashed var(--ot-blue-opacity); }

.e-631be738 > .box.red > .circle { background: var(--ot-red-opacity); color: var(--ot-red); }
.e-631be738 > .box.red > .circle::before { border: 1px dashed var(--ot-red-opacity); }

.e-631be738 > .box.orange > .circle { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-631be738 > .box.orange > .circle::before { border: 1px dashed var(--ot-orange-opacity); }

.e-631be738 > .box.green > .circle { background: var(--ot-green-opacity); color: var(--ot-green); }
.e-631be738 > .box.green > .circle::before { border: 1px dashed var(--ot-green-opacity); }

/* ===== SIZE ===== */

.e-631be738 > .box.size-s
{
	max-width: 360px;
}

.e-631be738 > .box.size-s > .circle { width: 56px; height: 56px; }
.e-631be738 > .box.size-s > .circle > i { font-size: 26px; }
.e-631be738 > .box.size-s > .title { font-size: 18px; }
.e-631be738 > .box.size-s > .description { font-size: var(--ot-size-m); }

.e-631be738 > .box.size-l
{
	max-width: 500px;
}

.e-631be738 > .box.size-l > .circle { width: 96px; height: 96px; }
.e-631be738 > .box.size-l > .circle::before { inset: -10px; }
.e-631be738 > .box.size-l > .circle > i { font-size: 44px; }
.e-631be738 > .box.size-l > .title { font-size: 28px; }
.e-631be738 > .box.size-l > .description { font-size: 15px; }
/* ===== STATUS LOADING ===== */

.e-691b81f7
{
	display: contents;
}

/* Box */

.e-691b81f7 > .box
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ot-spacing-m);
	width: 100%;
	min-height: 320px;
	padding: var(--ot-spacing-l);
}

/* Circle */

.e-691b81f7 > .box > .circle
{
	position: relative;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	border: 2px solid var(--ot-bg-3-border);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: e-691b81f7-pulse 2.4s ease-in-out infinite;
}

.e-691b81f7 > .box > .circle::before
{
	content: '';
	position: absolute;
	inset: -10px;
	border-radius: 50%;
	border: 1px dashed var(--ot-bg-3-border);
	opacity: 0.5;
	animation: e-691b81f7-pulse 2.4s ease-in-out infinite reverse;
}

.e-691b81f7 > .box > .circle > .spin
{
	font-size: 32px;
	animation: e-691b81f7-spin 0.8s linear infinite;
}

/* Text */

.e-691b81f7 > .box > .text
{
	font-size: var(--ot-size-m);
	color: var(--ot-text-2);
	font-family: var(--ot-font-primary);
}

/* ===== COLOR ===== */

.e-691b81f7 > .box.brand > .circle { border-color: var(--ot-brand-opacity); }
.e-691b81f7 > .box.brand > .circle::before { border-color: var(--ot-brand-opacity); }
.e-691b81f7 > .box.brand > .circle > .spin { color: var(--ot-brand); }

.e-691b81f7 > .box.blue > .circle { border-color: var(--ot-blue-opacity); }
.e-691b81f7 > .box.blue > .circle::before { border-color: var(--ot-blue-opacity); }
.e-691b81f7 > .box.blue > .circle > .spin { color: var(--ot-blue); }

.e-691b81f7 > .box.red > .circle { border-color: var(--ot-red-opacity); }
.e-691b81f7 > .box.red > .circle::before { border-color: var(--ot-red-opacity); }
.e-691b81f7 > .box.red > .circle > .spin { color: var(--ot-red); }

.e-691b81f7 > .box.orange > .circle { border-color: var(--ot-orange-opacity); }
.e-691b81f7 > .box.orange > .circle::before { border-color: var(--ot-orange-opacity); }
.e-691b81f7 > .box.orange > .circle > .spin { color: var(--ot-orange); }

.e-691b81f7 > .box.green > .circle { border-color: var(--ot-green-opacity); }
.e-691b81f7 > .box.green > .circle::before { border-color: var(--ot-green-opacity); }
.e-691b81f7 > .box.green > .circle > .spin { color: var(--ot-green); }

/* ===== SIZE ===== */

.e-691b81f7 > .box.size-s
{
	min-height: 200px;
	padding: var(--ot-spacing-m);
}

.e-691b81f7 > .box.size-s > .circle { width: 56px; height: 56px; }
.e-691b81f7 > .box.size-s > .circle > .spin { font-size: 24px; }
.e-691b81f7 > .box.size-s > .text { font-size: var(--ot-size-s); }

.e-691b81f7 > .box.size-l
{
	min-height: 440px;
}

.e-691b81f7 > .box.size-l > .circle { width: 104px; height: 104px; }
.e-691b81f7 > .box.size-l > .circle > .spin { font-size: 44px; }
.e-691b81f7 > .box.size-l > .text { font-size: 15px; }

/* ===== AUTO ===== */

.e-691b81f7 > .box.auto
{
	min-height: auto;
}

/* ===== ANIMATIONS ===== */

@keyframes e-691b81f7-spin
{
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@keyframes e-691b81f7-pulse
{
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.5; transform: scale(1.02); }
}
/* ===== VARIABLE BUILDER ===== */

.e-66c5db60
{
	display: contents;
}

/* Box */

.e-66c5db60 > .box
{
	display: flex;
	flex-direction: column;
	width: 70vw;
	max-width: 1000px;
	max-height: 90vh;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

/* ===== HEAD ===== */

.e-66c5db60 > .box > .head
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	border-bottom: 1px solid var(--ot-bg-1-border);
	flex-shrink: 0;
}

.e-66c5db60 > .box > .head > .head-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: var(--ot-brand-opacity);
	border-radius: var(--ot-radius-s);
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-66c5db60 > .box > .head > .head-icon > i
{
	font-size: 16px;
}

.e-66c5db60 > .box > .head > .head-text
{
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-66c5db60 > .box > .head > .head-text > .head-eyebrow
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-66c5db60 > .box > .head > .head-text > .head-title
{
	font-size: var(--ot-size-m);
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-66c5db60 > .box > .head > .head-close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--ot-height-s);
	height: var(--ot-height-s);
	padding: 0;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-66c5db60 > .box > .head > .head-close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-66c5db60 > .box > .head > .head-close > i
{
	font-size: 14px;
}

/* ===== BODY ===== */

.e-66c5db60 > .box > .body
{
	flex: 1;
	display: grid;
	grid-template-columns: 320px 1fr;
	min-height: 0;
	overflow: hidden;
}

/* ===== PICKER ===== */

.e-66c5db60 > .box > .body > .picker
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	background: var(--ot-bg-2);
	border-right: 1px solid var(--ot-bg-1-border);
	min-height: 0;
	overflow: hidden;
}

.e-66c5db60 > .box > .body > .picker > .picker-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-shrink: 0;
}

.e-66c5db60 > .box > .body > .picker > .picker-head > .picker-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-66c5db60 > .box > .body > .picker > .picker-head > .picker-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 18px;
	padding: 0 6px;
	background: var(--ot-bg-3);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	color: var(--ot-text-2);
}

/* Picker search */

.e-66c5db60 > .box > .body > .picker > .picker-search
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
	padding: 0 var(--ot-spacing-s);
	height: var(--ot-height-s);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-s);
	transition: border-color var(--ot-transition);
}

.e-66c5db60 > .box > .body > .picker > .picker-search:focus-within
{
	border-color: var(--ot-brand);
}

.e-66c5db60 > .box > .body > .picker > .picker-search > i
{
	font-size: 14px;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

.e-66c5db60 > .box > .body > .picker > .picker-search > input
{
	flex: 1;
	min-width: 0;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	color: var(--ot-text-1);
}

.e-66c5db60 > .box > .body > .picker > .picker-search > input::placeholder
{
	color: var(--ot-text-3);
}

/* Picker tree */

.e-66c5db60 > .box > .body > .picker > .picker-tree
{
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1px;
	overflow-y: auto;
	min-height: 0;
	scrollbar-width: thin;
	scrollbar-color: var(--ot-bg-3) transparent;
}

.e-66c5db60 > .box > .body > .picker > .picker-tree::-webkit-scrollbar
{
	width: 6px;
}

.e-66c5db60 > .box > .body > .picker > .picker-tree::-webkit-scrollbar-thumb
{
	background: var(--ot-bg-3);
	border-radius: 100px;
}

/* Node */

.e-66c5db60 .node
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	width: 100%;
	padding: 0 var(--ot-spacing-s) 0 calc(var(--ot-spacing-s) + var(--depth, 0) * 14px);
	height: 28px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: var(--ot-size-s);
	text-align: left;
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-66c5db60 .node:hover
{
	background: var(--ot-bg-3);
}

.e-66c5db60 .node.active
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand-opacity);
}

/* Chevron */

.e-66c5db60 .node > .node-chevron
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 14px;
	height: 14px;
	color: var(--ot-text-3);
}

.e-66c5db60 .node > .node-chevron > i
{
	font-size: 14px;
	transition: transform var(--ot-transition);
}

.e-66c5db60 .node.expandable.expanded > .node-chevron > i
{
	transform: rotate(90deg);
}

/* Key */

.e-66c5db60 .node > .node-key
{
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-s);
	font-weight: 600;
	color: var(--ot-text-1);
	flex-shrink: 0;
}

/* Preview value */

.e-66c5db60 .node > .node-preview
{
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

/* Type chip */

.e-66c5db60 .node > .node-type
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 2px 6px;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 100px;
	background: var(--ot-bg-1);
	color: var(--ot-text-3);
}

.e-66c5db60 .node.type-object  > .node-type { background: rgba(56,189,248,0.12);  color: var(--ot-blue); }
.e-66c5db60 .node.type-array   > .node-type { background: rgba(251,146,60,0.12);  color: var(--ot-orange); }
.e-66c5db60 .node.type-string  > .node-type { background: rgba(52,211,153,0.12);  color: var(--ot-green); }
.e-66c5db60 .node.type-number  > .node-type { background: rgba(226,112,85,0.12);  color: var(--ot-brand); }
.e-66c5db60 .node.type-boolean > .node-type { background: rgba(244,63,94,0.12);   color: var(--ot-red); }
.e-66c5db60 .node.type-date    > .node-type { background: var(--ot-bg-3);          color: var(--ot-text-2); }
.e-66c5db60 .node.type-null    > .node-type { background: var(--ot-bg-3);          color: var(--ot-text-3); }

/* Empty */

.e-66c5db60 > .box > .body > .picker > .picker-tree > .picker-empty,
.e-66c5db60 > .box > .body > .picker .picker-empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: var(--ot-spacing-m);
	border: 1px dashed var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-3);
	font-size: var(--ot-size-s);
}

.e-66c5db60 .picker-empty > i
{
	font-size: 18px;
}

/* ===== EDITOR ===== */

.e-66c5db60 > .box > .body > .editor
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	overflow-y: auto;
	min-height: 0;
}

.e-66c5db60 > .box > .body > .editor > .editor-field
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-area
{
	width: 100%;
	min-height: 96px;
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-1);
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-m);
	line-height: 1.5;
	resize: vertical;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-area::placeholder
{
	color: var(--ot-text-3);
	font-family: var(--ot-font-primary);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-area:focus
{
	border-color: var(--ot-brand);
	box-shadow: 0 0 0 1px var(--ot-brand-opacity);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-hint
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.5;
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-hint > code
{
	padding: 1px 6px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-s);
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: 11px;
	color: var(--ot-text-2);
}

/* ===== QUICK INSERTS ===== */

.e-66c5db60 > .box > .body > .editor > .editor-quick
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--ot-spacing-s);
}

.e-66c5db60 > .box > .body > .editor > .editor-quick > .editor-quick-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-66c5db60 > .box > .body > .editor > .editor-quick > .editor-quick-item
{
	display: inline-flex;
	align-items: center;
	padding: 0 var(--ot-spacing-s);
	height: 24px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-s);
	color: var(--ot-text-2);
	cursor: pointer;
	outline: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition);
}

.e-66c5db60 > .box > .body > .editor > .editor-quick > .editor-quick-item:hover
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

/* ===== PREVIEW ===== */

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview
{
	display: flex;
	align-items: flex-start;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	font-size: var(--ot-size-m);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview > i
{
	font-size: 16px;
	flex-shrink: 0;
	margin-top: 2px;
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview > pre
{
	flex: 1;
	margin: 0;
	font-family: var(--ot-font-mono, ui-monospace, Menlo, Consolas, monospace);
	font-size: var(--ot-size-m);
	line-height: 1.5;
	white-space: pre-wrap;
	word-break: break-word;
	color: var(--ot-text-1);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview.ok
{
	background: rgba(52,211,153,0.08);
	border-color: rgba(52,211,153,0.18);
	color: var(--ot-text-1);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview.ok > i
{
	color: var(--ot-green);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview.error
{
	background: rgba(244,63,94,0.08);
	border-color: rgba(244,63,94,0.18);
	color: var(--ot-red);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview.error > i
{
	color: var(--ot-red);
}

.e-66c5db60 > .box > .body > .editor > .editor-field > .editor-preview.empty
{
	background: var(--ot-bg-2);
	border: 1px dashed var(--ot-bg-2-border);
	color: var(--ot-text-3);
}

/* ===== FOOT ===== */

.e-66c5db60 > .box > .foot
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-m);
	border-top: 1px solid var(--ot-bg-1-border);
	flex-shrink: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-66c5db60 > .box
	{
		width: 95vw;
		max-height: 95vh;
	}

	.e-66c5db60 > .box > .body
	{
		grid-template-columns: 1fr;
	}

	.e-66c5db60 > .box > .body > .picker
	{
		border-right: none;
		border-bottom: 1px solid var(--ot-bg-1-border);
		max-height: 40vh;
	}
}
/* ===== DASHBOARD CHART ===== */

.e-2c458a8f
{
	display: contents;
}

.e-2c458a8f > .box
{
	display: flex;
	align-items: stretch;
	gap: var(--ot-spacing-s);
	flex: 1;
	min-height: 90px;
}

.e-2c458a8f .bar
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	flex: 1;
	min-width: 0;
}

.e-2c458a8f .bar > .holder
{
	display: flex;
	align-items: flex-end;
	flex: 1;
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-2);
}

.e-2c458a8f .bar > .holder > .fill
{
	width: 100%;
	border-radius: var(--ot-radius-s);
	background: linear-gradient(180deg, var(--ot-brand-border), var(--ot-brand));
	transition: height var(--ot-transition-slow);
}

.e-2c458a8f .bar > .label
{
	font-size: 10px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* ===== DASHBOARD LIST ===== */

.e-27d89c33
{
	display: contents;
}

.e-27d89c33 > .box
{
	display: flex;
	flex-direction: column;
	flex: 1;
	margin: 0 calc(var(--ot-spacing-s) * -1);
}

.e-27d89c33 .row
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: 7px var(--ot-spacing-s);
	border-radius: var(--ot-radius-s);
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-27d89c33 .row:hover
{
	background: var(--ot-bg-2);
}

.e-27d89c33 .row > i
{
	font-size: 17px;
	color: var(--ot-text-3);
}

.e-27d89c33 .row > .label
{
	flex: 1;
	min-width: 0;
	font-size: var(--ot-size-m);
	color: var(--ot-text-2);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-27d89c33 .row > .value
{
	font-size: var(--ot-size-s);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--ot-text-1);
	background: var(--ot-bg-3);
	border-radius: 999px;
	padding: 2px 9px;
}
/* ===== DASHBOARD STAT ===== */

.e-27d5467d
{
	display: contents;
}

.e-27d5467d > .box
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1;
	justify-content: flex-end;
}

.e-27d5467d .row
{
	display: flex;
	align-items: baseline;
	gap: var(--ot-spacing-s);
}

.e-27d5467d .value
{
	font-family: var(--ot-font-secondary);
	font-size: 34px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1;
}

.e-27d5467d .delta
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 8px;
	font-size: 11px;
	font-weight: 600;
	border-radius: 999px;
}

.e-27d5467d .delta i
{
	font-size: 13px;
}

.e-27d5467d .delta.up
{
	color: var(--ot-green);
	background: var(--ot-green-opacity);
}

.e-27d5467d .delta.down
{
	color: var(--ot-red);
	background: var(--ot-red-opacity);
}

.e-27d5467d .label
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
}

.e-27d5467d svg
{
	display: block;
	width: 100%;
	height: 30px;
	margin-top: var(--ot-spacing-s);
	color: var(--ot-brand);
	opacity: 0.9;
}
/* ===== DASHBOARD WIDGETS ===== */

.e-54e3b920
{
	display: contents;
}

/* Box — dot mesh podloga preko celog area */

.e-54e3b920 > .box
{
	height: 100%;
	padding: var(--ot-spacing-l);
	overflow: auto;
	background-color: var(--ot-bg-2);
	background-image: radial-gradient(circle at 1px 1px, var(--ot-bg-4-border) 1px, transparent 0);
	background-size: 22px 22px;
}

/* ===== GRID ===== */

.e-54e3b920 .widgets
{
	display: grid;
	grid-auto-rows: minmax(150px, auto);
	grid-auto-flow: dense;
	gap: var(--ot-spacing-m);
	max-width: 1280px;
	margin: 0 auto;
}

.e-54e3b920 .widgets.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.e-54e3b920 .widgets.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.e-54e3b920 .widgets.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.e-54e3b920 .widgets.cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

/* ===== WIDGET ===== */

.e-54e3b920 .widget
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	transition: border-color var(--ot-transition);
}

/* ===== HEADER ===== */

.e-54e3b920 .widget > .header
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
}

/* Icon chip */

.e-54e3b920 .widget > .header > .icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-54e3b920 .widget > .header > .icon > i
{
	font-size: 20px;
}

/* Text */

.e-54e3b920 .widget > .header > .text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1;
}

.e-54e3b920 .widget .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-54e3b920 .widget .description
{
	margin: 0;
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== SKELETON ===== */

.e-54e3b920 .widget > .skeleton
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-s);
	flex: 1;
	justify-content: center;
}

.e-54e3b920 .widget > .skeleton > .line
{
	height: 12px;
	border-radius: 6px;
	background: linear-gradient(90deg, var(--ot-bg-3) 25%, var(--ot-bg-4) 50%, var(--ot-bg-3) 75%);
	background-size: 200% 100%;
	animation: e-54e3b920-shimmer 1.2s ease-in-out infinite;
}

.e-54e3b920 .widget > .skeleton > .line.short
{
	width: 55%;
}

@keyframes e-54e3b920-shimmer
{
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* ===== CUSTOM CONTENT ===== */

.e-54e3b920 .widget > .content
{
	flex: 1;
	font-size: var(--ot-size-m);
	line-height: 1.55;
	color: var(--ot-text-2);
}

.e-54e3b920 .widget > .content p
{
	margin: 0;
}

/* ===== FOOTER ===== */

.e-54e3b920 .widget > .footer
{
	display: flex;
	flex-wrap: wrap;
	gap: var(--ot-spacing-s);
	margin-top: auto;
	padding-top: var(--ot-spacing-s);
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-54e3b920 .widget .action
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: var(--ot-height-s);
	padding: 0 14px;
	font-size: var(--ot-size-s);
	font-weight: 500;
	color: var(--ot-text-2);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 999px;
	text-decoration: none;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-54e3b920 .widget .action:hover
{
	color: var(--ot-brand);
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand-border);
}

.e-54e3b920 .widget .action i
{
	font-size: 16px;
}
.e-19663623
{
	display: contents;
}

.e-19663623 .group-body .options
{
	max-height: 250px;
	overflow-y: auto;
}
.e-2262da0c
{
	display: block;
	height: 100%;
}

.e-2262da0c > .holder
{
	height: 100%;
	padding: var(--ot-spacing-m);
	padding-left: 0;
}
.e-5281e6a5 .card
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: var(--ot-spacing-m);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-m);
}

.e-5281e6a5 .card > .icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--ot-height-l);
	height: var(--ot-height-l);
	border-radius: var(--ot-radius-s);
	flex-shrink: 0;
}

.e-5281e6a5 .card.color-brand  > .icon { background: var(--ot-brand-opacity);  color: var(--ot-brand); }
.e-5281e6a5 .card.color-blue   > .icon { background: var(--ot-blue-opacity);   color: var(--ot-blue); }
.e-5281e6a5 .card.color-red    > .icon { background: var(--ot-red-opacity);    color: var(--ot-red); }
.e-5281e6a5 .card.color-orange > .icon { background: var(--ot-orange-opacity); color: var(--ot-orange); }
.e-5281e6a5 .card.color-green  > .icon { background: var(--ot-green-opacity);  color: var(--ot-green); }

.e-5281e6a5 .card > .text
{
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-x);
	min-width: 0;
}

.e-5281e6a5 .card > .text > .label
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-2);
}

.e-5281e6a5 .card > .text > .value
{
	font-family: var(--ot-font-secondary);
	font-size: var(--ot-size-l);
	color: var(--ot-text-1);
}
.e-9706fa6
{
	display: block;
}
.e-6a2ccec2
{
    display: contents;
}
.e-2a8d7230
{
    display: contents;
}
.e-2a6b4ea3
{
	display: block;
}

.e-2a6b4ea3 > .holder
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-m);
	padding: 0 var(--ot-spacing-m);
	background: var(--ot-bg-1);
	border-bottom: 1px solid var(--ot-bg-1-border);
}

.e-2a6b4ea3 > .holder > .record
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	flex-shrink: 0;
	min-width: 0;
	padding: var(--ot-spacing-s) 0;
}

.e-2a6b4ea3 > .holder > .record > .record-back
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: var(--ot-radius-m);
	border: 1px solid var(--ot-bg-2-border);
	background: var(--ot-bg-1);
	color: var(--ot-text-2);
	flex-shrink: 0;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-2a6b4ea3 > .holder > .record > .record-back:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-3-border);
}

.e-2a6b4ea3 > .holder > .record > .record-back > i
{
	font-size: 19px;
}

.e-2a6b4ea3 > .holder > .record > .record-icon
{
	font-size: 22px;
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-2a6b4ea3 > .holder > .record > .record-title
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 600;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 480px;
}

.e-2a6b4ea3 > .holder > .record + .tabs::before
{
	content: '';
	width: 1px;
	height: 20px;
	margin-right: var(--ot-spacing-m);
	background: var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-2a6b4ea3 > .holder > .tabs
{
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.e-65a99659
{
	display: block;
	width: 100%;
}

.e-65a99659 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 26px 26px 22px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
}

/* ========================================== */
/* ===== PRICE BLOCK ======================== */
/* ========================================== */

.e-65a99659 .price-block
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.e-65a99659 .price-block.inquiry
{
	gap: 4px;
}

.e-65a99659 .price-block.inquiry > .inquiry-label
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 400;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-65a99659 .price-block.inquiry > .inquiry-hint
{
	font-size: 13px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-65a99659 .savings
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	width: fit-content;
	padding: 5px 11px 5px 9px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-65a99659 .savings > i
{
	font-size: 13px;
	font-variation-settings: 'FILL' 1;
}

/* Price row */

.e-65a99659 .price-row
{
	display: flex;
	flex-direction: column;
	gap: 0;
	line-height: 1;
}

.e-65a99659 .price-old
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-decoration: line-through;
	margin-bottom: 4px;
	line-height: 1;
}

.e-65a99659 .price-current
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
}

.e-65a99659 .price-from
{
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-65a99659 .price-value
{
	font-family: var(--ot-font-secondary);
	font-size: 44px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.028em;
	font-variation-settings: 'opsz' 144;
	line-height: 1;
}

.e-65a99659 .price-currency
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	color: var(--ot-text-2);
	letter-spacing: -0.018em;
	font-variation-settings: 'opsz' 144;
}

.e-65a99659 .price-per
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	margin-top: 6px;
	letter-spacing: 0.005em;
}

/* ========================================== */
/* ===== DATES ============================== */
/* ========================================== */

.e-65a99659 .dates
{
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	position: relative;
}

.e-65a99659 .date
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	line-height: 1.2;
}

.e-65a99659 .date-label
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-65a99659 .date-value
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.012em;
	font-variation-settings: 'opsz' 144;
}

.e-65a99659 .date-arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

.e-65a99659 .date-arrow > i
{
	font-size: 17px;
}

.e-65a99659 .date-duration
{
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	white-space: nowrap;
}

/* ========================================== */
/* ===== DEADLINES ========================== */
/* ========================================== */

.e-65a99659 .deadlines
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-65a99659 .deadline
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px 11px 12px;
	border-radius: var(--ot-radius-m);
	border: 1px solid transparent;
}

.e-65a99659 .deadline.tone-brand
{
	background: var(--ot-brand-opacity);
}

.e-65a99659 .deadline.tone-gold
{
	background: rgba(170, 130, 60, 0.1);
}

.e-65a99659 .deadline.tone-green
{
	background: rgba(20, 144, 95, 0.1);
}

.e-65a99659 .deadline.tone-dark
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-65a99659 .deadline-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.e-65a99659 .deadline-icon > i
{
	font-size: 18px;
}

.e-65a99659 .deadline.tone-brand .deadline-icon > i { color: var(--ot-brand); }
.e-65a99659 .deadline.tone-gold  .deadline-icon > i { color: rgba(170, 130, 60, 1); }
.e-65a99659 .deadline.tone-green .deadline-icon > i { color: rgba(20, 144, 95, 1); }
.e-65a99659 .deadline.tone-dark  .deadline-icon > i { color: var(--ot-bg-1); }

.e-65a99659 .deadline-text
{
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
	line-height: 1.3;
}

.e-65a99659 .deadline-label
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-65a99659 .deadline.tone-brand .deadline-label { color: var(--ot-brand); }
.e-65a99659 .deadline.tone-gold  .deadline-label { color: rgba(170, 130, 60, 1); }
.e-65a99659 .deadline.tone-green .deadline-label { color: rgba(20, 144, 95, 1); }
.e-65a99659 .deadline.tone-dark  .deadline-label { color: var(--ot-bg-1); }

.e-65a99659 .deadline-value
{
	font-family: var(--ot-font-secondary);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

.e-65a99659 .deadline.tone-brand .deadline-value,
.e-65a99659 .deadline.tone-gold  .deadline-value,
.e-65a99659 .deadline.tone-green .deadline-value
{
	color: var(--ot-text-1);
}

.e-65a99659 .deadline.tone-dark .deadline-value
{
	color: var(--ot-bg-1);
}

/* ========================================== */
/* ===== CTA ================================ */
/* ========================================== */

.e-65a99659 .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 22px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-bg-1);
	letter-spacing: 0.005em;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms, transform 240ms;
	margin-top: 4px;
}

.e-65a99659 .cta:hover
{
	background: var(--ot-brand);
	gap: 14px;
	transform: translateY(-1px);
}

.e-65a99659 .cta > i
{
	font-size: 18px;
}

/* CTA note */

.e-65a99659 .cta-note
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
	justify-content: center;
}

.e-65a99659 .cta-note > i
{
	font-size: 14px;
	color: rgba(20, 144, 95, 1);
	font-variation-settings: 'FILL' 1;
}

/* ========================================== */
/* ===== TRUST LIST ========================= */
/* ========================================== */

.e-65a99659 .trust
{
	list-style: none;
	margin: 4px 0 0;
	padding: 16px 0 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-65a99659 .trust-item
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--ot-text-2);
	letter-spacing: 0.005em;
}

.e-65a99659 .trust-item > i
{
	font-size: 16px;
	color: var(--ot-brand);
	flex-shrink: 0;
	font-variation-settings: 'FILL' 0;
}

/* ========================================== */
/* ===== NOTIFY (collapsible form) ========== */
/* ========================================== */

.e-65a99659 .notify
{
	border-top: 1px solid var(--ot-bg-2-border);
	padding-top: 4px;
}

.e-65a99659 .notify-trigger
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px 0;
	background: transparent;
	border: 0;
	font: inherit;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: color 200ms;
}

.e-65a99659 .notify-trigger:hover
{
	color: var(--ot-brand);
}

.e-65a99659 .notify-trigger-text
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: -0.005em;
}

.e-65a99659 .notify-trigger-text > i
{
	font-size: 17px;
	color: var(--ot-brand);
}

.e-65a99659 .notify-trigger-toggle
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	font-size: 16px;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-65a99659 .notify-trigger:hover .notify-trigger-toggle
{
	background: var(--ot-bg-3);
}

/* Notify form */

.e-65a99659 .notify-form
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 4px 0 12px;
	animation: e-65a99659-expand 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-65a99659-expand
{
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}

.e-65a99659 .notify-description
{
	font-size: 12px;
	line-height: 1.5;
	color: var(--ot-text-3);
	margin: 0 0 4px;
}

.e-65a99659 .notify-field
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-65a99659 .notify-field:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-65a99659 .notify-field > i
{
	font-size: 16px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-65a99659 .notify-field:focus-within > i
{
	color: var(--ot-brand);
}

.e-65a99659 .notify-field > input
{
	flex: 1;
	min-width: 0;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	outline: none;
}

.e-65a99659 .notify-field > input::placeholder
{
	color: var(--ot-text-3);
}

.e-65a99659 .notify-submit
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 11px 18px;
	background: var(--ot-brand);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: white;
	letter-spacing: 0.005em;
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms;
	margin-top: 2px;
}

.e-65a99659 .notify-submit:hover
{
	background: var(--ot-brand-hover);
	gap: 10px;
}

.e-65a99659 .notify-submit > i
{
	font-size: 15px;
}

/* ========================================== */
/* ===== HELP =============================== */
/* ========================================== */

.e-65a99659 .help
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-m);
}

.e-65a99659 .help-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-65a99659 .help-title
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-65a99659 .help-phone
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

.e-65a99659 .help-cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 14px 9px 12px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms, border-color 200ms;
	flex-shrink: 0;
}

.e-65a99659 .help-cta:hover
{
	background: var(--ot-brand);
	color: white;
	border-color: var(--ot-brand);
}

.e-65a99659 .help-cta > i
{
	font-size: 14px;
}

/* ========================================== */
/* ===== SHARE ROW ========================== */
/* ========================================== */

.e-65a99659 .share
{
	display: flex;
	gap: 6px;
	padding-top: 4px;
}

.e-65a99659 .share-btn
{
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 38px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms, border-color 200ms;
}

.e-65a99659 .share-btn:hover
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-3-border);
}

.e-65a99659 .share-btn.is-active
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	border-color: transparent;
}

.e-65a99659 .share-btn.is-active > i
{
	font-variation-settings: 'FILL' 1;
}

.e-65a99659 .share-btn > i
{
	font-size: 17px;
}
.e-4769ae34
{
	display: block;
	width: 100%;
}

.e-4769ae34 > .holder
{
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-1);
}

/* ===== TAB BAR ===== */

/* Tab bar u brand boji sajta — aktivni tab je popunjena pilula. */

.e-4769ae34 .tabs
{
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 12px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	background: var(--ot-brand-opacity);
	overflow-x: auto;
	scrollbar-width: none;
}

.e-4769ae34 .tabs::-webkit-scrollbar
{
	display: none;
}

.e-4769ae34 .tab
{
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	flex-shrink: 0;
	padding: 12px 18px;
	background: transparent;
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	white-space: nowrap;
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-4769ae34 .tab > i
{
	font-size: 20px;
	color: var(--ot-text-3);
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-4769ae34 .tab:hover
{
	color: var(--ot-text-1);
}

.e-4769ae34 .tab:hover > i
{
	color: var(--ot-text-2);
}

.e-4769ae34 .tab.active
{
	background: var(--ot-brand);
	color: white;
}

.e-4769ae34 .tab.active > i
{
	color: white;
}

/* ===== PANELS ===== */

.e-4769ae34 .panels
{
	padding: 28px 32px;
}

.e-4769ae34 .panel
{
	display: none;
}

.e-4769ae34 .panel.active
{
	display: block;
}

/* ===== PROSE RESET (HTML content) =====
   Tab content comes from the DB as raw HTML with inline styles (color, font-family,
   bgcolor, border). We must override those inline styles, hence !important on the
   colour/background/font properties so the panel matches the site design. */

.e-4769ae34 .panel
{
	font-size: 15px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* Neutralise inline color/font/background from pasted HTML across all descendants. */
.e-4769ae34 .panel *
{
	color: inherit !important;
	background-color: transparent !important;
	font-family: var(--ot-font-primary) !important;
	max-width: 100% !important;
}

.e-4769ae34 .panel > :first-child
{
	margin-top: 0;
}

.e-4769ae34 .panel > :last-child
{
	margin-bottom: 0;
}

.e-4769ae34 .panel h1,
.e-4769ae34 .panel h2,
.e-4769ae34 .panel h3,
.e-4769ae34 .panel h4
{
	font-family: var(--ot-font-secondary) !important;
	font-weight: 500;
	color: var(--ot-text-1) !important;
	line-height: 1.25;
	margin: 26px 0 10px;
}

.e-4769ae34 .panel h1 { font-size: 24px; }
.e-4769ae34 .panel h2 { font-size: 21px; }
.e-4769ae34 .panel h3 { font-size: 18px; }
.e-4769ae34 .panel h4 { font-size: 16px; }

.e-4769ae34 .panel p
{
	margin: 0 0 14px;
}

.e-4769ae34 .panel a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-4769ae34 .panel strong
{
	color: var(--ot-text-1);
	font-weight: 600;
}

.e-4769ae34 .panel ul,
.e-4769ae34 .panel ol
{
	margin: 0 0 16px;
	padding-left: 22px;
}

.e-4769ae34 .panel li
{
	margin-bottom: 6px;
}

.e-4769ae34 .panel ul li::marker
{
	color: var(--ot-brand);
}

.e-4769ae34 .panel img
{
	max-width: 100%;
	height: auto;
	border-radius: var(--ot-radius-m);
	margin: 8px 0;
}

.e-4769ae34 .panel hr
{
	border: 0;
	border-top: 1px solid var(--ot-bg-2-border);
	margin: 28px 0;
}

/* ===== TABLE (pricing) RESET ===== */

.e-4769ae34 .panel table
{
	width: 100% !important;
	table-layout: fixed;
	border-collapse: collapse;
	margin: 4px 0 18px;
	font-size: 14px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

/* Override inline width/colgroup on pasted tables. */
.e-4769ae34 .panel table colgroup,
.e-4769ae34 .panel table col
{
	width: auto !important;
}

.e-4769ae34 .panel table th,
.e-4769ae34 .panel table td
{
	padding: 11px 14px;
	text-align: left;
	border: 1px solid var(--ot-bg-2-border);
	vertical-align: top;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.e-4769ae34 .panel table th
{
	background-color: var(--ot-bg-2) !important;
	color: var(--ot-text-1) !important;
	font-weight: 600;
	font-size: 13px;
}

.e-4769ae34 .panel table tr:nth-child(even) td
{
	background-color: var(--ot-bg-2) !important;
}

/* First row often acts as a header in pasted tables. */
.e-4769ae34 .panel table tr:first-child td
{
	background-color: var(--ot-bg-2) !important;
	font-weight: 600;
	color: var(--ot-text-1) !important;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 700px)
{
	.e-4769ae34 .panels
	{
		padding: 22px 18px;
	}

	.e-4769ae34 .tab
	{
		padding: 14px 14px;
		font-size: 13px;
	}

	.e-4769ae34 .tab > span
	{
		display: inline;
	}
}
.e-29e43647
{
	display: block;
	width: 100%;
}

.e-29e43647 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* ===== GRID ===== */

.e-29e43647 .grid
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 2), 1fr);
	gap: 8px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	padding: 8px;
}

/* ===== ITEM ===== */

.e-29e43647 .item
{
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 16px;
	background: transparent;
	border-radius: var(--ot-radius-m);
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-29e43647 .item:hover
{
	background: var(--ot-bg-2);
}

.e-29e43647 .item.is-sold
{
	opacity: 0.55;
}

.e-29e43647 .item.is-sold:hover
{
	background: transparent;
}

/* Pin */

.e-29e43647 .item-pin
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--ot-bg-2);
	flex-shrink: 0;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-29e43647 .item:hover .item-pin
{
	background: var(--ot-bg-1);
}

.e-29e43647 .item.is-main .item-pin
{
	background: var(--ot-brand-opacity);
}

.e-29e43647 .item-pin > i
{
	font-size: 18px;
	color: var(--ot-text-3);
	transition: color 220ms;
}

.e-29e43647 .item:hover .item-pin > i,
.e-29e43647 .item.is-main .item-pin > i
{
	color: var(--ot-brand);
}

/* Text */

.e-29e43647 .item-text
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	flex: 1;
}

.e-29e43647 .item-head
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.e-29e43647 .item-city
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	line-height: 1.2;
}

.e-29e43647 .item-tag
{
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-29e43647 .item-region
{
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* Meta chips */

.e-29e43647 .item-meta
{
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 4px;
}

.e-29e43647 .meta-chip
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px 4px 8px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-2);
	letter-spacing: 0.005em;
}

.e-29e43647 .item:hover .meta-chip
{
	background: var(--ot-bg-1);
}

.e-29e43647 .meta-chip > i
{
	font-size: 13px;
	color: var(--ot-text-3);
}

/* Note */

.e-29e43647 .item-note
{
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	line-height: 1.45;
	margin-top: 2px;
}

/* Aside (surcharge / status) */

.e-29e43647 .item-aside
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	flex-shrink: 0;
	text-align: right;
}

.e-29e43647 .item-surcharge
{
	font-family: var(--ot-font-secondary);
	font-size: 16px;
	font-weight: 500;
	color: var(--ot-brand);
	letter-spacing: -0.012em;
	font-variation-settings: 'opsz' 144;
	white-space: nowrap;
}

.e-29e43647 .item-status
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px 4px 8px;
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-29e43647 .item-status > i
{
	font-size: 13px;
	font-variation-settings: 'FILL' 1;
}

.e-29e43647 .item-status.available
{
	background: rgba(20, 144, 95, 0.12);
	color: rgba(20, 144, 95, 1);
}

.e-29e43647 .item-status.sold
{
	background: var(--ot-bg-3);
	color: var(--ot-text-3);
}

/* Note */

.e-29e43647 .note
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
	margin: 0;
	padding: 0 4px;
}

.e-29e43647 .note > i
{
	font-size: 14px;
	color: var(--ot-text-3);
}

/* ===== RESPONSIVE ===== */

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

	.e-29e43647 .item
	{
		padding: 14px 14px;
	}
}
.e-3121f0f5
{
	display: block;
	width: 100%;
}

.e-3121f0f5 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.e-3121f0f5 .excursion
{
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 0;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-1);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Bez cover slike — sadržaj zauzima punu širinu (1 kolona). */

.e-3121f0f5 .excursion.no-cover
{
	grid-template-columns: 1fr;
}

.e-3121f0f5 .excursion:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-3121f0f5 .cover
{
	position: relative;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	min-height: 140px;
}

.e-3121f0f5 .day
{
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-3121f0f5 .body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 24px;
}

.e-3121f0f5 .head
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-3121f0f5 .day-inline
{
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-3121f0f5 .name
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-3121f0f5 .description
{
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--ot-text-2);
	margin: 0;
}

.e-3121f0f5 .meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 2px;
}

.e-3121f0f5 .chip
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-3121f0f5 .chip > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 15px;
}

.e-3121f0f5 .chip.included
{
	background: rgba(34, 160, 90, 0.12);
	color: #1d8a4e;
}

.e-3121f0f5 .chip.price
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

@media (max-width: 600px)
{
	.e-3121f0f5 .excursion
	{
		grid-template-columns: 1fr;
	}

	.e-3121f0f5 .cover
	{
		min-height: 160px;
	}
}
.e-64a5b7d5
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-64a5b7d5 > .holder
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
}

/* ===== CARD VARIANT (default) ===== */

.e-64a5b7d5 > .holder.variant-card
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-64a5b7d5 > .holder.variant-card.tone-dark
{
	background: var(--ot-text-1);
	border-color: rgba(255, 255, 255, 0.1);
}

/* ===== FLAT VARIANT (no border, just dividers) ===== */

.e-64a5b7d5 > .holder.variant-flat
{
	border-top: 1px solid var(--ot-bg-2-border);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* ===== INLINE VARIANT (compact pills) ===== */

.e-64a5b7d5 > .holder.variant-inline
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

/* ========================================== */
/* ===== ITEM ============================== */
/* ========================================== */

.e-64a5b7d5 .item
{
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 22px 24px;
	min-width: 0;
}

/* Vertical dividers (right side, all except 3rd column) */

.e-64a5b7d5 > .holder.variant-card .item:not(:nth-child(3n))::after,
.e-64a5b7d5 > .holder.variant-flat .item:not(:nth-child(3n))::after
{
	content: '';
	position: absolute;
	top: 16px;
	bottom: 16px;
	right: 0;
	width: 1px;
	background: var(--ot-bg-2-border);
}

.e-64a5b7d5 > .holder.tone-dark .item:not(:nth-child(3n))::after
{
	background: rgba(255, 255, 255, 0.08);
}

/* Horizontal divider for items not in the last row */

.e-64a5b7d5 > .holder.variant-card .item.has-row-divider,
.e-64a5b7d5 > .holder.variant-flat .item.has-row-divider
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-64a5b7d5 > .holder.tone-dark .item.has-row-divider
{
	border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* ===== ICON ===== */

.e-64a5b7d5 .item-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--ot-brand-opacity);
	flex-shrink: 0;
}

.e-64a5b7d5 .item-icon > i
{
	font-size: 22px;
	color: var(--ot-brand);
}

/* Accent variants on icon */

.e-64a5b7d5 .item.accent-dark  .item-icon { background: rgba(20, 18, 16, 0.06); }
.e-64a5b7d5 .item.accent-dark  .item-icon > i { color: var(--ot-text-1); }

.e-64a5b7d5 .item.accent-green .item-icon { background: rgba(20, 144, 95, 0.12); }
.e-64a5b7d5 .item.accent-green .item-icon > i { color: rgba(20, 144, 95, 1); }

.e-64a5b7d5 .item.accent-gold  .item-icon { background: rgba(170, 130, 60, 0.12); }
.e-64a5b7d5 .item.accent-gold  .item-icon > i { color: rgba(170, 130, 60, 1); }

.e-64a5b7d5 > .holder.tone-dark .item-icon
{
	background: color-mix(in srgb, var(--ot-brand) 18%, transparent);
}

.e-64a5b7d5 > .holder.tone-dark .item-icon > i
{
	color: white;
}

/* ===== TEXT ===== */

.e-64a5b7d5 .item-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	line-height: 1.25;
}

.e-64a5b7d5 .item-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-64a5b7d5 > .holder.tone-dark .item-label
{
	color: rgba(255, 255, 255, 0.55);
}

.e-64a5b7d5 .item-value
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.012em;
	font-variation-settings: 'opsz' 144;
	line-height: 1.2;
}

.e-64a5b7d5 > .holder.tone-dark .item-value
{
	color: white;
}

.e-64a5b7d5 .item-note
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
	margin-top: 2px;
}

.e-64a5b7d5 > .holder.tone-dark .item-note
{
	color: rgba(255, 255, 255, 0.5);
}

/* ========================================== */
/* ===== INLINE VARIANT (specific) ========== */
/* ========================================== */

.e-64a5b7d5 > .holder.variant-inline .item
{
	padding: 8px 14px 8px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	gap: 8px;
}

.e-64a5b7d5 > .holder.variant-inline .item-icon
{
	width: 28px;
	height: 28px;
	border-radius: 50%;
}

.e-64a5b7d5 > .holder.variant-inline .item-icon > i
{
	font-size: 15px;
}

.e-64a5b7d5 > .holder.variant-inline .item-text
{
	flex-direction: row;
	align-items: baseline;
	gap: 6px;
}

.e-64a5b7d5 > .holder.variant-inline .item-label
{
	font-size: 10px;
}

.e-64a5b7d5 > .holder.variant-inline .item-value
{
	font-size: 13px;
}

.e-64a5b7d5 > .holder.variant-inline .item-note
{
	display: none;
}

.e-64a5b7d5 > .holder.variant-inline .item::after
{
	display: none;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 700px)
{
	.e-64a5b7d5 > .holder.variant-card,
	.e-64a5b7d5 > .holder.variant-flat
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-64a5b7d5 .item
	{
		padding: 18px 18px;
	}

	/* Reset 3-col dividers, apply 2-col dividers */

	.e-64a5b7d5 > .holder.variant-card .item:not(:nth-child(3n))::after,
	.e-64a5b7d5 > .holder.variant-flat .item:not(:nth-child(3n))::after
	{
		display: none;
	}

	.e-64a5b7d5 > .holder.variant-card .item:nth-child(2n - 1)::after,
	.e-64a5b7d5 > .holder.variant-flat .item:nth-child(2n - 1)::after
	{
		content: '';
		display: block;
		position: absolute;
		top: 16px;
		bottom: 16px;
		right: 0;
		width: 1px;
		background: var(--ot-bg-2-border);
	}
}

@media (max-width: 460px)
{
	.e-64a5b7d5 > .holder.variant-card,
	.e-64a5b7d5 > .holder.variant-flat
	{
		grid-template-columns: 1fr;
	}

	.e-64a5b7d5 > .holder.variant-card .item::after,
	.e-64a5b7d5 > .holder.variant-flat .item::after
	{
		display: none;
	}

	.e-64a5b7d5 > .holder.variant-card .item:not(:last-child),
	.e-64a5b7d5 > .holder.variant-flat .item:not(:last-child)
	{
		border-bottom: 1px solid var(--ot-bg-2-border);
	}
}
.e-721eb624
{
	display: block;
	width: 100%;
}

/* ========================================== */
/* ===== FLAT VARIANT (default) ============= */
/* ========================================== */

.e-721eb624 > .holder.variant-flat
{
	display: flex;
	flex-direction: column;
}


/* ========================================== */
/* ===== CARD VARIANT ======================= */
/* ========================================== */

.e-721eb624 > .holder.variant-card
{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-721eb624 > .holder.variant-card .item
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	transition: border-color 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-721eb624 > .holder.variant-card .item:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-721eb624 > .holder.variant-card .item.is-open
{
	border-color: var(--ot-brand);
}

/* ========================================== */
/* ===== TRIGGER ============================ */
/* ========================================== */

.e-721eb624 .trigger
{
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100%;
	padding: 22px 4px;
	background: transparent;
	border: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
	text-align: left;
	transition: padding 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-721eb624 > .holder.variant-card .trigger
{
	padding: 22px 24px;
}

.e-721eb624 .trigger-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 0;
}

.e-721eb624 .trigger-category
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-721eb624 .item.is-open .trigger-category
{
	color: var(--ot-brand);
}

.e-721eb624 .trigger-question
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	line-height: 1.3;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	transition: color 200ms;
}

.e-721eb624 .trigger:hover .trigger-question
{
	color: var(--ot-brand);
}

.e-721eb624 .item.is-open .trigger-question
{
	color: var(--ot-brand);
}

.e-721eb624 .trigger-icon
{
	font-size: 19px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-721eb624 .item.is-open .trigger-icon,
.e-721eb624 .trigger:hover .trigger-icon
{
	color: var(--ot-brand);
}

/* Toggle (+/−) */

.e-721eb624 .trigger-toggle
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	flex-shrink: 0;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, transform 240ms;
}

.e-721eb624 .trigger:hover .trigger-toggle
{
	background: var(--ot-bg-3);
}

.e-721eb624 .item.is-open .trigger-toggle
{
	background: var(--ot-brand);
	color: white;
	transform: rotate(180deg);
}

.e-721eb624 .trigger-toggle > i
{
	font-size: 18px;
}

/* ========================================== */
/* ===== ANSWER ============================= */
/* ========================================== */

.e-721eb624 .answer
{
	overflow: hidden;
	animation: e-721eb624-expand 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-721eb624-expand
{
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}

.e-721eb624 > .holder.variant-flat .answer-inner
{
	padding: 0 4px 22px;
}

.e-721eb624 > .holder.variant-card .answer-inner
{
	padding: 0 24px 22px;
}

.e-721eb624 .answer-inner
{
	font-size: 14.5px;
	line-height: 1.7;
	color: var(--ot-text-2);
	max-width: 760px;
}

.e-721eb624 .answer-inner > p
{
	margin: 0 0 14px;
}

.e-721eb624 .answer-inner > p:last-child
{
	margin-bottom: 0;
}

.e-721eb624 .answer-inner strong
{
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-721eb624 .answer-inner em
{
	font-style: italic;
}

.e-721eb624 .answer-inner a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 180ms;
}

.e-721eb624 .answer-inner a:hover
{
	color: var(--ot-brand-hover);
}

.e-721eb624 .answer-inner ul,
.e-721eb624 .answer-inner ol
{
	margin: 0 0 14px;
	padding-left: 22px;
}

.e-721eb624 .answer-inner li
{
	margin: 4px 0;
}

.e-721eb624 .answer-inner ul > li::marker
{
	color: var(--ot-brand);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 700px)
{
	.e-721eb624 .trigger
	{
		gap: 14px;
		padding: 18px 4px;
	}

	.e-721eb624 > .holder.variant-card .trigger
	{
		padding: 18px 20px;
	}

	.e-721eb624 .trigger-question
	{
		font-size: 16px;
	}

	.e-721eb624 .answer-inner
	{
		font-size: 13.5px;
	}
}
.e-6958209
{
	display: block;
	width: 100%;
}

/* ========================================== */
/* ===== GRID VARIANT (default) ============= */
/* ========================================== */

.e-6958209 > .holder.variant-grid
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 3), 1fr);
	gap: 32px 36px;
}

/* ========================================== */
/* ===== LIST VARIANT ======================= */
/* ========================================== */

.e-6958209 > .holder.variant-list
{
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.e-6958209 > .holder.variant-list .items
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 6px 24px;
}

/* ========================================== */
/* ===== GROUP ============================== */
/* ========================================== */

.e-6958209 .group
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
}

/* Group head */

.e-6958209 .group-head
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-6958209 .group-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: var(--ot-brand-opacity);
	flex-shrink: 0;
}

.e-6958209 .group-icon > i
{
	font-size: 17px;
	color: var(--ot-brand);
}

.e-6958209 .group-title
{
	font-family: var(--ot-font-secondary);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

/* ========================================== */
/* ===== ITEMS LIST ========================= */
/* ========================================== */

.e-6958209 .items
{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-6958209 .item
{
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 4px 0;
}

/* Item mark (check icon) */

.e-6958209 .item-mark
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	color: var(--ot-text-3);
	margin-top: 1px;
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6958209 .item-mark > i
{
	font-size: 16px;
}

.e-6958209 .item.is-highlight .item-mark
{
	color: var(--ot-brand);
}

.e-6958209 .item.is-highlight .item-mark > i
{
	font-variation-settings: 'FILL' 1;
}

/* Item text */

.e-6958209 .item-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.4;
}

.e-6958209 .item-label
{
	font-size: 13.5px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-6958209 .item.is-highlight .item-label
{
	font-weight: 600;
}

.e-6958209 .item-note
{
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

/* ========================================== */
/* ===== PILLS VARIANT ====================== */
/* ========================================== */

.e-6958209 > .holder.variant-pills
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.e-6958209 > .holder.variant-pills .group
{
	gap: 12px;
}

.e-6958209 > .holder.variant-pills .group-head
{
	border-bottom: 0;
	padding-bottom: 0;
}

.e-6958209 > .holder.variant-pills .group-title
{
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-6958209 > .holder.variant-pills .group-icon
{
	width: 24px;
	height: 24px;
	border-radius: 6px;
}

.e-6958209 > .holder.variant-pills .group-icon > i
{
	font-size: 14px;
}

.e-6958209 > .holder.variant-pills .items
{
	flex-direction: row;
	flex-wrap: wrap;
	gap: 6px;
}

.e-6958209 > .holder.variant-pills .item
{
	padding: 6px 12px 6px 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	gap: 6px;
	align-items: center;
}

.e-6958209 > .holder.variant-pills .item-mark
{
	width: 16px;
	height: 16px;
	margin: 0;
	color: var(--ot-brand);
}

.e-6958209 > .holder.variant-pills .item-mark > i
{
	font-size: 13px;
}

.e-6958209 > .holder.variant-pills .item-text
{
	flex-direction: row;
	align-items: baseline;
	gap: 5px;
}

.e-6958209 > .holder.variant-pills .item-label
{
	font-size: 12px;
}

.e-6958209 > .holder.variant-pills .item-note
{
	display: none;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 900px)
{
	.e-6958209 > .holder.variant-grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-6958209 > .holder.variant-list .items
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 500px)
{
	.e-6958209 > .holder.variant-grid
	{
		grid-template-columns: 1fr;
	}
}
.e-3427fe60
{
	display: block;
	width: 100%;
}

.e-3427fe60 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* ========================================== */
/* ===== SECTORS ============================ */
/* ========================================== */

.e-3427fe60 .sectors
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	overflow-x: auto;
	scrollbar-width: none;
	padding-bottom: 2px;
}

.e-3427fe60 .sectors::-webkit-scrollbar
{
	display: none;
}

.e-3427fe60 .sector-pill
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px 9px 14px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-2);
	letter-spacing: 0.005em;
	cursor: pointer;
	white-space: nowrap;
	flex-shrink: 0;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, border-color 220ms;
}

.e-3427fe60 .sector-pill:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-3-border);
}

.e-3427fe60 .sector-pill.is-active
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-3427fe60 .sector-pill > i
{
	font-size: 16px;
	color: var(--ot-text-3);
	transition: color 220ms;
}

.e-3427fe60 .sector-pill:hover > i
{
	color: var(--ot-brand);
}

.e-3427fe60 .sector-pill.is-active > i
{
	color: var(--ot-bg-1);
}

/* ========================================== */
/* ===== GRID =============================== */
/* ========================================== */

.e-3427fe60 .grid
{
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 12px;
	min-height: 540px;
}

/* ===== HERO IMAGE ===== */

.e-3427fe60 .hero
{
	position: relative;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	cursor: pointer;
	background: var(--ot-bg-3);
}

.e-3427fe60 .hero-cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3427fe60 .hero:hover .hero-cover
{
	transform: scale(1.04);
}

.e-3427fe60 .hero::after
{
	content: '';
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.0) 50%, rgba(20, 18, 16, 0.55) 100%),
		linear-gradient(0deg, rgba(20, 18, 16, 0.18) 0%, transparent 35%);
	pointer-events: none;
}

/* ===== THUMBS ===== */

.e-3427fe60 .thumbs
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 12px;
}

.e-3427fe60 .thumb
{
	position: relative;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	cursor: pointer;
	background: var(--ot-bg-3);
	min-height: 0;
}

.e-3427fe60 .thumb-cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1100ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3427fe60 .thumb:hover .thumb-cover
{
	transform: scale(1.05);
}

.e-3427fe60 .thumb::after
{
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.0) 60%, rgba(20, 18, 16, 0.4) 100%);
	pointer-events: none;
}

/* ========================================== */
/* ===== CHIPS (sector / tag / badge) ======= */
/* ========================================== */

.e-3427fe60 .sector-chip
{
	position: absolute;
	top: 18px;
	left: 18px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 13px 7px 11px;
	background: rgba(255, 254, 252, 0.94);
	backdrop-filter: blur(10px) saturate(180%);
	-webkit-backdrop-filter: blur(10px) saturate(180%);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-3427fe60 .sector-chip > i
{
	font-size: 13px;
	color: var(--ot-brand);
}

/* Tag (gore desno na hero) */

.e-3427fe60 .tag-chip
{
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 2;
	padding: 7px 13px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* Badge (privremena napomena, npr. "Samo još jedna soba") */

.e-3427fe60 .badge-chip
{
	position: absolute;
	bottom: 18px;
	right: 18px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px 8px 12px;
	background: rgba(20, 18, 16, 0.65);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-3427fe60 .badge-pulse
{
	position: relative;
	display: inline-flex;
	width: 7px;
	height: 7px;
	background: var(--ot-brand);
	border-radius: 50%;
	flex-shrink: 0;
}

.e-3427fe60 .badge-pulse::before
{
	content: '';
	position: absolute;
	inset: -2px;
	background: var(--ot-brand);
	border-radius: 50%;
	opacity: 0.6;
	animation: e-3427fe60-pulse 1.8s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}

@keyframes e-3427fe60-pulse
{
	0%   { transform: scale(1);   opacity: 0.6; }
	70%  { transform: scale(2.2); opacity: 0; }
	100% { transform: scale(2.2); opacity: 0; }
}

/* Hero caption (preko slike) */

.e-3427fe60 .hero-caption
{
	position: absolute;
	left: 28px;
	right: 200px;
	bottom: 24px;
	z-index: 2;
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 400;
	letter-spacing: -0.018em;
	line-height: 1.2;
	color: white;
	font-variation-settings: 'opsz' 144;
	text-shadow: 0 2px 12px rgba(20, 18, 16, 0.4);
}

/* ===== SEE-ALL CTA ===== */

.e-3427fe60 .see-all
{
	position: absolute;
	bottom: 24px;
	right: 24px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px 10px 14px;
	background: rgba(255, 254, 252, 0.94);
	backdrop-filter: blur(12px) saturate(180%);
	-webkit-backdrop-filter: blur(12px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 100px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, gap 240ms, transform 240ms;
}

.e-3427fe60 .see-all:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
	gap: 10px;
	transform: translateY(-1px);
}

.e-3427fe60 .see-all > i
{
	font-size: 16px;
}

.e-3427fe60 .see-all-count
{
	display: inline-flex;
	align-items: center;
	min-width: 22px;
	padding: 1px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 10.5px;
	font-weight: 500;
	color: white;
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
}

/* ===== THUMB CHIPS ===== */

.e-3427fe60 .thumb-tag
{
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	padding: 5px 10px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-3427fe60 .thumb-badge
{
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 9px 5px 8px;
	background: rgba(20, 18, 16, 0.7);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-3427fe60 .thumb-caption
{
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 12px;
	z-index: 2;
	font-size: 11.5px;
	font-weight: 600;
	color: white;
	letter-spacing: 0.005em;
	text-shadow: 0 1px 8px rgba(20, 18, 16, 0.4);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* Last thumb "+N more" overlay */

.e-3427fe60 .thumb-more
{
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	background: rgba(20, 18, 16, 0.72);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	color: white;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3427fe60 .thumb:hover .thumb-more
{
	background: rgba(20, 18, 16, 0.85);
}

.e-3427fe60 .thumb-more-count
{
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 400;
	letter-spacing: -0.025em;
	font-variation-settings: 'opsz' 144;
	line-height: 1;
}

.e-3427fe60 .thumb-more-label
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	opacity: 0.85;
}

/* ===== EMPTY STATE ===== */

.e-3427fe60 .empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 280px;
	padding: 40px;
	background: var(--ot-bg-2);
	border: 1px dashed var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	color: var(--ot-text-3);
	font-size: 13px;
	font-weight: 500;
}

.e-3427fe60 .empty > i
{
	font-size: 32px;
	opacity: 0.6;
}

/* ========================================== */
/* ===== LIGHTBOX =========================== */
/* ========================================== */

.e-3427fe60 .lightbox
{
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(15, 13, 11, 0.94);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	animation: e-3427fe60-fade 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-3427fe60-fade
{
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* Close button */

.e-3427fe60 .lightbox-close
{
	position: fixed;
	top: 24px;
	right: 24px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 50%;
	color: white;
	cursor: pointer;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms;
}

.e-3427fe60 .lightbox-close:hover
{
	background: white;
	color: var(--ot-text-1);
	transform: rotate(90deg);
}

.e-3427fe60 .lightbox-close > i
{
	font-size: 22px;
}

/* Counter */

.e-3427fe60 .lightbox-counter
{
	position: fixed;
	top: 32px;
	left: 32px;
	z-index: 2;
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	color: white;
	font-family: var(--ot-font-secondary);
	font-variation-settings: 'opsz' 144;
}

.e-3427fe60 .lightbox-counter-num
{
	font-size: 24px;
	font-weight: 500;
	letter-spacing: -0.025em;
}

.e-3427fe60 .lightbox-counter-sep
{
	font-size: 16px;
	opacity: 0.5;
}

.e-3427fe60 .lightbox-counter-total
{
	font-size: 15px;
	opacity: 0.6;
}

/* Arrows */

.e-3427fe60 .lightbox-arrow
{
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	color: white;
	cursor: pointer;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), border-color 220ms, transform 220ms;
}

.e-3427fe60 .lightbox-arrow:hover
{
	background: white;
	color: var(--ot-text-1);
	border-color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-3427fe60 .lightbox-arrow-prev { left: 32px; }
.e-3427fe60 .lightbox-arrow-next { right: 32px; }

.e-3427fe60 .lightbox-arrow > i
{
	font-size: 22px;
}

/* Stage (image + info) */

.e-3427fe60 .lightbox-stage
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	max-width: calc(100vw - 200px);
	max-height: calc(100vh - 100px);
}

.e-3427fe60 .lightbox-stage > img
{
	max-width: 100%;
	max-height: calc(100vh - 200px);
	height: auto;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 24px 80px -20px rgba(0, 0, 0, 0.6);
	display: block;
}

/* Lightbox info row */

.e-3427fe60 .lightbox-info
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	max-width: 720px;
	text-align: center;
}

.e-3427fe60 .lightbox-info-chips
{
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}

.e-3427fe60 .lightbox-chip
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px 6px 10px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-3427fe60 .lightbox-chip > i
{
	font-size: 13px;
	opacity: 0.85;
}

.e-3427fe60 .lightbox-chip-tag
{
	background: var(--ot-brand);
	border-color: transparent;
}

.e-3427fe60 .lightbox-chip-badge
{
	background: rgba(255, 255, 255, 0.06);
}

.e-3427fe60 .lightbox-caption
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: -0.012em;
	color: rgba(255, 255, 255, 0.92);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 1100px)
{
	.e-3427fe60 .grid
	{
		grid-template-columns: 1fr;
		grid-template-rows: 380px 280px;
		min-height: auto;
	}

	.e-3427fe60 .thumbs
	{
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: 1fr;
	}

	.e-3427fe60 .hero-caption
	{
		font-size: 18px;
		left: 20px;
		right: 160px;
		bottom: 18px;
	}
}

@media (max-width: 700px)
{
	.e-3427fe60 .grid
	{
		grid-template-rows: 320px auto;
		gap: 8px;
	}

	.e-3427fe60 .thumbs
	{
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: 1fr 1fr;
	}

	.e-3427fe60 .hero-caption
	{
		display: none;
	}

	.e-3427fe60 .see-all
	{
		bottom: 16px;
		right: 16px;
	}

	.e-3427fe60 .lightbox-close
	{
		top: 16px;
		right: 16px;
		width: 40px;
		height: 40px;
	}

	.e-3427fe60 .lightbox-counter
	{
		top: 22px;
		left: 16px;
	}

	.e-3427fe60 .lightbox-counter-num { font-size: 20px; }
	.e-3427fe60 .lightbox-counter-total { font-size: 13px; }

	.e-3427fe60 .lightbox-arrow
	{
		width: 44px;
		height: 44px;
	}

	.e-3427fe60 .lightbox-arrow-prev { left: 12px; }
	.e-3427fe60 .lightbox-arrow-next { right: 12px; }

	.e-3427fe60 .lightbox-stage
	{
		max-width: calc(100vw - 32px);
	}
}
.e-dd65207
{
	display: block;
	width: 100%;
}

/* ========================================== */
/* ===== CHIPS VARIANT (default) ============ */
/* ========================================== */

.e-dd65207 > .holder.variant-chips
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.e-dd65207 > .holder.variant-chips .item
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px 9px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), border-color 220ms;
}

.e-dd65207 > .holder.variant-chips .item:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-3-border);
}

.e-dd65207 > .holder.variant-chips .item-icon
{
	display: inline-flex;
	font-size: 16px;
	color: var(--ot-brand);
	flex-shrink: 0;
	font-variation-settings: 'FILL' 0;
}

/* Accent variants on chips */

.e-dd65207 > .holder.variant-chips .item.accent-brand
{
	background: var(--ot-brand-opacity);
	border-color: transparent;
}

.e-dd65207 > .holder.variant-chips .item.accent-brand .item-icon,
.e-dd65207 > .holder.variant-chips .item.accent-brand .item-label
{
	color: var(--ot-brand);
}

.e-dd65207 > .holder.variant-chips .item.accent-green
{
	background: rgba(20, 144, 95, 0.1);
	border-color: transparent;
}

.e-dd65207 > .holder.variant-chips .item.accent-green .item-icon,
.e-dd65207 > .holder.variant-chips .item.accent-green .item-label
{
	color: rgba(20, 144, 95, 1);
}

.e-dd65207 > .holder.variant-chips .item.accent-gold
{
	background: rgba(170, 130, 60, 0.1);
	border-color: transparent;
}

.e-dd65207 > .holder.variant-chips .item.accent-gold .item-icon,
.e-dd65207 > .holder.variant-chips .item.accent-gold .item-label
{
	color: rgba(170, 130, 60, 1);
}

.e-dd65207 > .holder.variant-chips .item.accent-dark
{
	background: var(--ot-text-1);
	border-color: var(--ot-text-1);
}

.e-dd65207 > .holder.variant-chips .item.accent-dark .item-icon,
.e-dd65207 > .holder.variant-chips .item.accent-dark .item-label
{
	color: var(--ot-bg-1);
}

/* ========================================== */
/* ===== BULLETS VARIANT (inline · row) ===== */
/* ========================================== */

.e-dd65207 > .holder.variant-bullets
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 18px;
}

.e-dd65207 > .holder.variant-bullets .item
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-2);
	letter-spacing: -0.005em;
	position: relative;
}

.e-dd65207 > .holder.variant-bullets .item:not(:last-child)::after
{
	content: '';
	position: absolute;
	right: -12px;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 3px;
	background: var(--ot-bg-3-border);
	border-radius: 50%;
}

.e-dd65207 > .holder.variant-bullets .item-icon
{
	font-size: 16px;
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-dd65207 > .holder.variant-bullets .item.accent-green .item-icon { color: rgba(20, 144, 95, 1); }
.e-dd65207 > .holder.variant-bullets .item.accent-gold  .item-icon { color: rgba(170, 130, 60, 1); }
.e-dd65207 > .holder.variant-bullets .item.accent-dark  .item-icon { color: var(--ot-text-1); }
.e-dd65207 > .holder.variant-bullets .item.accent-brand .item-icon { color: var(--ot-brand); }

/* ========================================== */
/* ===== CARDS VARIANT (mini cards row) ===== */
/* ========================================== */

.e-dd65207 > .holder.variant-cards
{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
}

.e-dd65207 > .holder.variant-cards .item
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-dd65207 > .holder.variant-cards .item:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-dd65207 > .holder.variant-cards .item-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	font-size: 18px;
	flex-shrink: 0;
}

.e-dd65207 > .holder.variant-cards .item-label
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-dd65207 > .holder.variant-cards .item.accent-green .item-icon { background: rgba(20, 144, 95, 0.12); color: rgba(20, 144, 95, 1); }
.e-dd65207 > .holder.variant-cards .item.accent-gold  .item-icon { background: rgba(170, 130, 60, 0.12); color: rgba(170, 130, 60, 1); }
.e-dd65207 > .holder.variant-cards .item.accent-dark  .item-icon { background: var(--ot-bg-2); color: var(--ot-text-1); }
.e-dd65207 > .holder.variant-cards .item.accent-brand .item-icon { background: var(--ot-brand-opacity); color: var(--ot-brand); }
.e-3479b6b6
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-3479b6b6 > .holder.variant-split
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-3479b6b6 > .holder.variant-stacked
{
	display: flex;
	flex-direction: column;
	gap: 0;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

/* ===== COLUMN ===== */

.e-3479b6b6 .column
{
	display: flex;
	flex-direction: column;
	padding: 28px 30px;
	min-width: 0;
	position: relative;
}

.e-3479b6b6 > .holder.variant-split .column-good
{
	border-right: 1px solid var(--ot-bg-2-border);
}

.e-3479b6b6 > .holder.variant-stacked .column-good
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* Top accent line per column */

.e-3479b6b6 .column::before
{
	content: '';
	position: absolute;
	top: 0;
	left: 30px;
	width: 56px;
	height: 2px;
}

.e-3479b6b6 .column-good::before
{
	background: rgba(20, 144, 95, 1);
}

.e-3479b6b6 .column-bad::before
{
	background: var(--ot-text-3);
}

/* ===== HEAD ===== */

.e-3479b6b6 .column-head
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.e-3479b6b6 .column-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	flex-shrink: 0;
}

.e-3479b6b6 .column-good .column-icon
{
	background: rgba(20, 144, 95, 0.12);
}

.e-3479b6b6 .column-bad .column-icon
{
	background: var(--ot-bg-2);
}

.e-3479b6b6 .column-icon > i
{
	font-size: 20px;
	font-variation-settings: 'FILL' 1;
}

.e-3479b6b6 .column-good .column-icon > i
{
	color: rgba(20, 144, 95, 1);
}

.e-3479b6b6 .column-bad .column-icon > i
{
	color: var(--ot-text-3);
}

.e-3479b6b6 .column-title
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

/* ===== ITEMS ===== */

.e-3479b6b6 .items
{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-3479b6b6 .item
{
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 6px 0;
}

/* Item mark */

.e-3479b6b6 .item-mark
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	flex-shrink: 0;
	margin-top: 2px;
}

.e-3479b6b6 .column-good .item-mark
{
	background: rgba(20, 144, 95, 0.12);
}

.e-3479b6b6 .column-bad .item-mark
{
	background: var(--ot-bg-2);
}

.e-3479b6b6 .item-mark > i
{
	font-size: 14px;
}

.e-3479b6b6 .column-good .item-mark > i
{
	color: rgba(20, 144, 95, 1);
}

.e-3479b6b6 .column-bad .item-mark > i
{
	color: var(--ot-text-3);
}

/* Item text */

.e-3479b6b6 .item-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
	line-height: 1.45;
}

.e-3479b6b6 .item-label
{
	font-size: 13.5px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-3479b6b6 .column-bad .item-label
{
	color: var(--ot-text-2);
}

.e-3479b6b6 .item-note
{
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

/* Item price (npr "doplata 280 €") */

.e-3479b6b6 .item-price
{
	display: inline-flex;
	align-items: center;
	padding: 3px 9px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
	letter-spacing: -0.005em;
	flex-shrink: 0;
	white-space: nowrap;
	margin-top: 2px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 700px)
{
	.e-3479b6b6 > .holder.variant-split
	{
		grid-template-columns: 1fr;
	}

	.e-3479b6b6 > .holder.variant-split .column-good
	{
		border-right: 0;
		border-bottom: 1px solid var(--ot-bg-2-border);
	}

	.e-3479b6b6 .column
	{
		padding: 22px 22px;
	}

	.e-3479b6b6 .column::before
	{
		left: 22px;
	}
}
.e-2721fb59
{
	display: block;
	width: 100%;
}

.e-2721fb59 > .holder
{
	display: flex;
	flex-direction: column;
}

/* ===== DAY ===== */

.e-2721fb59 .day
{
	display: flex;
	gap: 20px;
}

/* ===== MARKER (broj dana + linija) ===== */

.e-2721fb59 .day > .marker
{
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: none;
	width: 40px;
}

.e-2721fb59 .day > .marker > .number
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 600;
}

.e-2721fb59 .day > .marker > .line
{
	flex: 1;
	width: 1px;
	margin: 8px 0;
	background: var(--ot-bg-3-border);
}

.e-2721fb59 .day:last-child > .marker > .line
{
	display: none;
}

/* ===== BODY ===== */

.e-2721fb59 .day > .body
{
	flex: 1;
	min-width: 0;
	padding-bottom: 28px;
}

.e-2721fb59 .day:last-child > .body
{
	padding-bottom: 0;
}

.e-2721fb59 .day > .body > .title
{
	font-family: var(--ot-font-secondary);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	margin: 8px 0 6px;
}

.e-2721fb59 .day > .body > .prose
{
	font-size: 14px;
	line-height: 1.65;
	color: var(--ot-text-2);
}

.e-2721fb59 .day > .body > .prose p
{
	margin: 0 0 10px;
}

.e-2721fb59 .day > .body > .prose p:last-child
{
	margin-bottom: 0;
}
.e-728156ea
{
	display: block;
	width: 100%;
}

.e-728156ea > .holder
{
	width: 100%;
}

/* ===== LAYOUT ===== */

.e-728156ea .layout
{
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 0;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	min-height: 460px;
}

/* No aside (no distances/cities) — map spans full width. */

.e-728156ea .layout:not(:has(.aside))
{
	grid-template-columns: 1fr;
}

/* ========================================== */
/* ===== STAGE (map area) =================== */
/* ========================================== */

.e-728156ea .stage
{
	position: relative;
	background: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.e-728156ea .stage-map
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

/* Decorative grid (when no image) */

.e-728156ea .stage-grid
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(255, 254, 252, 0.0) 0%, rgba(255, 254, 252, 0.0) 100%),
		repeating-linear-gradient(0deg,   rgba(20, 18, 16, 0.04) 0,  rgba(20, 18, 16, 0.04) 1px, transparent 1px, transparent 60px),
		repeating-linear-gradient(90deg,  rgba(20, 18, 16, 0.04) 0,  rgba(20, 18, 16, 0.04) 1px, transparent 1px, transparent 60px),
		radial-gradient(circle at 50% 50%, var(--ot-bg-2) 0%, var(--ot-bg-3) 60%, var(--ot-bg-3) 100%);
}

.e-728156ea .stage:not(:has(.stage-map))::after
{
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 50% 50%, transparent 30%, rgba(20, 18, 16, 0.05) 70%, rgba(20, 18, 16, 0.18) 100%);
	pointer-events: none;
}

.e-728156ea .stage-map
{
	z-index: 1;
}

/* Address chip */

.e-728156ea .address-chip
{
	position: absolute;
	top: 22px;
	left: 22px;
	right: 22px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 12px 18px 12px 14px;
	background: rgba(255, 254, 252, 0.96);
	backdrop-filter: blur(12px) saturate(180%);
	-webkit-backdrop-filter: blur(12px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--ot-radius-m);
	max-width: fit-content;
}

.e-728156ea .address-icon
{
	font-size: 20px;
	color: var(--ot-brand);
	flex-shrink: 0;
	font-variation-settings: 'FILL' 1;
}

.e-728156ea .address-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-728156ea .address-title
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-728156ea .address-line
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* Pin (center) */

.e-728156ea .pin
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -100%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.e-728156ea .pin-icon
{
	position: relative;
	z-index: 3;
	font-size: 56px;
	color: var(--ot-brand);
	font-variation-settings: 'FILL' 1;
	filter: drop-shadow(0 4px 16px rgba(20, 18, 16, 0.25));
}

.e-728156ea .pin-pulse
{
	position: absolute;
	bottom: -6px;
	left: 50%;
	transform: translateX(-50%);
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--ot-brand);
	opacity: 0.4;
	animation: e-728156ea-pulse 2.4s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}

.e-728156ea .pin-pulse-2
{
	animation-delay: 1.2s;
}

@keyframes e-728156ea-pulse
{
	0%   { transform: translateX(-50%) scale(0.8); opacity: 0.5; }
	70%  { transform: translateX(-50%) scale(3.5); opacity: 0; }
	100% { transform: translateX(-50%) scale(3.5); opacity: 0; }
}

/* Open in maps link */

.e-728156ea .open-link
{
	position: absolute;
	bottom: 22px;
	right: 22px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px 9px 14px;
	background: rgba(255, 254, 252, 0.96);
	backdrop-filter: blur(12px) saturate(180%);
	-webkit-backdrop-filter: blur(12px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, gap 240ms, transform 240ms;
}

.e-728156ea .open-link:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
	gap: 10px;
	transform: translateY(-1px);
}

.e-728156ea .open-link > i
{
	font-size: 14px;
}

/* ========================================== */
/* ===== ASIDE (distances + cities) ========= */
/* ========================================== */

.e-728156ea .aside
{
	display: flex;
	flex-direction: column;
	gap: 0;
	border-left: 1px solid var(--ot-bg-2-border);
	min-width: 0;
}

.e-728156ea .distances
{
	padding: 24px 26px;
}

.e-728156ea .cities
{
	padding: 24px 26px;
	border-top: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

/* Aside heading */

.e-728156ea .aside-head
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 14px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-728156ea .aside-head > i
{
	font-size: 14px;
	color: var(--ot-brand);
}

/* Distances list */

.e-728156ea .items
{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-728156ea .item
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-728156ea .item:last-child
{
	border-bottom: 0;
}

.e-728156ea .item-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	background: var(--ot-bg-2);
	flex-shrink: 0;
}

.e-728156ea .item.is-highlight .item-icon
{
	background: var(--ot-brand-opacity);
}

.e-728156ea .item-icon > i
{
	font-size: 15px;
	color: var(--ot-text-2);
}

.e-728156ea .item.is-highlight .item-icon > i
{
	color: var(--ot-brand);
}

.e-728156ea .item-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1;
	line-height: 1.35;
}

.e-728156ea .item-label
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-728156ea .item.is-highlight .item-label
{
	font-weight: 600;
}

.e-728156ea .item-note
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

.e-728156ea .item-distance
{
	font-family: var(--ot-font-secondary);
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
	flex-shrink: 0;
	white-space: nowrap;
}

.e-728156ea .item.is-highlight .item-distance
{
	color: var(--ot-brand);
}

/* City pills */

.e-728156ea .city-pills
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-728156ea .city-pill
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px 6px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), border-color 200ms;
}

.e-728156ea .city-pill:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-3-border);
}

.e-728156ea .city-distance
{
	font-family: var(--ot-font-secondary);
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-728156ea .layout
	{
		grid-template-columns: 1fr;
		min-height: auto;
	}

	.e-728156ea .stage
	{
		min-height: 320px;
	}

	.e-728156ea .aside
	{
		border-left: 0;
		border-top: 1px solid var(--ot-bg-2-border);
	}

	.e-728156ea .pin-icon
	{
		font-size: 44px;
	}
}
.e-1b09e47d
{
	display: block;
	width: 100%;
}

.e-1b09e47d > .holder
{
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding: 32px 36px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
}

/* ===== HEAD ===== */

.e-1b09e47d .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.e-1b09e47d .brand
{
	display: flex;
	align-items: center;
	gap: 18px;
	min-width: 0;
}

.e-1b09e47d .brand-logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: var(--ot-radius-m);
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-1b09e47d .brand-logo-fallback > i
{
	font-size: 28px;
	color: var(--ot-text-3);
}

.e-1b09e47d .brand-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	line-height: 1.25;
}

.e-1b09e47d .brand-since
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-1b09e47d .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.018em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-1b09e47d .brand-tagline
{
	font-size: 12.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

/* Head CTA */

.e-1b09e47d .head-cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 20px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-bg-1);
	letter-spacing: 0.005em;
	flex-shrink: 0;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms;
}

.e-1b09e47d .head-cta:hover
{
	background: var(--ot-brand);
	gap: 12px;
}

.e-1b09e47d .head-cta > i
{
	font-size: 16px;
}

/* ===== DESCRIPTION ===== */

.e-1b09e47d .description
{
	font-size: 14px;
	line-height: 1.65;
	color: var(--ot-text-2);
	margin: 0;
	max-width: 760px;
}

/* ===== STATS ===== */

.e-1b09e47d .stats
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	padding: 18px 0;
	border-top: 1px solid var(--ot-bg-2-border);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-1b09e47d .stat
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 0 20px;
	position: relative;
	line-height: 1.2;
}

.e-1b09e47d .stat:first-child
{
	padding-left: 0;
}

.e-1b09e47d .stat:not(:last-child)::after
{
	content: '';
	position: absolute;
	right: 0;
	top: 4px;
	bottom: 4px;
	width: 1px;
	background: var(--ot-bg-2-border);
}

.e-1b09e47d .stat-value
{
	font-family: var(--ot-font-secondary);
	font-size: 28px;
	font-weight: 400;
	letter-spacing: -0.025em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-1b09e47d .stat-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	margin-top: 4px;
}

/* ===== FOOT ===== */

.e-1b09e47d .foot
{
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 28px;
}

/* License */

.e-1b09e47d .license
{
	display: flex;
	align-items: flex-start;
	gap: 12px;
	min-width: 0;
}

.e-1b09e47d .license-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: rgba(20, 144, 95, 0.12);
	flex-shrink: 0;
}

.e-1b09e47d .license-icon > i
{
	font-size: 19px;
	color: rgba(20, 144, 95, 1);
	font-variation-settings: 'FILL' 1;
}

.e-1b09e47d .license-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.4;
}

.e-1b09e47d .license-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-1b09e47d .license-code
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

.e-1b09e47d .license-issuer
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-1b09e47d .license-note
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	margin-top: 2px;
}

/* Contacts */

.e-1b09e47d .contacts
{
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.e-1b09e47d .contact
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px 10px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: inherit;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), border-color 200ms, transform 200ms;
}

.e-1b09e47d .contact:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-3-border);
	transform: translateY(-1px);
}

.e-1b09e47d .contact-icon
{
	font-size: 18px;
	color: var(--ot-brand);
}

.e-1b09e47d .contact-text
{
	display: flex;
	flex-direction: column;
	gap: 0;
	line-height: 1.3;
}

.e-1b09e47d .contact-label
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-1b09e47d .contact-value
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 800px)
{
	.e-1b09e47d > .holder
	{
		padding: 24px 22px;
	}

	.e-1b09e47d .head
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 18px;
	}

	.e-1b09e47d .stats
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 16px 0;
	}

	.e-1b09e47d .stat
	{
		padding: 0 14px;
	}

	.e-1b09e47d .stat:nth-child(2n)::after
	{
		display: none;
	}

	.e-1b09e47d .foot
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-1b09e47d .brand-name
	{
		font-size: 19px;
	}

	.e-1b09e47d .stat-value
	{
		font-size: 24px;
	}
}
.e-1bf3dc14
{
	display: block;
	width: 100%;
}

.e-1bf3dc14 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 28px;
}

/* ========================================== */
/* ===== STEPS (vertical timeline) ========== */
/* ========================================== */

.e-1bf3dc14 .steps
{
	display: flex;
	flex-direction: column;
	gap: 0;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	padding: 28px 30px;
}

.e-1bf3dc14 .step
{
	display: flex;
	gap: 18px;
	min-height: 72px;
}

/* Marker (number circle + connector line) */

.e-1bf3dc14 .step-marker
{
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-shrink: 0;
	width: 36px;
}

.e-1bf3dc14 .step-num
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-3-border);
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

.e-1bf3dc14 .step:first-child .step-num
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: white;
}

.e-1bf3dc14 .step-line
{
	flex: 1;
	width: 1px;
	background: var(--ot-bg-2-border);
	margin: 6px 0;
}

/* Body */

.e-1bf3dc14 .step-body
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-bottom: 22px;
	flex: 1;
	min-width: 0;
}

.e-1bf3dc14 .step:last-child .step-body
{
	padding-bottom: 0;
}

.e-1bf3dc14 .step-head
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.e-1bf3dc14 .step-icon
{
	font-size: 18px;
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-1bf3dc14 .step-title
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-1bf3dc14 .step-description
{
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
}

.e-1bf3dc14 .step-meta
{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 4px;
}

.e-1bf3dc14 .step-amount
{
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-brand);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

.e-1bf3dc14 .step-deadline
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

.e-1bf3dc14 .step-deadline > i
{
	font-size: 14px;
}

/* ========================================== */
/* ===== METHODS GRID ======================= */
/* ========================================== */

.e-1bf3dc14 .methods
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}

.e-1bf3dc14 .method
{
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 18px 20px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-1bf3dc14 .method:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-1bf3dc14 .method-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: var(--ot-bg-2);
	flex-shrink: 0;
}

.e-1bf3dc14 .method-icon > i
{
	font-size: 19px;
	color: var(--ot-text-1);
}

.e-1bf3dc14 .method-text
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	line-height: 1.4;
}

.e-1bf3dc14 .method-title
{
	font-family: var(--ot-font-secondary);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-1bf3dc14 .method-description
{
	font-size: 12.5px;
	font-weight: 500;
	color: var(--ot-text-2);
	margin: 0;
}

.e-1bf3dc14 .method-note
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
	margin-top: 2px;
}

/* ========================================== */
/* ===== NOTICE ============================= */
/* ========================================== */

.e-1bf3dc14 .notice
{
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 18px 22px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	border-left: 3px solid var(--ot-brand);
}

.e-1bf3dc14 .notice-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-top: 2px;
}

.e-1bf3dc14 .notice-icon > i
{
	font-size: 20px;
	color: var(--ot-brand);
}

.e-1bf3dc14 .notice-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	flex: 1;
}

.e-1bf3dc14 .notice-title
{
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 700;
	color: var(--ot-text-1);
	margin: 0;
	letter-spacing: -0.005em;
}

.e-1bf3dc14 .notice-message
{
	font-size: 12.5px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
}

/* ===== RESPONSIVE ===== */

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

	.e-1bf3dc14 .steps
	{
		padding: 22px 20px;
	}
}
.e-5d54262c
{
	display: block;
	width: 100%;
}

.e-5d54262c > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* ===== TABLE ===== */

.e-5d54262c .table
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

/* ===== HEAD ===== */

.e-5d54262c .table-head
{
	display: grid;
	grid-template-columns: 2fr 1.4fr 1.2fr 1fr;
	gap: 0;
	padding: 14px 24px;
	background: var(--ot-bg-2);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-5d54262c .head-cell
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-5d54262c .head-cell-price
{
	text-align: right;
}

/* ===== ROW ===== */

.e-5d54262c .table-body
{
	display: flex;
	flex-direction: column;
}

.e-5d54262c .row
{
	display: grid;
	grid-template-columns: 2fr 1.4fr 1.2fr 1fr;
	gap: 0;
	align-items: center;
	padding: 18px 24px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1);
	position: relative;
}

.e-5d54262c .row:last-child
{
	border-bottom: 0;
}

.e-5d54262c .row:hover
{
	background: var(--ot-bg-2);
}

.e-5d54262c .row.status-sold
{
	opacity: 0.55;
}

.e-5d54262c .row.has-badge::before
{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 2px;
	background: var(--ot-brand);
}

/* ===== CELL ===== */

.e-5d54262c .cell
{
	min-width: 0;
}

/* Period */

.e-5d54262c .cell-period
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	line-height: 1.3;
}

.e-5d54262c .period-value
{
	font-family: var(--ot-font-secondary);
	font-size: 16px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.012em;
	font-variation-settings: 'opsz' 144;
}

.e-5d54262c .period-days
{
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-5d54262c .period-badge
{
	display: inline-flex;
	align-items: center;
	width: fit-content;
	padding: 3px 9px;
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-top: 4px;
}

.e-5d54262c .period-badge.tone-brand  { background: var(--ot-brand-opacity);    color: var(--ot-brand); }
.e-5d54262c .period-badge.tone-dark   { background: var(--ot-text-1);            color: var(--ot-bg-1); }
.e-5d54262c .period-badge.tone-green  { background: rgba(20, 144, 95, 0.12);     color: rgba(20, 144, 95, 1); }
.e-5d54262c .period-badge.tone-gold   { background: rgba(170, 130, 60, 0.12);    color: rgba(170, 130, 60, 1); }

/* Room */

.e-5d54262c .cell-room
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13.5px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-5d54262c .cell-room > .cell-icon
{
	font-size: 17px;
	color: var(--ot-text-3);
}

/* Price */

.e-5d54262c .cell-price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 1px;
	line-height: 1.0;
	text-align: right;
}

.e-5d54262c .price-old
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-decoration: line-through;
	margin-bottom: 2px;
}

.e-5d54262c .price-row
{
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
}

.e-5d54262c .price-from
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-5d54262c .price-value
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.018em;
	font-variation-settings: 'opsz' 144;
}

.e-5d54262c .price-savings
{
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-brand);
	letter-spacing: 0.005em;
	margin-top: 4px;
}

/* Status */

.e-5d54262c .cell-status
{
	display: flex;
	justify-content: flex-end;
}

.e-5d54262c .status-pill
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px 6px 10px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-5d54262c .status-pill > i
{
	font-size: 13px;
	font-variation-settings: 'FILL' 1;
}

/* Status colors */

.e-5d54262c .row.status-available .status-pill
{
	background: rgba(20, 144, 95, 0.12);
	color: rgba(20, 144, 95, 1);
}

.e-5d54262c .row.status-last .status-pill
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.e-5d54262c .row.status-sold .status-pill
{
	background: var(--ot-bg-3);
	color: var(--ot-text-3);
}

.e-5d54262c .row.status-soon .status-pill
{
	background: rgba(170, 130, 60, 0.12);
	color: rgba(170, 130, 60, 1);
}

/* ===== NOTE ===== */

.e-5d54262c .note
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
	margin: 0;
	padding: 0 4px;
}

.e-5d54262c .note > i
{
	font-size: 14px;
	color: var(--ot-text-3);
}

/* ===== RESPONSIVE (cards on mobile) ===== */

@media (max-width: 800px)
{
	.e-5d54262c .table-head
	{
		display: none;
	}

	.e-5d54262c .row
	{
		grid-template-columns: 1fr 1fr;
		gap: 12px 16px;
		padding: 18px 20px;
	}

	.e-5d54262c .cell-period
	{
		grid-column: 1 / -1;
		padding-bottom: 12px;
		border-bottom: 1px solid var(--ot-bg-2-border);
	}

	.e-5d54262c .cell-room
	{
		grid-column: 1 / 2;
	}

	.e-5d54262c .cell-status
	{
		grid-column: 2 / 3;
	}

	.e-5d54262c .cell-price
	{
		grid-column: 1 / -1;
		align-items: flex-start;
		text-align: left;
	}
}
.e-34a8e4c8
{
	display: block;
	width: 100%;
}

.e-34a8e4c8 > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 2), 1fr);
	gap: 24px;
}

.e-34a8e4c8 .stay
{
	display: flex;
	flex-direction: column;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-1);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-34a8e4c8 .stay:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-34a8e4c8 .cover
{
	width: 100%;
	aspect-ratio: 16 / 10;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
}

.e-34a8e4c8 .body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 22px 22px;
}

.e-34a8e4c8 .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.e-34a8e4c8 .name
{
	font-family: var(--ot-font-secondary);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-34a8e4c8 .stars
{
	display: inline-flex;
	gap: 1px;
	flex-shrink: 0;
}

.e-34a8e4c8 .stars > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 15px;
	color: #e8a33d;
	font-variation-settings: 'FILL' 1;
}

.e-34a8e4c8 .description
{
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--ot-text-2);
	margin: 0;
}

.e-34a8e4c8 .features
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 2px;
}

.e-34a8e4c8 .feature
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 11px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-34a8e4c8 .feature > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 15px;
	opacity: 0.7;
}

.e-34a8e4c8 .rooms-cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
	padding: 12px 18px;
	background: var(--ot-text-1);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-bg-1);
	cursor: pointer;
	align-self: flex-start;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), gap 220ms;
}

.e-34a8e4c8 .rooms-cta:hover
{
	background: var(--ot-brand);
	gap: 12px;
}

.e-34a8e4c8 .rooms-cta > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
}

.e-34a8e4c8 .rooms-cta > .arrow
{
	font-size: 16px;
}

@media (max-width: 900px)
{
	.e-34a8e4c8 > .holder
	{
		grid-template-columns: 1fr;
	}
}

/* ==========================================================
   ROOMS MODAL — global (rendered on body via $ot.modal).
   ========================================================== */

.e-34a8e4c8-modal
{
	display: flex;
	flex-direction: column;
	max-height: 80vh;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-34a8e4c8-modal > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 24px;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-34a8e4c8-modal > .head > .title
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 500;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-34a8e4c8-modal > .head > .title > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	color: var(--ot-brand);
}

.e-34a8e4c8-modal > .head > .close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 180ms, color 180ms;
}

.e-34a8e4c8-modal > .head > .close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-34a8e4c8-modal > .head > .close > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
}

.e-34a8e4c8-modal > .body
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 20px 24px 24px;
	overflow-y: auto;
}

.e-34a8e4c8-modal .room
{
	display: grid;
	grid-template-columns: 120px 1fr auto;
	gap: 16px;
	align-items: center;
	padding: 14px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

.e-34a8e4c8-modal .room-cover
{
	width: 120px;
	height: 90px;
	border-radius: var(--ot-radius-s);
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
}

.e-34a8e4c8-modal .room-body
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.e-34a8e4c8-modal .room-name
{
	font-size: 15px;
	font-weight: 700;
	color: var(--ot-text-1);
	margin: 0;
}

.e-34a8e4c8-modal .room-desc
{
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--ot-text-2);
	margin: 0;
}

.e-34a8e4c8-modal .room-meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 2px;
}

.e-34a8e4c8-modal .room-meta > .chip
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 9px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-34a8e4c8-modal .room-meta > .chip > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 14px;
}

.e-34a8e4c8-modal .room-price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	flex-shrink: 0;
}

.e-34a8e4c8-modal .room-price > .from
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-34a8e4c8-modal .room-price > .amount
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	color: var(--ot-brand);
	font-variation-settings: 'opsz' 144;
}

@media (max-width: 600px)
{
	.e-34a8e4c8-modal .room
	{
		grid-template-columns: 1fr;
		text-align: left;
	}

	.e-34a8e4c8-modal .room-cover
	{
		width: 100%;
		height: 140px;
	}

	.e-34a8e4c8-modal .room-price
	{
		align-items: flex-start;
	}
}
.e-1669e408
{
	display: block;
	width: 100%;
}

/* ===== HOLDER (sticky) ===== */

.e-1669e408 > .holder
{
	position: sticky;
	top: var(--sticky-top, 76px);
	z-index: 50;
	margin: 0 -8px;
	padding: 8px 8px;
	background: linear-gradient(180deg, var(--ot-bg-1) 70%, transparent 100%);
}

/* ===== BAR ===== */

.e-1669e408 .bar
{
	position: relative;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	overflow: hidden;
}

/* Subtle edge fade for horizontal scroll */

.e-1669e408 .bar::before,
.e-1669e408 .bar::after
{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 32px;
	z-index: 2;
	pointer-events: none;
	opacity: 0;
	transition: opacity 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-1669e408 .bar::before
{
	left: 0;
	background: linear-gradient(90deg, var(--ot-bg-1) 0%, transparent 100%);
}

.e-1669e408 .bar::after
{
	right: 0;
	background: linear-gradient(90deg, transparent 0%, var(--ot-bg-1) 100%);
}

/* ===== TRACK (horizontal scroll on mobile) ===== */

.e-1669e408 .track
{
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 6px;
	overflow-x: auto;
	scrollbar-width: none;
}

.e-1669e408 .track::-webkit-scrollbar
{
	display: none;
}

/* ===== TAB ===== */

.e-1669e408 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px 11px 16px;
	background: transparent;
	border: 0;
	border-radius: 100px;
	color: var(--ot-text-2);
	cursor: pointer;
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.005em;
	white-space: nowrap;
	flex-shrink: 0;
	position: relative;
	transition: background 280ms cubic-bezier(0.22, 1, 0.36, 1), color 280ms;
}

.e-1669e408 .tab:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-1669e408 .tab.is-active
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	font-weight: 600;
}

/* ===== TAB ICON ===== */

.e-1669e408 .tab-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	color: var(--ot-text-3);
	transition: color 280ms;
}

.e-1669e408 .tab:hover .tab-icon
{
	color: var(--ot-brand);
}

.e-1669e408 .tab.is-active .tab-icon
{
	color: var(--ot-bg-1);
}

/* ===== TAB LABEL ===== */

.e-1669e408 .tab-label
{
	letter-spacing: -0.005em;
}

/* ===== TAB COUNT ===== */

.e-1669e408 .tab-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	padding: 1px 7px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 10.5px;
	font-weight: 500;
	color: var(--ot-text-2);
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
	transition: background 280ms cubic-bezier(0.22, 1, 0.36, 1), color 280ms;
}

.e-1669e408 .tab.is-active .tab-count
{
	background: rgba(255, 254, 252, 0.18);
	color: var(--ot-bg-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-1669e408 > .holder
	{
		top: var(--sticky-top, 64px);
	}

	.e-1669e408 .bar::before,
	.e-1669e408 .bar::after
	{
		opacity: 1;
	}

	.e-1669e408 .tab
	{
		padding: 10px 14px 10px 12px;
		font-size: 12.5px;
	}
}
.e-58cd9997
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-58cd9997 > .holder
{
	position: relative;
	display: flex;
	align-items: stretch;
	min-height: 280px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-3);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-58cd9997 > .holder:hover
{
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-58cd9997 > .holder > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-58cd9997 > .holder > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-58cd9997 > .holder:hover > .cover::before
{
	transform: scale(1.05);
}

.e-58cd9997 > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Tones */

.e-58cd9997 > .holder.tone-dark > .cover > .cover-overlay
{
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.25) 0%, rgba(20, 18, 16, 0.45) 60%, rgba(20, 18, 16, 0.78) 100%);
}

.e-58cd9997 > .holder.tone-light > .cover > .cover-overlay
{
	background: linear-gradient(180deg, rgba(255, 254, 252, 0.0) 0%, rgba(255, 254, 252, 0.6) 65%, rgba(255, 254, 252, 0.92) 100%);
}

.e-58cd9997 > .holder.tone-brand > .cover > .cover-overlay
{
	background: linear-gradient(180deg, color-mix(in srgb, var(--ot-brand) 50%, transparent) 0%, color-mix(in srgb, var(--ot-brand) 85%, transparent) 100%);
}

.e-58cd9997 > .holder.tone-gold > .cover > .cover-overlay
{
	background: linear-gradient(180deg, rgba(170, 130, 60, 0.5) 0%, rgba(170, 130, 60, 0.85) 100%);
}

/* No-image: pure tone background */

.e-58cd9997 > .holder.no-image
{
	background: var(--ot-bg-2);
}

.e-58cd9997 > .holder.no-image.tone-dark   { background: var(--ot-text-1); color: white; }
.e-58cd9997 > .holder.no-image.tone-light  { background: var(--ot-bg-2); }
.e-58cd9997 > .holder.no-image.tone-brand  { background: var(--ot-brand); color: white; }
.e-58cd9997 > .holder.no-image.tone-gold   { background: rgba(170, 130, 60, 1); color: white; }

/* Gradient variant — auto-applies gradient when no-image */

.e-58cd9997 > .holder.gradient
{
	background:
		linear-gradient(135deg, var(--ot-text-1) 0%, rgba(60, 50, 40, 1) 100%);
	color: white;
}

.e-58cd9997 > .holder.gradient.tone-brand
{
	background:
		linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);
}

.e-58cd9997 > .holder.gradient.tone-gold
{
	background:
		linear-gradient(135deg, rgba(170, 130, 60, 1) 0%, rgba(120, 90, 40, 1) 100%);
}

/* ===== CONTENT ===== */

.e-58cd9997 > .holder > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px 36px;
	width: 100%;
	justify-content: flex-end;
}

.e-58cd9997 > .holder.align-center > .content
{
	align-items: center;
	text-align: center;
}

.e-58cd9997 .content-top
{
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.e-58cd9997 > .holder.align-center .content-top
{
	justify-content: center;
}

/* Meta chip */

.e-58cd9997 .meta
{
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	background: rgba(255, 254, 252, 0.96);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-58cd9997 > .holder.tone-light .meta
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

/* Eyebrow */

.e-58cd9997 .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-58cd9997 > .holder.tone-dark .eyebrow,
.e-58cd9997 > .holder.tone-brand .eyebrow,
.e-58cd9997 > .holder.tone-gold .eyebrow
{
	color: rgba(255, 254, 252, 0.85);
}

.e-58cd9997 > .holder.tone-light .eyebrow
{
	color: var(--ot-brand);
}

.e-58cd9997 .eyebrow > .eyebrow-mark
{
	width: 22px;
	height: 1px;
	background: currentColor;
	opacity: 0.7;
}

/* Title */

.e-58cd9997 .title
{
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.05;
	margin: 0;
	font-variation-settings: 'opsz' 144;
	max-width: 480px;
}

.e-58cd9997 > .holder.align-center .title
{
	max-width: 620px;
}

.e-58cd9997 > .holder.tone-dark .title,
.e-58cd9997 > .holder.tone-brand .title,
.e-58cd9997 > .holder.tone-gold .title
{
	color: white;
}

.e-58cd9997 > .holder.tone-light .title
{
	color: var(--ot-text-1);
}

.e-58cd9997 .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-58cd9997 > .holder.tone-brand .title em,
.e-58cd9997 > .holder.tone-gold .title em
{
	color: white;
	opacity: 0.85;
}

/* Description */

.e-58cd9997 .description
{
	font-size: 14px;
	line-height: 1.6;
	margin: 0;
	max-width: 480px;
}

.e-58cd9997 > .holder.tone-dark .description,
.e-58cd9997 > .holder.tone-brand .description,
.e-58cd9997 > .holder.tone-gold .description
{
	color: rgba(255, 254, 252, 0.85);
}

.e-58cd9997 > .holder.tone-light .description
{
	color: var(--ot-text-2);
}

/* CTA */

.e-58cd9997 .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
	padding: 12px 22px;
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.005em;
	width: fit-content;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, transform 240ms, gap 240ms;
}

.e-58cd9997 > .holder.tone-dark .cta,
.e-58cd9997 > .holder.tone-brand .cta,
.e-58cd9997 > .holder.tone-gold .cta
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-58cd9997 > .holder.tone-dark .cta:hover,
.e-58cd9997 > .holder.tone-brand .cta:hover,
.e-58cd9997 > .holder.tone-gold .cta:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 12px;
}

.e-58cd9997 > .holder.tone-light .cta
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-58cd9997 > .holder.tone-light .cta:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 12px;
}

.e-58cd9997 .cta > i
{
	font-size: 16px;
}

/* ========================================== */
/* ===== HORIZONTAL VARIANT ================= */
/* ========================================== */

.e-58cd9997 > .holder.horizontal
{
	min-height: 220px;
	align-items: center;
}

.e-58cd9997 > .holder.horizontal > .cover
{
	position: relative;
	flex-shrink: 0;
	width: 45%;
	min-height: inherit;
}

.e-58cd9997 > .holder.horizontal > .cover > .cover-overlay
{
	display: none;
}

.e-58cd9997 > .holder.horizontal > .content
{
	position: relative;
	flex: 1;
	width: auto;
	padding: 28px 36px;
	color: var(--ot-text-1);
	background: var(--ot-bg-1);
	min-height: inherit;
	justify-content: center;
}

.e-58cd9997 > .holder.horizontal.tone-dark
{
	background: var(--ot-bg-1);
}

.e-58cd9997 > .holder.horizontal .title,
.e-58cd9997 > .holder.horizontal .description
{
	color: var(--ot-text-1);
}

.e-58cd9997 > .holder.horizontal .description
{
	color: var(--ot-text-2);
}

.e-58cd9997 > .holder.horizontal .eyebrow
{
	color: var(--ot-brand);
}

.e-58cd9997 > .holder.horizontal .cta
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-58cd9997 > .holder.horizontal .title
{
	font-size: 28px;
}

/* ========================================== */
/* ===== TALL VARIANT (1:2) ================= */
/* ========================================== */

.e-58cd9997 > .holder.tall
{
	aspect-ratio: 1 / 1.4;
	min-height: 420px;
}

.e-58cd9997 > .holder.tall > .content
{
	padding: 28px 28px 30px;
}

.e-58cd9997 > .holder.tall .title
{
	font-size: 28px;
}

/* ========================================== */
/* ===== WIDE VARIANT (16:6) ================ */
/* ========================================== */

.e-58cd9997 > .holder.wide
{
	min-height: 200px;
	aspect-ratio: 16 / 5;
}

.e-58cd9997 > .holder.wide > .content
{
	padding: 28px 44px;
	flex-direction: row;
	align-items: center;
	gap: 24px;
	justify-content: space-between;
}

.e-58cd9997 > .holder.wide .title
{
	font-size: 30px;
	max-width: 600px;
}

.e-58cd9997 > .holder.wide .description
{
	display: none;
}

.e-58cd9997 > .holder.wide .cta
{
	margin-top: 0;
	flex-shrink: 0;
}

.e-58cd9997 > .holder.wide .content-top
{
	margin-bottom: -8px;
}

/* ========================================== */
/* ===== FLAT VARIANT (no image, no gradient) */
/* ========================================== */

.e-58cd9997 > .holder.flat
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border: 1px solid var(--ot-bg-2-border);
}

.e-58cd9997 > .holder.flat:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-58cd9997 > .holder.flat > .cover
{
	display: none;
}

.e-58cd9997 > .holder.flat .title,
.e-58cd9997 > .holder.flat .description
{
	color: var(--ot-text-1);
}

.e-58cd9997 > .holder.flat .description
{
	color: var(--ot-text-2);
}

.e-58cd9997 > .holder.flat .cta
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 900px)
{
	.e-58cd9997 > .holder
	{
		min-height: 240px;
	}

	.e-58cd9997 > .holder > .content
	{
		padding: 24px 24px;
	}

	.e-58cd9997 .title
	{
		font-size: 28px;
	}

	.e-58cd9997 > .holder.horizontal
	{
		flex-direction: column;
	}

	.e-58cd9997 > .holder.horizontal > .cover
	{
		position: relative;
		width: 100%;
		min-height: 180px;
	}

	.e-58cd9997 > .holder.wide > .content
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.e-58cd9997 > .holder.wide .title
	{
		font-size: 24px;
	}
}
.e-37934a4d
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-37934a4d > .holder
{
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	color: inherit;
	cursor: pointer;
	transition: border-color 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-37934a4d > .holder:hover
{
	border-color: var(--ot-bg-3-border);
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-37934a4d > .holder > .cover
{
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-37934a4d > .holder > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-37934a4d > .holder:hover > .cover::before
{
	transform: scale(1.06);
}

.e-37934a4d > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.0) 60%, rgba(20, 18, 16, 0.18) 100%);
}

/* Highlight chip */

.e-37934a4d .highlight
{
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	padding: 6px 11px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	color: var(--ot-bg-1);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* ===== BODY ===== */

.e-37934a4d > .holder > .body
{
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 22px 24px 22px;
	flex: 1;
}

/* Meta (category + date) */

.e-37934a4d .meta
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.e-37934a4d .category
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-37934a4d .meta-dot
{
	width: 3px;
	height: 3px;
	background: var(--ot-bg-3-border);
	border-radius: 50%;
}

.e-37934a4d .date
{
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

/* Title */

.e-37934a4d .title
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: -0.022em;
	line-height: 1.15;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color 200ms;
}

.e-37934a4d > .holder:hover .title
{
	color: var(--ot-brand);
}

/* Excerpt */

.e-37934a4d .excerpt
{
	font-size: 13.5px;
	line-height: 1.65;
	color: var(--ot-text-2);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Footer (author + reading time) */

.e-37934a4d > .holder > .body > .footer
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-37934a4d .author
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.e-37934a4d .author-avatar
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	border-radius: 50%;
	flex-shrink: 0;
}

.e-37934a4d .author-avatar-fallback > i
{
	font-size: 18px;
	color: var(--ot-text-3);
}

.e-37934a4d .author-text
{
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
	line-height: 1.3;
}

.e-37934a4d .author-name
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-37934a4d .author-role
{
	font-size: 10.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-37934a4d .reading
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	flex-shrink: 0;
}

.e-37934a4d .reading > i
{
	font-size: 14px;
	opacity: 0.85;
}

/* ========================================== */
/* ===== FEATURED VARIANT =================== */
/* ========================================== */

.e-37934a4d > .holder.featured
{
	flex-direction: row;
	align-items: stretch;
}

.e-37934a4d > .holder.featured > .cover
{
	width: 56%;
	aspect-ratio: auto;
	flex-shrink: 0;
	min-height: 380px;
}

.e-37934a4d > .holder.featured > .body
{
	padding: 36px 40px 32px;
	gap: 16px;
	flex: 1;
	justify-content: center;
}

.e-37934a4d > .holder.featured .title
{
	font-size: 40px;
	-webkit-line-clamp: 3;
	letter-spacing: -0.028em;
	line-height: 1.05;
}

.e-37934a4d > .holder.featured .excerpt
{
	font-size: 15px;
	-webkit-line-clamp: 4;
}

.e-37934a4d > .holder.featured > .body > .footer
{
	margin-top: 8px;
}

/* ========================================== */
/* ===== HORIZONTAL VARIANT ================= */
/* ========================================== */

.e-37934a4d > .holder.horizontal
{
	flex-direction: row;
	align-items: stretch;
}

.e-37934a4d > .holder.horizontal > .cover
{
	width: 220px;
	min-width: 220px;
	aspect-ratio: auto;
	flex-shrink: 0;
}

.e-37934a4d > .holder.horizontal > .body
{
	padding: 18px 22px;
	gap: 8px;
	flex: 1;
	min-width: 0;
}

.e-37934a4d > .holder.horizontal .title
{
	font-size: 19px;
	-webkit-line-clamp: 2;
	line-height: 1.2;
}

.e-37934a4d > .holder.horizontal .excerpt
{
	-webkit-line-clamp: 2;
	font-size: 12.5px;
}

.e-37934a4d > .holder.horizontal > .body > .footer
{
	padding-top: 10px;
}

/* ========================================== */
/* ===== COMPACT VARIANT ==================== */
/* ========================================== */

.e-37934a4d > .holder.compact > .cover
{
	aspect-ratio: 16 / 9;
}

.e-37934a4d > .holder.compact > .body
{
	padding: 14px 16px 16px;
	gap: 6px;
}

.e-37934a4d > .holder.compact .title
{
	font-size: 16px;
	-webkit-line-clamp: 2;
	line-height: 1.25;
}

.e-37934a4d > .holder.compact .excerpt,
.e-37934a4d > .holder.compact .author
{
	display: none;
}

.e-37934a4d > .holder.compact > .body > .footer
{
	padding-top: 6px;
	border-top: 0;
	margin-top: 0;
	justify-content: flex-end;
}

/* ========================================== */
/* ===== MINIMAL VARIANT (no cover) ========= */
/* ========================================== */

.e-37934a4d > .holder.minimal
{
	background: transparent;
	border: 0;
	border-top: 1px solid var(--ot-bg-2-border);
	border-radius: 0;
}

.e-37934a4d > .holder.minimal:hover
{
	border-top-color: var(--ot-text-1);
	transform: none;
}

.e-37934a4d > .holder.minimal > .cover
{
	display: none;
}

.e-37934a4d > .holder.minimal > .body
{
	padding: 22px 0 22px;
}

.e-37934a4d > .holder.minimal > .body > .footer
{
	border-top: 0;
	padding-top: 8px;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 900px)
{
	.e-37934a4d > .holder.featured
	{
		flex-direction: column;
	}

	.e-37934a4d > .holder.featured > .cover
	{
		width: 100%;
		min-height: 240px;
		aspect-ratio: 16 / 10;
	}

	.e-37934a4d > .holder.featured > .body
	{
		padding: 26px 24px 24px;
	}

	.e-37934a4d > .holder.featured .title
	{
		font-size: 28px;
	}
}

@media (max-width: 600px)
{
	.e-37934a4d > .holder.horizontal
	{
		flex-direction: column;
	}

	.e-37934a4d > .holder.horizontal > .cover
	{
		width: 100%;
		min-width: 0;
		aspect-ratio: 16 / 10;
	}
}
.e-392065d6
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-392065d6 > .holder
{
	position: relative;
	display: block;
	background: var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	color: white;
	cursor: pointer;
	border: 1px solid transparent;
	transition: border-color 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-392065d6 > .holder:hover
{
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-392065d6 > .holder > .cover
{
	position: relative;
	width: 100%;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-392065d6 > .holder.size-s > .cover { aspect-ratio: 4 / 5; min-height: 280px; }
.e-392065d6 > .holder.size-m > .cover { aspect-ratio: 4 / 5; min-height: 380px; }
.e-392065d6 > .holder.size-l > .cover { aspect-ratio: 4 / 5; min-height: 540px; }

.e-392065d6 > .holder > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1400ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-392065d6 > .holder:hover > .cover::before
{
	transform: scale(1.06);
}

/* Overlay */

.e-392065d6 > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.05) 0%, transparent 35%, rgba(20, 18, 16, 0.5) 75%, rgba(20, 18, 16, 0.85) 100%);
	transition: background 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-392065d6 > .holder:hover > .cover > .cover-overlay
{
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.1) 0%, transparent 25%, rgba(20, 18, 16, 0.55) 70%, rgba(20, 18, 16, 0.9) 100%);
}

/* Country chip */

.e-392065d6 .country-chip
{
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px 6px 10px;
	background: rgba(255, 254, 252, 0.94);
	backdrop-filter: blur(10px) saturate(180%);
	-webkit-backdrop-filter: blur(10px) saturate(180%);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-392065d6 .country-chip > .country-flag
{
	font-size: 14px;
	letter-spacing: 0;
}

/* Content (overlay) */

.e-392065d6 > .holder > .cover > .content
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 24px 22px;
}

.e-392065d6 .region
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 254, 252, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-392065d6 .name
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 0.98;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-392065d6 > .holder.size-s .name { font-size: 28px; }
.e-392065d6 > .holder.size-m .name { font-size: 38px; }
.e-392065d6 > .holder.size-l .name { font-size: 56px; }

.e-392065d6 .description
{
	font-size: 13px;
	line-height: 1.55;
	color: rgba(255, 254, 252, 0.82);
	margin: 0;
	max-width: 380px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-392065d6 .meta
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 4px;
}

.e-392065d6 .meta-item
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	font-weight: 600;
	color: rgba(255, 254, 252, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-392065d6 .meta-item > i
{
	font-size: 13px;
	opacity: 0.85;
}

/* CTA */

.e-392065d6 .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
	padding: 10px 18px;
	background: rgba(255, 254, 252, 0.14);
	border: 1px solid rgba(255, 254, 252, 0.32);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	color: white;
	letter-spacing: 0.005em;
	width: fit-content;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, transform 240ms, gap 240ms;
}

.e-392065d6 > .holder:hover .cta
{
	background: white;
	color: var(--ot-text-1);
	border-color: white;
	transform: translateX(2px);
	gap: 12px;
}

.e-392065d6 .cta > i
{
	font-size: 16px;
}

/* ===== BODY (hidden by default, shown for horizontal + card) ===== */

.e-392065d6 > .holder > .body
{
	display: none;
}

/* ========================================== */
/* ===== HORIZONTAL VARIANT ================= */
/* ========================================== */

.e-392065d6 > .holder.horizontal
{
	display: flex;
	align-items: stretch;
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
	color: inherit;
}

.e-392065d6 > .holder.horizontal:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-392065d6 > .holder.horizontal > .cover
{
	width: 40%;
	min-width: 180px;
	aspect-ratio: auto;
	min-height: 140px;
	flex-shrink: 0;
}

.e-392065d6 > .holder.horizontal > .cover > .cover-overlay,
.e-392065d6 > .holder.horizontal > .cover > .content,
.e-392065d6 > .holder.horizontal > .cover > .country-chip
{
	display: none;
}

.e-392065d6 > .holder.horizontal > .body
{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 10px;
	padding: 18px 22px;
	flex: 1;
	min-width: 0;
}

.e-392065d6 > .holder.horizontal .body-head
{
	display: flex;
	align-items: center;
	gap: 8px;
}

.e-392065d6 > .holder.horizontal .body-flag
{
	font-size: 18px;
	flex-shrink: 0;
}

.e-392065d6 > .holder.horizontal .body-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.e-392065d6 > .holder.horizontal .body-name
{
	font-family: var(--ot-font-secondary);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	line-height: 1.15;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 200ms;
}

.e-392065d6 > .holder.horizontal:hover .body-name
{
	color: var(--ot-brand);
}

.e-392065d6 > .holder.horizontal .body-country
{
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-392065d6 > .holder.horizontal .body-description
{
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--ot-text-2);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-392065d6 > .holder.horizontal .body-meta
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-top: auto;
}

.e-392065d6 > .holder.horizontal .body-meta > i
{
	font-size: 16px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms;
}

.e-392065d6 > .holder.horizontal:hover .body-meta > i
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

/* ========================================== */
/* ===== FEATURED VARIANT =================== */
/* ========================================== */

.e-392065d6 > .holder.featured > .cover
{
	aspect-ratio: 1 / 1;
}

.e-392065d6 > .holder.featured.size-l > .cover
{
	min-height: 640px;
}

.e-392065d6 > .holder.featured > .cover > .content
{
	padding: 36px 36px 32px;
	gap: 14px;
}

.e-392065d6 > .holder.featured .name
{
	font-size: 64px;
	letter-spacing: -0.03em;
}

.e-392065d6 > .holder.featured.size-l .name
{
	font-size: 80px;
}

.e-392065d6 > .holder.featured .description
{
	font-size: 14px;
	max-width: 460px;
	-webkit-line-clamp: 3;
}

/* ========================================== */
/* ===== COMPACT VARIANT ==================== */
/* ========================================== */

.e-392065d6 > .holder.compact > .cover
{
	aspect-ratio: 4 / 3;
	min-height: 200px;
}

.e-392065d6 > .holder.compact > .cover > .content
{
	padding: 16px 18px 16px;
	gap: 4px;
}

.e-392065d6 > .holder.compact .name
{
	font-size: 22px;
}

.e-392065d6 > .holder.compact .region,
.e-392065d6 > .holder.compact .description,
.e-392065d6 > .holder.compact .meta,
.e-392065d6 > .holder.compact .cta
{
	display: none;
}

.e-392065d6 > .holder.compact .country-chip
{
	top: 12px;
	left: 12px;
	padding: 4px 10px 4px 8px;
	font-size: 9.5px;
}

/* ========================================== */
/* ===== CARD VARIANT (image + body below) == */
/* ========================================== */

.e-392065d6 > .holder.card
{
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
	color: inherit;
}

.e-392065d6 > .holder.card:hover
{
	border-color: var(--ot-bg-3-border);
}

.e-392065d6 > .holder.card > .cover
{
	aspect-ratio: 4 / 3;
	min-height: auto;
}

.e-392065d6 > .holder.card > .cover > .cover-overlay,
.e-392065d6 > .holder.card > .cover > .content
{
	display: none;
}

.e-392065d6 > .holder.card > .body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 22px 22px;
	flex: 1;
}

.e-392065d6 > .holder.card .body-head
{
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.e-392065d6 > .holder.card .body-flag
{
	font-size: 18px;
}

.e-392065d6 > .holder.card .body-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-392065d6 > .holder.card .body-name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	letter-spacing: -0.018em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	line-height: 1.2;
	transition: color 200ms;
}

.e-392065d6 > .holder.card:hover .body-name
{
	color: var(--ot-brand);
}

.e-392065d6 > .holder.card .body-country
{
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-392065d6 > .holder.card .body-description
{
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-392065d6 > .holder.card .body-meta
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: auto;
	padding-top: 4px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-392065d6 > .holder.card .body-meta > i
{
	font-size: 16px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms;
}

.e-392065d6 > .holder.card:hover .body-meta > i
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 700px)
{
	.e-392065d6 > .holder.featured .name
	{
		font-size: 44px;
	}

	.e-392065d6 > .holder.size-l > .cover  { min-height: 420px; }

	.e-392065d6 > .holder.horizontal
	{
		flex-direction: column;
	}

	.e-392065d6 > .holder.horizontal > .cover
	{
		width: 100%;
		min-height: 200px;
	}
}
.e-769a98d3
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-769a98d3 > .holder
{
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	color: inherit;
	cursor: pointer;
	transition: border-color 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-769a98d3 > .holder:hover
{
	border-color: var(--ot-bg-3-border);
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-769a98d3 > .holder > .cover
{
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-769a98d3 > .holder.no-cover > .cover
{
	background:
		radial-gradient(circle at 30% 30%, var(--ot-bg-2) 0%, var(--ot-bg-3) 100%);
}

.e-769a98d3 > .holder:not(.no-cover) > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-769a98d3 > .holder:hover:not(.no-cover) > .cover::before
{
	transform: scale(1.06);
}

.e-769a98d3 > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.0) 0%, transparent 50%, rgba(20, 18, 16, 0.4) 100%);
}

/* ===== FLAG (shared) ===== */

.e-769a98d3 .flag
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

/* Flag in cover (default) */

.e-769a98d3 .flag-cover
{
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	width: 48px;
	height: 48px;
	font-size: 28px;
	background: rgba(255, 254, 252, 0.94);
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: 12px;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-769a98d3 > .holder:hover .flag-cover
{
	transform: scale(1.06);
}

/* Flag in body — hidden by default, shown for horizontal/compact/stamp */

.e-769a98d3 .flag-body
{
	display: none;
}

/* Region (top right) */

.e-769a98d3 .region
{
	position: absolute;
	top: 22px;
	right: 16px;
	z-index: 2;
	font-size: 10px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	text-shadow: 0 1px 8px rgba(20, 18, 16, 0.4);
}

.e-769a98d3 > .holder.no-cover .region
{
	color: var(--ot-text-3);
	text-shadow: none;
}

/* Code (bottom right corner inside cover) */

.e-769a98d3 .code
{
	position: absolute;
	bottom: 16px;
	right: 18px;
	z-index: 2;
	font-family: var(--ot-font-secondary);
	font-size: 32px;
	font-weight: 300;
	line-height: 1;
	color: rgba(255, 254, 252, 0.85);
	letter-spacing: -0.03em;
	font-variation-settings: 'opsz' 144;
	text-shadow: 0 2px 12px rgba(20, 18, 16, 0.3);
	user-select: none;
	pointer-events: none;
}

.e-769a98d3 > .holder.no-cover .code
{
	color: var(--ot-bg-3-border);
	text-shadow: none;
	font-size: 56px;
	font-weight: 200;
	bottom: 12px;
	right: 18px;
	opacity: 0.9;
}

/* ===== BODY ===== */

.e-769a98d3 > .holder > .body
{
	display: flex;
	align-items: stretch;
	gap: 0;
	padding: 18px 20px 18px;
	flex: 1;
	position: relative;
}

.e-769a98d3 .body-text
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
	min-width: 0;
}

.e-769a98d3 .body-head
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
}

.e-769a98d3 .name
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	transition: color 200ms;
}

.e-769a98d3 > .holder:hover .name
{
	color: var(--ot-brand);
}

.e-769a98d3 .highlight
{
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	flex-shrink: 0;
	margin-top: 4px;
}

/* Stats */

.e-769a98d3 .stats
{
	display: flex;
	align-items: baseline;
	gap: 16px;
}

.e-769a98d3 .stat
{
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
}

.e-769a98d3 .stat > .stat-value
{
	font-family: var(--ot-font-secondary);
	font-size: 16px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.01em;
	font-variation-settings: 'opsz' 144;
}

.e-769a98d3 .stat > .stat-label
{
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* Action arrow (corner) */

.e-769a98d3 .action
{
	position: absolute;
	bottom: 16px;
	right: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, transform 240ms;
}

.e-769a98d3 > .holder:hover .action
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	transform: translateX(2px);
}

.e-769a98d3 .action > i
{
	font-size: 16px;
}

/* ========================================== */
/* ===== HORIZONTAL VARIANT ================= */
/* ========================================== */

.e-769a98d3 > .holder.horizontal
{
	flex-direction: row;
	align-items: center;
}

.e-769a98d3 > .holder.horizontal > .cover
{
	display: none;
}

.e-769a98d3 > .holder.horizontal > .body
{
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	flex: 1;
}

.e-769a98d3 > .holder.horizontal .flag-body
{
	display: inline-flex;
	width: 40px;
	height: 40px;
	font-size: 22px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 10px;
	flex-shrink: 0;
}

.e-769a98d3 > .holder.horizontal .body-text
{
	flex-direction: row;
	align-items: center;
	gap: 14px;
	flex: 1;
}

.e-769a98d3 > .holder.horizontal .body-head
{
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	flex: 1;
	min-width: 0;
}

.e-769a98d3 > .holder.horizontal .name
{
	font-size: 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 100%;
}

.e-769a98d3 > .holder.horizontal .highlight
{
	margin-top: 0;
}

.e-769a98d3 > .holder.horizontal .stats
{
	gap: 12px;
	flex-shrink: 0;
}

.e-769a98d3 > .holder.horizontal .action
{
	position: static;
	margin-left: 4px;
}

/* ========================================== */
/* ===== FEATURED VARIANT =================== */
/* ========================================== */

.e-769a98d3 > .holder.featured > .cover
{
	aspect-ratio: 16 / 11;
}

.e-769a98d3 > .holder.featured .flag-cover
{
	width: 56px;
	height: 56px;
	font-size: 32px;
	border-radius: 14px;
}

.e-769a98d3 > .holder.featured .code
{
	font-size: 44px;
}

.e-769a98d3 > .holder.featured > .body
{
	padding: 24px 26px 24px;
}

.e-769a98d3 > .holder.featured .body-text
{
	gap: 12px;
}

.e-769a98d3 > .holder.featured .name
{
	font-size: 32px;
}

.e-769a98d3 > .holder.featured .stat > .stat-value
{
	font-size: 22px;
}

.e-769a98d3 > .holder.featured .action
{
	bottom: 24px;
	right: 26px;
	width: 36px;
	height: 36px;
}

.e-769a98d3 > .holder.featured .action > i
{
	font-size: 18px;
}

/* ========================================== */
/* ===== COMPACT VARIANT (pill) ============= */
/* ========================================== */

.e-769a98d3 > .holder.compact
{
	flex-direction: row;
	align-items: center;
	border-radius: 100px;
	background: var(--ot-bg-2);
	border-color: transparent;
	padding: 4px 16px 4px 4px;
}

.e-769a98d3 > .holder.compact:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
	transform: translateX(2px);
}

.e-769a98d3 > .holder.compact > .cover
{
	display: none;
}

.e-769a98d3 > .holder.compact > .body
{
	align-items: center;
	gap: 10px;
	padding: 4px 8px;
	flex: 1;
}

.e-769a98d3 > .holder.compact .flag-body
{
	display: inline-flex;
	width: 32px;
	height: 32px;
	font-size: 18px;
	background: var(--ot-bg-1);
	border-radius: 50%;
	flex-shrink: 0;
}

.e-769a98d3 > .holder.compact .body-text
{
	flex-direction: row;
	align-items: center;
	gap: 8px;
}

.e-769a98d3 > .holder.compact .body-head
{
	flex: 1;
	min-width: 0;
}

.e-769a98d3 > .holder.compact .name
{
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--ot-text-1);
}

.e-769a98d3 > .holder.compact .highlight,
.e-769a98d3 > .holder.compact .stats,
.e-769a98d3 > .holder.compact .action
{
	display: none;
}

/* ========================================== */
/* ===== STAMP VARIANT (passport mark) ====== */
/* ========================================== */

.e-769a98d3 > .holder.stamp
{
	flex-direction: column;
	background: transparent;
	border: 0;
	padding: 0;
	overflow: visible;
	border-radius: 0;
}

.e-769a98d3 > .holder.stamp:hover
{
	transform: translateY(-3px);
}

.e-769a98d3 > .holder.stamp > .cover
{
	aspect-ratio: 1 / 1;
	border: 2px solid var(--ot-text-1);
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-1);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.e-769a98d3 > .holder.stamp > .cover::before,
.e-769a98d3 > .holder.stamp > .cover > .cover-overlay,
.e-769a98d3 > .holder.stamp .code,
.e-769a98d3 > .holder.stamp .region
{
	display: none;
}

.e-769a98d3 > .holder.stamp .flag-cover
{
	position: static;
	width: auto;
	height: auto;
	font-size: 64px;
	background: transparent;
	border: 0;
	border-radius: 0;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.e-769a98d3 > .holder.stamp > .body
{
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 14px 0 0;
	text-align: center;
}

.e-769a98d3 > .holder.stamp .body-text
{
	align-items: center;
	gap: 4px;
}

.e-769a98d3 > .holder.stamp .body-head
{
	flex-direction: column;
	align-items: center;
	gap: 4px;
}

.e-769a98d3 > .holder.stamp .name
{
	font-size: 18px;
}

.e-769a98d3 > .holder.stamp .stats,
.e-769a98d3 > .holder.stamp .action
{
	display: none;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 600px)
{
	.e-769a98d3 > .holder.featured .name
	{
		font-size: 24px;
	}
}
.e-487914a5
{
	display: block;
}

/* ===== HOLDER (default = pill) ===== */

.e-487914a5 > .holder
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px 10px 14px;
	width: 100%;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	color: inherit;
	cursor: pointer;
	min-width: 0;
	transition: border-color 240ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms, transform 240ms;
}

.e-487914a5 > .holder:hover
{
	border-color: var(--ot-bg-3-border);
	background: var(--ot-bg-2);
	transform: translateX(2px);
}

.e-487914a5 > .holder.active
{
	border-color: var(--ot-text-1);
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

/* Flag */

.e-487914a5 .flag
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	line-height: 1;
	flex-shrink: 0;
}

/* Icon */

.e-487914a5 .icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-487914a5 > .holder:hover .icon
{
	color: var(--ot-brand);
}

.e-487914a5 > .holder.active .icon
{
	color: var(--ot-bg-1);
}

/* Text */

.e-487914a5 .text
{
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
	flex: 1;
	line-height: 1.25;
}

.e-487914a5 .label
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-487914a5 > .holder.active .label
{
	color: var(--ot-bg-1);
	font-weight: 600;
}

.e-487914a5 .description
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-487914a5 > .holder.active .description
{
	color: rgba(255, 254, 252, 0.75);
}

/* Count */

.e-487914a5 .count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	padding: 2px 7px;
	background: var(--ot-bg-3);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-2);
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
	flex-shrink: 0;
}

.e-487914a5 > .holder.active .count
{
	background: rgba(255, 254, 252, 0.18);
	color: var(--ot-bg-1);
}

/* Arrow */

.e-487914a5 .arrow
{
	font-size: 16px;
	color: var(--ot-text-3);
	margin-left: 2px;
	flex-shrink: 0;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms;
}

.e-487914a5 > .holder:hover .arrow
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

.e-487914a5 > .holder.active .arrow
{
	color: var(--ot-bg-1);
}

/* ========================================== */
/* ===== LIST VARIANT (full-width row) ====== */
/* ========================================== */

.e-487914a5 > .holder.list
{
	border-radius: var(--ot-radius-m);
	padding: 14px 18px 14px 16px;
	gap: 12px;
}

.e-487914a5 > .holder.list .flag
{
	font-size: 22px;
}

.e-487914a5 > .holder.list .icon
{
	font-size: 20px;
}

.e-487914a5 > .holder.list .label
{
	font-size: 14px;
	font-weight: 600;
}

.e-487914a5 > .holder.list .description
{
	font-size: 12px;
}

/* ========================================== */
/* ===== GHOST VARIANT (no border, hover bg) */
/* ========================================== */

.e-487914a5 > .holder.ghost
{
	background: transparent;
	border-color: transparent;
	border-radius: var(--ot-radius-s);
}

.e-487914a5 > .holder.ghost:hover
{
	background: var(--ot-bg-2);
	border-color: transparent;
}

.e-487914a5 > .holder.ghost.active
{
	background: var(--ot-bg-2);
	border-color: transparent;
	color: var(--ot-text-1);
}

.e-487914a5 > .holder.ghost.active .label
{
	color: var(--ot-text-1);
}

.e-487914a5 > .holder.ghost.active .icon,
.e-487914a5 > .holder.ghost.active .arrow
{
	color: var(--ot-brand);
}

.e-487914a5 > .holder.ghost.active .count
{
	background: var(--ot-bg-1);
	color: var(--ot-text-2);
}

.e-487914a5 > .holder.ghost.active .description
{
	color: var(--ot-text-3);
}

/* ========================================== */
/* ===== TAG VARIANT (extra compact) ======== */
/* ========================================== */

.e-487914a5 > .holder.tag
{
	padding: 6px 12px 6px 10px;
	gap: 6px;
	background: var(--ot-bg-2);
	border-color: transparent;
	width: auto;
}

.e-487914a5 > .holder.tag:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
	transform: translateX(0);
}

.e-487914a5 > .holder.tag .flag,
.e-487914a5 > .holder.tag .icon
{
	font-size: 14px;
}

.e-487914a5 > .holder.tag .text
{
	flex: 0 0 auto;
}

.e-487914a5 > .holder.tag .label
{
	font-size: 12px;
}

.e-487914a5 > .holder.tag .description
{
	display: none;
}

.e-487914a5 > .holder.tag .count
{
	min-width: 18px;
	font-size: 10px;
	padding: 1px 6px;
}

.e-487914a5 > .holder.tag .arrow
{
	display: none;
}
.e-5677af83
{
	display: block;
	width: 100%;
	min-width: 100%;
	height: 100%;
}

/* ===== HOLDER ===== */

.e-5677af83 > .holder
{
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	color: inherit;
	cursor: pointer;
	transition: border-color 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5677af83 > .holder:hover
{
	border-color: var(--ot-bg-3-border);
	transform: translateY(-3px);
}

/* Link pokriva celu karticu ali je SIBLING kontrola, pa strelice i srce ne navigiraju. */

.e-5677af83 > .holder > .link
{
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
}

/* ===== COVER ===== */

.e-5677af83 > .holder > .cover
{
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-5677af83 > .holder > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-5677af83 > .holder:hover > .cover::before
{
	transform: scale(1.06);
}

.e-5677af83 > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.18) 0%, transparent 30%, transparent 60%, rgba(20, 18, 16, 0.45) 100%);
	pointer-events: none;
}

/* ===== GALLERY ARROWS ===== */

.e-5677af83 .shot
{
	position: absolute;
	top: 50%;
	margin-top: -18px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	background: rgba(255, 254, 252, 0.94);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	opacity: 0;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms, transform 220ms;
}

.e-5677af83 .shot.shot-prev { left: 10px; }
.e-5677af83 .shot.shot-next { right: 10px; }

.e-5677af83 > .holder:hover .shot,
.e-5677af83 .shot:focus-visible
{
	opacity: 1;
}

.e-5677af83 .shot:hover
{
	background: white;
	transform: scale(1.06);
}

.e-5677af83 .shot > i
{
	font-size: 20px;
}

/* Na dodirnim ekranima nema hover-a, pa strelice stoje vidljive. */

@media (hover: none)
{
	.e-5677af83 .shot
	{
		opacity: 1;
	}
}

/* ===== COVER TOP (type + badge) ===== */

.e-5677af83 .cover-top
{
	position: absolute;
	top: 14px;
	left: 14px;
	right: 14px;
	z-index: 1;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
	pointer-events: none;
	flex-wrap: wrap;
}

.e-5677af83 .cover-top-right
{
	display: inline-flex;
	align-items: flex-start;
	gap: 8px;
	margin-left: auto;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.e-5677af83 .pool-chip
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 11px 6px 9px;
	background: var(--ot-blue);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: white;
}

.e-5677af83 .pool-chip > i
{
	font-size: 13px;
}

.e-5677af83 .type-chip
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 11px 6px 9px;
	background: rgba(255, 254, 252, 0.94);
	backdrop-filter: blur(10px) saturate(180%);
	-webkit-backdrop-filter: blur(10px) saturate(180%);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-5677af83 .type-chip > i
{
	font-size: 13px;
	color: var(--ot-brand);
}

.e-5677af83 .badge
{
	padding: 6px 11px;
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: white;
}

.e-5677af83 .badge.badge-brand { background: var(--ot-brand); }
.e-5677af83 .badge.badge-dark  { background: var(--ot-text-1); }
.e-5677af83 .badge.badge-green { background: rgba(20, 144, 95, 1); }
.e-5677af83 .badge.badge-gold  { background: rgba(170, 130, 60, 1); }
.e-5677af83 .badge.badge-red   { background: rgba(228, 0, 43, 1); }

/* ===== SAVE BUTTON ===== */

.e-5677af83 .save
{
	position: absolute;
	bottom: 14px;
	right: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: rgba(255, 254, 252, 0.94);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, transform 220ms;
}

.e-5677af83 .save:hover
{
	background: white;
	transform: scale(1.06);
}

.e-5677af83 .save > i
{
	font-size: 18px;
}

.e-5677af83 > .holder.is-saved .save
{
	background: var(--ot-brand);
	color: white;
}

.e-5677af83 > .holder.is-saved .save > i
{
	font-variation-settings: 'FILL' 1;
}

/* ===== COVER BOTTOM (duration + transport) ===== */

.e-5677af83 .cover-bottom
{
	position: absolute;
	bottom: 14px;
	left: 14px;
	right: 60px;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 6px;
	pointer-events: none;
	flex-wrap: wrap;
}

.e-5677af83 .last-minute
{
	display: inline-flex;
	align-items: center;
	padding: 5px 10px;
	background: rgba(0, 230, 90, 1);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(15, 40, 24, 1);
}

.e-5677af83 .cover-meta
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	background: rgba(20, 18, 16, 0.55);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 600;
	color: white;
	letter-spacing: 0.02em;
}

.e-5677af83 .cover-meta > i
{
	font-size: 13px;
}

.e-5677af83 .cover-meta-transport
{
	gap: 3px;
	padding: 5px 9px;
}

.e-5677af83 .cover-meta-transport > i
{
	font-size: 14px;
}

/* ===== BODY ===== */

.e-5677af83 > .holder > .body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px 22px 18px;
	flex: 1;
}

/* Head: destination + stars */

.e-5677af83 .body > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.e-5677af83 .destination
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	min-width: 0;
}

.e-5677af83 .destination > .destination-flag
{
	font-size: 14px;
	letter-spacing: 0;
	flex-shrink: 0;
}

.e-5677af83 .destination > .destination-text
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-5677af83 .stars
{
	display: inline-flex;
	gap: 1px;
	flex-shrink: 0;
}

.e-5677af83 .stars > i
{
	font-size: 12px;
	color: rgba(220, 165, 50, 1);
	font-variation-settings: 'FILL' 1;
}

/* Name */

.e-5677af83 .body > .name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color 200ms;
}

.e-5677af83 > .holder:hover > .body > .name
{
	color: var(--ot-brand);
}

/* Description */

.e-5677af83 .body > .description
{
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Highlights */

.e-5677af83 .body > .highlights
{
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 4px;
}

.e-5677af83 .highlight
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 6px;
	font-size: 10.5px;
	font-weight: 500;
	color: var(--ot-text-2);
}

.e-5677af83 .highlight > i
{
	font-size: 12px;
	color: var(--ot-brand);
}

/* Footer: departure + price */

.e-5677af83 .body > .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 8px;
}

.e-5677af83 .departure
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.2;
}

.e-5677af83 .departure > .departure-label
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-5677af83 .departure > .departure-value
{
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-5677af83 .price
{
	text-align: right;
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.0;
}

.e-5677af83 .price > .price-old
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-decoration: line-through;
	margin-bottom: 2px;
}

.e-5677af83 .price > .price-row
{
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
	justify-content: flex-end;
}

.e-5677af83 .price > .price-row > .price-from
{
	font-size: 10.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-5677af83 .price > .price-row > .price-value
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

.e-5677af83 .price > .price-per
{
	font-size: 10px;
	font-weight: 500;
	color: var(--ot-text-3);
	margin-top: 3px;
}

/* Action strip (bottom) */

.e-5677af83 .body > .action
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: auto -22px -18px;
	padding: 14px 22px;
	background: var(--ot-bg-2);
	border-top: 1px solid var(--ot-bg-2-border);
	transition: background 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5677af83 > .holder:hover > .body > .action
{
	background: var(--ot-text-1);
}

.e-5677af83 .body > .action > .action-text
{
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	transition: color 320ms;
}

.e-5677af83 > .holder:hover > .body > .action > .action-text
{
	color: var(--ot-bg-1);
}

.e-5677af83 .body > .action > .action-arrow
{
	font-size: 16px;
	color: var(--ot-text-2);
	transition: color 320ms, transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5677af83 > .holder:hover > .body > .action > .action-arrow
{
	color: var(--ot-bg-1);
	transform: translateX(4px);
}

/* ========================================== */
/* ===== HORIZONTAL VARIANT ================= */
/* ========================================== */

.e-5677af83 > .holder.horizontal
{
	flex-direction: row;
	align-items: stretch;
}

.e-5677af83 > .holder.horizontal > .cover
{
	width: 360px;
	min-width: 360px;
	aspect-ratio: auto;
}

.e-5677af83 > .holder.horizontal > .body
{
	flex: 1;
	padding: 28px 32px 24px;
	gap: 12px;
}

.e-5677af83 > .holder.horizontal > .body > .name
{
	font-size: 28px;
}

.e-5677af83 > .holder.horizontal > .body > .description
{
	-webkit-line-clamp: 3;
	font-size: 13.5px;
}

.e-5677af83 > .holder.horizontal > .body > .action
{
	margin: 12px -32px -24px;
	padding: 16px 32px;
}

/* ========================================== */
/* ===== FEATURED VARIANT =================== */
/* ========================================== */

.e-5677af83 > .holder.featured > .cover
{
	aspect-ratio: 16 / 11;
}

.e-5677af83 > .holder.featured > .body
{
	padding: 28px 28px 22px;
	gap: 12px;
}

.e-5677af83 > .holder.featured > .body > .name
{
	font-size: 32px;
	-webkit-line-clamp: 2;
}

.e-5677af83 > .holder.featured > .body > .description
{
	font-size: 14px;
	-webkit-line-clamp: 3;
}

.e-5677af83 > .holder.featured > .body > .action
{
	margin: 8px -28px -22px;
	padding: 18px 28px;
}

.e-5677af83 > .holder.featured > .body > .action > .action-text
{
	font-size: 13.5px;
}

/* ========================================== */
/* ===== COMPACT VARIANT ==================== */
/* ========================================== */

.e-5677af83 > .holder.compact > .body
{
	padding: 16px 16px 14px;
	gap: 8px;
}

.e-5677af83 > .holder.compact > .body > .name
{
	font-size: 18px;
}

.e-5677af83 > .holder.compact > .body > .description
{
	display: none;
}

.e-5677af83 > .holder.compact > .body > .highlights
{
	display: none;
}

.e-5677af83 > .holder.compact > .body > .footer
{
	padding-top: 4px;
}

.e-5677af83 > .holder.compact > .body > .action
{
	margin: 4px -16px -14px;
	padding: 10px 16px;
}

/* ========================================== */
/* ===== OVERLAY VARIANT ==================== */
/* ========================================== */

/* Fotografija ispunjava celu karticu, a tekst stoji na njoj — zato holder dobija */
/* sopstveni odnos stranica umesto visine koju mu nametne roditelj. */

.e-5677af83 > .holder.overlay
{
	height: auto;
	aspect-ratio: 3 / 4;
	background: var(--ot-bg-3);
	border: 0;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5677af83 > .holder.overlay:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-5677af83 > .holder.overlay > .cover
{
	position: absolute;
	inset: 0;
	aspect-ratio: auto;
}

/* Zatamnjenje ide na z-index 0 da ostane ispod linka (z-index 1), pa je cela */
/* kartica i dalje jedan klik, a telo iznad zatamnjenja jer dolazi kasnije u DOM-u. */

.e-5677af83 > .holder.overlay > .cover > .cover-overlay
{
	z-index: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-5677af83 > .holder.overlay:hover > .cover > .cover-overlay
{
	opacity: 0.86;
}

/* Srce ide u gornji desni ugao, cipovi se sklanjaju levo od njega, a red sa */
/* trajanjem i prevozom pada u drugi red — dno kartice ostaje tekstu. */

.e-5677af83 > .holder.overlay .cover-top
{
	right: 60px;
}

.e-5677af83 > .holder.overlay .save
{
	top: 14px;
	right: 14px;
	bottom: auto;
}

.e-5677af83 > .holder.overlay .cover-bottom
{
	top: 52px;
	right: 14px;
	bottom: auto;
}

/* ===== OVERLAY — telo preko fotografije ===== */

.e-5677af83 > .holder.overlay > .body
{
	position: relative;
	z-index: 0;
	justify-content: flex-end;
	gap: 7px;
	padding: 0 18px 18px;
}

/* Zvezdice idu iznad destinacije, a redosled u DOM-u ostaje netaknut. */

.e-5677af83 > .holder.overlay .body > .head
{
	flex-direction: column-reverse;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 6px;
}

.e-5677af83 > .holder.overlay .destination
{
	font-size: 13px;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-5677af83 > .holder.overlay .stars > i
{
	font-size: 15px;
	color: rgba(245, 179, 1, 1);
}

.e-5677af83 > .holder.overlay > .body > .name,
.e-5677af83 > .holder.overlay:hover > .body > .name
{
	font-size: 20px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-5677af83 > .holder.overlay > .body > .description,
.e-5677af83 > .holder.overlay > .body > .highlights,
.e-5677af83 > .holder.overlay > .body > .footer
{
	display: none;
}

/* Poziv na akciju je podvucen natpis, ne traka — traka bi presekla fotografiju. */

.e-5677af83 > .holder.overlay > .body > .action,
.e-5677af83 > .holder.overlay:hover > .body > .action
{
	align-self: flex-start;
	justify-content: flex-start;
	margin: 4px 0 0;
	padding: 0 0 4px;
	background: none;
	border-top: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-5677af83 > .holder.overlay:hover > .body > .action
{
	border-bottom-color: white;
}

.e-5677af83 > .holder.overlay > .body > .action > .action-text,
.e-5677af83 > .holder.overlay:hover > .body > .action > .action-text
{
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: white;
}

.e-5677af83 > .holder.overlay > .body > .action > .action-arrow
{
	display: none;
}

/* ========================================== */
/* ===== OFFER VARIANT ====================== */
/* ========================================== */

/* Izgled kartice iz sekcije "Ponude za letovanje po zemljama" (section-country-offers-1). */
/* Sve vrednosti su prepisane sa te sekcije: 12px radijus bez obruba, galerija visoka 190px, */
/* narandzasti cipovi i zvezdice, naziv iznad lokacije i svetlo plava podnozna traka sa okruglim dugmetom. */
/* Kartica liste nema cenu ni polazak, pa donji red (.footer) ostaje prazan i skriva se. */

.e-5677af83 > .holder.offer
{
	--offer-accent: #f5821e;
	--offer-accent-hover: #dc6f0f;
	--offer-ink: #16294d;
	--offer-foot: #dceefb;
	--offer-muted: #6b7280;

	background: #ffffff;
	border: 0;
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5677af83 > .holder.offer:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
}

/* ===== OFFER — galerija ===== */

.e-5677af83 > .holder.offer > .cover
{
	flex: 0 0 190px;
	height: 190px;
	aspect-ratio: auto;
}

/* Referentna galerija nema gradijent preko fotografije. */

.e-5677af83 > .holder.offer > .cover > .cover-overlay
{
	display: none;
}

.e-5677af83 > .holder.offer:hover > .cover::before
{
	transform: scale(1);
}

.e-5677af83 > .holder.offer .shot
{
	width: 32px;
	height: 32px;
	margin-top: -16px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--offer-ink);
}

.e-5677af83 > .holder.offer .shot:hover
{
	background: #ffffff;
	transform: none;
}

.e-5677af83 > .holder.offer .shot > i
{
	font-size: 20px;
}

/* ===== OFFER — cipovi na fotografiji ===== */

.e-5677af83 > .holder.offer .cover-top
{
	top: 12px;
	left: 12px;
	right: 62px;
	gap: 6px;
}

.e-5677af83 > .holder.offer .cover-top-right
{
	gap: 6px;
}

.e-5677af83 > .holder.offer .type-chip,
.e-5677af83 > .holder.offer .pool-chip,
.e-5677af83 > .holder.offer .badge,
.e-5677af83 > .holder.offer .badge.badge-brand,
.e-5677af83 > .holder.offer .badge.badge-dark,
.e-5677af83 > .holder.offer .badge.badge-green,
.e-5677af83 > .holder.offer .badge.badge-gold
{
	padding: 5px 11px;
	background: var(--offer-accent);
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	color: #ffffff;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.e-5677af83 > .holder.offer .type-chip > i,
.e-5677af83 > .holder.offer .pool-chip > i
{
	font-size: 13px;
	color: #ffffff;
}

/* Srce ostaje na fotografiji jer je u DOM-u dete .cover-a, ali preuzima izgled */
/* referentnog dugmeta iz reda sa nazivom: beo krug sa sivom ikonom i tankim obrubom. */

.e-5677af83 > .holder.offer .save
{
	bottom: 12px;
	right: 12px;
	width: 34px;
	height: 34px;
	background: #ffffff;
	border: 1px solid var(--ot-bg-3-border);
	color: var(--offer-muted);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.e-5677af83 > .holder.offer .save:hover
{
	transform: none;
	color: var(--offer-accent);
}

.e-5677af83 > .holder.offer .save > i
{
	font-size: 16px;
}

.e-5677af83 > .holder.offer.is-saved .save
{
	background: var(--offer-accent);
	border-color: var(--offer-accent);
	color: #ffffff;
}

.e-5677af83 > .holder.offer .cover-bottom
{
	bottom: 12px;
	left: 12px;
	right: 58px;
}

/* ===== OFFER — telo ===== */

/* Deca ostaju rastegnuta (podrazumevani stretch) — donja traka mora ici od ivice do ivice, */
/* a naziv preko cele sirine da bi klamp na dva reda imao gde da preseca. Destinacija i */
/* zvezdice se privijaju uz levu ivicu kroz .head ispod. */

.e-5677af83 > .holder.offer > .body
{
	gap: 8px;
	padding: 16px 16px 18px;
}

/* Referentna kartica ide naziv pa lokacija, a u DOM-u kartice je .head ispred .name-a — */
/* zato se redosled okrece kroz flex order, bez ijedne izmene u templatu. */

.e-5677af83 > .holder.offer > .body > .name
{
	order: 1;
}

.e-5677af83 > .holder.offer > .body > .head
{
	order: 2;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	width: 100%;
	min-height: 0;
}

.e-5677af83 > .holder.offer > .body > .highlights
{
	order: 4;
}

.e-5677af83 > .holder.offer > .body > .action
{
	order: 5;
}

.e-5677af83 > .holder.offer > .body > .name,
.e-5677af83 > .holder.offer:hover > .body > .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: normal;
	color: var(--offer-ink);
	font-variation-settings: normal;
}

.e-5677af83 > .holder.offer .destination
{
	gap: 5px;
	font-size: 13px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: var(--offer-muted);
}

/* Referentna kartica marker lokacije crta kao 'place' pin, ne kao zastavicu zemlje — */
/* tako i ture bez zemlje (14 od 48) dobiju isti marker kao ostale. */

.e-5677af83 > .holder.offer .destination > .destination-flag
{
	display: none;
}

.e-5677af83 > .holder.offer .destination::before
{
	content: 'place';
	font-family: 'Material Symbols Rounded';
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
}

.e-5677af83 > .holder.offer .stars
{
	gap: 2px;
}

/* Referentna sekcija zvezdicu crta kao Unicode ★ u obicnom spanu, pa je uvek PUNA. */
/* Material Symbols ima FILL osu prikovanu na 0 (core/back/items/html/icons.js), pa bi */
/* ligatura ostala konturna — zato se gasi i glif se ispisuje kroz ::before. */

.e-5677af83 > .holder.offer .stars > i
{
	font-size: 0;
	color: var(--offer-accent);
}

.e-5677af83 > .holder.offer .stars > i::before
{
	content: '★';
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	font-variation-settings: normal;
}

/* Referentna kartica ispod naziva ide pravo na lokaciju, zvezdice i sadrzaje smestaja — */
/* opisa nema, pa ga i kartica liste skriva da bi ritam tela bio isti. */

.e-5677af83 > .holder.offer > .body > .description
{
	display: none;
}

/* Sadrzaji smestaja u referentnoj kartici nisu uokvireni nego samo ikona plus natpis. */

.e-5677af83 > .holder.offer > .body > .highlights
{
	gap: 6px 12px;
	margin-top: 0;
}

.e-5677af83 > .holder.offer .highlight
{
	gap: 5px;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	font-size: 12px;
	font-weight: 500;
	color: var(--offer-muted);
}

.e-5677af83 > .holder.offer .highlight > i
{
	font-size: 16px;
	color: var(--offer-muted);
}

/* Lista ne isporucuje cenu ni polazak, pa bi donji red ostao prazan. */

.e-5677af83 > .holder.offer > .body > .footer
{
	display: none;
}

/* ===== OFFER — svetlo plava podnozna traka ===== */

.e-5677af83 > .holder.offer > .body > .action,
.e-5677af83 > .holder.offer:hover > .body > .action
{
	align-items: center;
	gap: 10px;
	margin: auto -16px -18px;
	padding: 16px;
	background: var(--offer-foot);
	border-top: 0;
}

.e-5677af83 > .holder.offer > .body > .action > .action-text,
.e-5677af83 > .holder.offer:hover > .body > .action > .action-text
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: normal;
	color: var(--offer-ink);
}

.e-5677af83 > .holder.offer > .body > .action > .action-arrow,
.e-5677af83 > .holder.offer:hover > .body > .action > .action-arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--offer-accent);
	font-size: 22px;
	color: #ffffff;
	transform: none;
	transition: background 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5677af83 > .holder.offer:hover > .body > .action > .action-arrow
{
	background: var(--offer-accent-hover);
}

/* ========================================== */
/* ===== STRIP VARIANT ====================== */
/* ========================================== */

/* Mozaik izgled: uspravna fotografija ispunjava celu karticu, a preko dna ide */
/* poluprovidna traka sa zvezdicama, nazivom, destinacijom i cipovima. */
/* Boje su ovde NEUTRALNE (tamna traka) — ton daje tema koja karticu koristi. */

.e-5677af83 > .holder.strip
{
	height: auto;
	aspect-ratio: 3 / 4;
	background: var(--ot-bg-3);
	border: 0;
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5677af83 > .holder.strip:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(20, 18, 16, 0.24);
}

.e-5677af83 > .holder.strip > .cover
{
	position: absolute;
	inset: 0;
	aspect-ratio: auto;
}

/* Traka sama nosi kontrast, pa gradijent preko fotografije nije potreban. */

.e-5677af83 > .holder.strip > .cover > .cover-overlay
{
	display: none;
}

/* Oznaka ide u gornji levi ugao (kao na referentnoj sekciji), srce u desni. */
/* Red sa trajanjem i prevozom se gasi jer te podatke nosi traka. */

.e-5677af83 > .holder.strip .cover-top
{
	top: 12px;
	left: 12px;
	right: 60px;
	flex-direction: row-reverse;
	justify-content: flex-end;
	gap: 6px;
}

.e-5677af83 > .holder.strip .cover-top-right
{
	margin-left: 0;
	justify-content: flex-start;
}

.e-5677af83 > .holder.strip .pool-chip,
.e-5677af83 > .holder.strip .cover-bottom
{
	display: none;
}

.e-5677af83 > .holder.strip .badge
{
	padding: 5px 11px;
	font-size: 11px;
	font-weight: 800;
	text-transform: none;
	letter-spacing: 0.01em;
}

.e-5677af83 > .holder.strip .save
{
	top: 12px;
	right: 12px;
	bottom: auto;
}

/* ===== STRIP — traka preko dna ===== */

.e-5677af83 > .holder.strip > .body
{
	position: relative;
	z-index: 0;
	flex: 0 0 auto;
	margin-top: auto;
	gap: 3px;
	padding: 12px 14px;
	background: rgba(20, 18, 16, 0.62);
	transition: background 260ms ease;
}

.e-5677af83 > .holder.strip:hover > .body
{
	background: rgba(20, 18, 16, 0.74);
}

/* Zvezdice, naziv pa destinacija idu jedno ispod drugog, a u sablonu su */
/* destinacija i zvezdice u istom redu — .head se rastvara da bi order radio. */

.e-5677af83 > .holder.strip .body > .head
{
	display: contents;
}

.e-5677af83 > .holder.strip .body > .head > .stars
{
	order: 1;
}

.e-5677af83 > .holder.strip > .body > .name,
.e-5677af83 > .holder.strip:hover > .body > .name
{
	order: 2;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: normal;
	color: white;
	font-variation-settings: normal;
}

.e-5677af83 > .holder.strip .body > .head > .destination
{
	order: 3;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none;
	letter-spacing: normal;
	color: rgba(255, 255, 255, 0.92);
}

.e-5677af83 > .holder.strip .stars > i
{
	font-size: 14px;
	color: rgba(245, 179, 1, 1);
}

/* ===== STRIP — cipovi sa detaljima ===== */

.e-5677af83 > .holder.strip > .body > .highlights
{
	order: 4;
	gap: 4px;
	margin-top: 3px;
}

.e-5677af83 > .holder.strip .highlight
{
	gap: 3px;
	padding: 2px 7px;
	background: rgba(255, 255, 255, 0.18);
	border: 0;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: white;
}

.e-5677af83 > .holder.strip .highlight > i
{
	font-size: 13px;
	color: inherit;
}

/* Opis, donji red i poziv na akciju referentna kartica nema — cela je jedan klik. */

.e-5677af83 > .holder.strip > .body > .description,
.e-5677af83 > .holder.strip > .body > .footer,
.e-5677af83 > .holder.strip > .body > .action
{
	display: none;
}

/* ========================================== */
/* ===== INSPIRE VARIANT ==================== */
/* ========================================== */

/* Izgled sekcije "Ne znate kuda? Inspirisite se!": preko dna fotografije ide */
/* dvoslojan talas koji prelazi u zuto telo sa zvezdicama, nazivom, lokacijom */
/* i okruglim cipovima. Sve vrednosti su IZMERENE na renderovanoj sekciji. */

.e-5677af83 > .holder.inspire
{
	background: var(--ot-bg-1);
	border: 0;
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5677af83 > .holder.inspire:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
}

.e-5677af83 > .holder.inspire > .cover
{
	aspect-ratio: 16 / 11;
}

/* Talas je ::after jer ::before vec nosi zumiranu fotografiju. Sedi UNUTAR */
/* .cover (koji ima overflow: hidden), pa nema negativnih margina ni uticaja */
/* na razmake tela. z-index 4 ga drzi iznad scrima, srca i strelica galerije. */

.e-5677af83 > .holder.inspire > .cover::after
{
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 4;
	height: 46px;
	pointer-events: none;
	background-image:
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,48 C200,23 400,73 600,48 C800,23 1000,73 1200,48 L1200,100 L0,100 Z' fill='%23f5c518'/></svg>"),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,30 C200,5 400,55 600,30 C800,5 1000,55 1200,30 L1200,100 L0,100 Z' fill='%238fc9f2'/></svg>");
	background-position: bottom, bottom;
	background-size: 100% 100%, 100% 100%;
	background-repeat: no-repeat, no-repeat;
}

/* Referentna kartica nema zatamnjenje preko fotografije. */

.e-5677af83 > .holder.inspire > .cover > .cover-overlay
{
	display: none;
}

/* Srce i traka trajanja idu iznad talasa da ne upadnu pod zuti greben. */

.e-5677af83 > .holder.inspire .save,
.e-5677af83 > .holder.inspire .cover-bottom
{
	bottom: 56px;
}

/* ===== INSPIRE — zuto telo ===== */

.e-5677af83 > .holder.inspire > .body
{
	gap: 3px;
	padding: 4px 22px 26px;
	background: #f5c518;
	border-radius: 0 0 var(--ot-radius-l) var(--ot-radius-l);
}

/* Referentni redosled je zvezdice, naziv, lokacija, cipovi — a u templatu */
/* .head (lokacija + zvezdice) stoji PRE naziva, pa se raspusti u contents. */

.e-5677af83 > .holder.inspire .body > .head
{
	display: contents;
}

.e-5677af83 > .holder.inspire .body > .head > .stars
{
	order: 1;
}

.e-5677af83 > .holder.inspire .stars > i
{
	font-size: 14px;
	color: #1c1a12;
}

.e-5677af83 > .holder.inspire > .body > .name,
.e-5677af83 > .holder.inspire:hover > .body > .name
{
	order: 2;
	font-family: var(--ot-font-primary);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: #0d3b66;
	font-variation-settings: normal;
}

/* Bez zvezdica naziv bi se digao za red zvezdica (14px) plus razmak (3px), */
/* pa nazivi ne bi bili u istoj liniji. Mereno na svih 48 kartica. */

.e-5677af83 > .holder.inspire .body > .head:not(:has(> .stars)) + .name
{
	margin-top: 17px;
}

.e-5677af83 > .holder.inspire .body > .head > .destination
{
	order: 3;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: normal;
	color: rgba(28, 26, 18, 0.85);
}

/* ===== INSPIRE — cipovi sa detaljima ===== */

.e-5677af83 > .holder.inspire > .body > .highlights
{
	order: 4;
	gap: 4px;
	margin-top: 5px;
}

.e-5677af83 > .holder.inspire .highlight
{
	gap: 3px;
	padding: 2px 7px;
	background: rgba(28, 26, 18, 0.10);
	border: 0;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: #1c1a12;
}

.e-5677af83 > .holder.inspire .highlight > i
{
	font-size: 13px;
	color: inherit;
}

/* Opis, donji red i poziv na akciju referentna kartica nema — cela je jedan klik. */

.e-5677af83 > .holder.inspire > .body > .description,
.e-5677af83 > .holder.inspire > .body > .footer,
.e-5677af83 > .holder.inspire > .body > .action
{
	display: none;
}

/* ========================================== */
/* ===== OVERLAP VARIANT ==================== */
/* ========================================== */

/* Izgled kartica iz sekcije "Letovanje - Izaberite idealnu destinaciju za leto" */
/* (section-overlap-cards-1): zaobljena 4/3 fotografija, oznaka preko njenog */
/* gornjeg levog ugla i uze belo telo koje pluta preko dna fotografije. Sve */
/* vrednosti su IZMERENE na renderovanoj sekciji, ne prepisane iz njenog CSS-a. */

/* Sam holder je providan — kartu crtaju fotografija i telo, pa mora i da */
/* prestane da isece sadrzaj da senka plutajuceg tela ne bude odsecena. */

.e-5677af83 > .holder.overlap
{
	background: transparent;
	border: 0;
	border-radius: 0;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5677af83 > .holder.overlap:hover
{
	transform: translateY(-6px);
}

/* Fotografija sada sama nosi uglove jer je holder prestao da isece. */

.e-5677af83 > .holder.overlap > .cover
{
	border-radius: var(--ot-radius-m);
}

/* Referentna kartica nema zatamnjenje preko fotografije. */

.e-5677af83 > .holder.overlap > .cover > .cover-overlay
{
	display: none;
}

/* Oznaka stoji uz LEVU ivicu, pa gornji red gubi razmak izmedu krajeva. */

.e-5677af83 > .holder.overlap .cover-top
{
	justify-content: flex-start;
}

.e-5677af83 > .holder.overlap .cover-top-right
{
	margin-left: 0;
}

.e-5677af83 > .holder.overlap .badge
{
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 11px;
	letter-spacing: 0.06em;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.22);
}

/* Srce i traka trajanja se dizu iznad plutajuceg tela (preklop je 44px). */

.e-5677af83 > .holder.overlap .save,
.e-5677af83 > .holder.overlap .cover-bottom
{
	bottom: 58px;
}

/* ===== OVERLAP — plutajuce telo ===== */

/* z-index 0 drzi telo iznad fotografije, a ispod .link-a (z 1) — cela kartica */
/* zato ostaje jedan klik, dok srce (z 2) i strelice (z 3) i dalje rade. */

.e-5677af83 > .holder.overlap > .body
{
	position: relative;
	z-index: 0;
	gap: 0;
	width: 88%;
	align-self: center;
	box-sizing: border-box;
	margin-top: -44px;
	padding: 20px 20px 22px;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* Destinacija je pilula u akcentu referentne sekcije, zvezdice ostaju uz nju. */

.e-5677af83 > .holder.overlap .body > .head
{
	gap: 10px;
}

.e-5677af83 > .holder.overlap .destination
{
	flex: 0 1 auto;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: white;
}

.e-5677af83 > .holder.overlap .destination > .destination-text
{
	color: inherit;
}

.e-5677af83 > .holder.overlap > .body > .name
{
	margin-top: 12px;
	min-height: 2.5em;
	font-family: var(--ot-font-primary);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: normal;
	color: var(--ot-brand);
	font-variation-settings: normal;
}

.e-5677af83 > .holder.overlap > .body > .description
{
	margin-top: 10px;
}

/* ===== OVERLAP — cipovi sa detaljima ===== */

.e-5677af83 > .holder.overlap > .body > .highlights
{
	gap: 6px 10px;
	margin-top: 14px;
}

.e-5677af83 > .holder.overlap .highlight
{
	gap: 4px;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border: 0;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--ot-text-2);
}

.e-5677af83 > .holder.overlap .highlight > i
{
	font-size: 15px;
	color: #14b8a6;
}

/* Donji red je prazan (nema polaska ni cene) pa preuzima ulogu razmaknice iz */
/* referentne kartice — guta visak visine da dugme ostane prikovano na dnu. */

.e-5677af83 > .holder.overlap > .body > .footer
{
	flex: 1 1 auto;
	min-height: 0;
	margin: 0;
	padding: 0;
}

/* ===== OVERLAP — dugme preko cele sirine ===== */

.e-5677af83 > .holder.overlap > .body > .action
{
	justify-content: center;
	margin: 20px 0 0;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-5677af83 > .holder.overlap:hover > .body > .action
{
	background: transparent;
	border-color: var(--ot-text-2);
}

.e-5677af83 > .holder.overlap > .body > .action > .action-text
{
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ot-text-2);
}

.e-5677af83 > .holder.overlap:hover > .body > .action > .action-text
{
	color: var(--ot-text-1);
}

/* Referentno dugme nema strelicu — natpis stoji centriran. */

.e-5677af83 > .holder.overlap > .body > .action > .action-arrow
{
	display: none;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 700px)
{
	.e-5677af83 > .holder.horizontal
	{
		flex-direction: column;
	}

	.e-5677af83 > .holder.horizontal > .cover
	{
		width: 100%;
		min-width: 0;
		aspect-ratio: 4 / 3;
	}
}

/* Uspravna kartica preko cele sirine bi bila visa od ekrana (mereno 853px na */
/* 640px sirine), pa se na jednoj koloni spljosti. */

@media (max-width: 640px)
{
	.e-5677af83 > .holder.overlay,
	.e-5677af83 > .holder.strip
	{
		aspect-ratio: 3 / 2.4;
	}

	.e-5677af83 > .holder.inspire > .body
	{
		padding: 4px 18px 22px;
	}

	/* Referentna sekcija na jednoj koloni smanjuje preklop tela na 28px. */

	.e-5677af83 > .holder.overlap > .body
	{
		margin-top: -28px;
	}

	.e-5677af83 > .holder.overlap .save,
	.e-5677af83 > .holder.overlap .cover-bottom
	{
		bottom: 42px;
	}
}
.e-59ffb03
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.e-59ffb03 .social-icon
{
	display: block;
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.e-59ffb03 .social-icon.size-s
{
	width: 15px;
	height: 15px;
}

.e-59ffb03 .social-icon.size-l
{
	width: 22px;
	height: 22px;
}

.e-59ffb03 .social-icon.fallback
{
	font-family: 'Material Symbols Rounded';
	font-style: normal;
	font-size: 18px;
}
.e-3ec532c
{
	display: block;
	width: 100%;
}

.e-3ec532c > .holder
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--ot-text-2);
}

.e-3ec532c .crumb
{
	color: currentColor;
	opacity: 0.55;
	text-transform: uppercase;
	transition: opacity 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3ec532c .crumb:hover
{
	opacity: 1;
}

.e-3ec532c .crumb.active
{
	opacity: 1;
	color: var(--ot-brand);
}

.e-3ec532c .crumb:not(:last-child)::after
{
	content: '/';
	margin-left: 8px;
	opacity: 0.45;
}
.e-20d399b0
{
	display: block;
	width: 100%;
}

.e-20d399b0 > .holder
{
	width: 100%;
}

.e-20d399b0 > .holder > .line
{
	display: block;
	width: 100%;
}

/* ===== INTENSITY ===== */

.e-20d399b0 > .holder.style-1 > .line
{
	height: 1px;
	background: var(--ot-bg-2-border);
}

.e-20d399b0 > .holder.style-2 > .line
{
	height: 1px;
	background: var(--ot-bg-3-border);
}

.e-20d399b0 > .holder.style-3 > .line
{
	height: 2px;
	background: var(--ot-brand);
}

.e-20d399b0 > .holder.style-4 > .line
{
	height: 3px;
	background: var(--ot-text-1);
}
.e-55752aec
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-55752aec > .holder
{
	width: 100%;
}

.e-55752aec > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: rgba(255, 255, 255, 0.78);
}

.e-55752aec > .holder.tone-light
{
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
}

.e-55752aec > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 64px 32px 28px;
}

/* ========================================== */
/* ===== BRAND ZONE ========================= */
/* ========================================== */

.e-55752aec .brand-zone
{
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 28px;
	padding-bottom: 36px;
	margin-bottom: 36px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.e-55752aec > .holder.tone-light .brand-zone
{
	border-bottom-color: var(--ot-bg-3-border);
}

.e-55752aec .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: inherit;
	flex-shrink: 0;
}

.e-55752aec .brand > .brand-logo
{
	height: 36px;
	width: auto;
	display: block;
}

.e-55752aec .brand > .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: white;
	font-variation-settings: 'opsz' 144;
}

.e-55752aec > .holder.tone-light .brand > .brand-name
{
	color: var(--ot-text-1);
}

.e-55752aec .brand-tagline
{
	font-size: 13px;
	line-height: 1.6;
	max-width: 420px;
	letter-spacing: 0.005em;
}

.e-55752aec .brand-aside
{
	display: flex;
	align-items: center;
	gap: 24px;
	flex-shrink: 0;
	margin-left: auto;
}

/* Languages switcher */

.e-55752aec .languages
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	padding: 4px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 100px;
}

.e-55752aec > .holder.tone-light .languages
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
}

.e-55752aec .language
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	padding: 6px 10px;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.65);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms;
}

.e-55752aec > .holder.tone-light .language
{
	color: var(--ot-text-3);
}

.e-55752aec .language:hover
{
	color: white;
}

.e-55752aec > .holder.tone-light .language:hover
{
	color: var(--ot-text-1);
}

.e-55752aec .language.active
{
	background: white;
	color: var(--ot-text-1);
}

.e-55752aec > .holder.tone-light .language.active
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

/* Socials */

.e-55752aec .socials
{
	display: inline-flex;
	gap: 4px;
}

.e-55752aec .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 50%;
	color: rgba(255, 255, 255, 0.78);
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms, border-color 200ms;
}

.e-55752aec > .holder.tone-light .social
{
	border-color: var(--ot-bg-3-border);
	color: var(--ot-text-2);
}

.e-55752aec .social:hover
{
	background: white;
	color: var(--ot-text-1);
	border-color: white;
}

.e-55752aec > .holder.tone-light .social:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-55752aec .social > i
{
	font-size: 18px;
}

/* ========================================== */
/* ===== MAIN ZONE (columns + contact) ====== */
/* ========================================== */

.e-55752aec .main-zone
{
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 64px;
	padding-bottom: 48px;
	margin-bottom: 28px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.e-55752aec > .holder.tone-light .main-zone
{
	border-bottom-color: var(--ot-bg-3-border);
}

.e-55752aec .columns
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px 36px;
}

.e-55752aec .column
{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-55752aec .column-title
{
	font-size: 11px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	margin-bottom: 8px;
}

.e-55752aec > .holder.tone-light .column-title
{
	color: var(--ot-text-1);
}

.e-55752aec .link
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.7);
	letter-spacing: 0;
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1), transform 180ms;
	width: fit-content;
}

.e-55752aec > .holder.tone-light .link
{
	color: var(--ot-text-2);
}

.e-55752aec .link:hover
{
	color: white;
	transform: translateX(2px);
}

.e-55752aec > .holder.tone-light .link:hover
{
	color: var(--ot-brand);
}

.e-55752aec .link > .link-icon
{
	font-size: 15px;
	opacity: 0.65;
}

.e-55752aec .link > .link-badge
{
	display: inline-flex;
	align-items: center;
	padding: 1px 6px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* Contact */

.e-55752aec .contact
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-55752aec .contact-title
{
	font-size: 11px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	margin-bottom: 8px;
}

.e-55752aec > .holder.tone-light .contact-title
{
	color: var(--ot-text-1);
}

.e-55752aec .contact-row
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	color: inherit;
	transition: transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aec .contact-row:hover
{
	transform: translateX(2px);
}

.e-55752aec .contact-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.06);
	flex-shrink: 0;
}

.e-55752aec > .holder.tone-light .contact-icon
{
	background: var(--ot-bg-3);
}

.e-55752aec .contact-icon > i
{
	font-size: 17px;
	color: rgba(255, 255, 255, 0.78);
}

.e-55752aec > .holder.tone-light .contact-icon > i
{
	color: var(--ot-text-2);
}

.e-55752aec .contact-row:hover .contact-icon
{
	background: var(--ot-brand);
}

.e-55752aec .contact-row:hover .contact-icon > i
{
	color: white;
}

.e-55752aec .contact-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-55752aec .contact-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.55);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-55752aec > .holder.tone-light .contact-label
{
	color: var(--ot-text-3);
}

.e-55752aec .contact-value
{
	font-size: 13.5px;
	font-weight: 600;
	color: white;
}

.e-55752aec > .holder.tone-light .contact-value
{
	color: var(--ot-text-1);
}

/* ========================================== */
/* ===== TRUST ZONE (partners/payments/awards) */
/* ========================================== */

.e-55752aec .trust-zone
{
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding-bottom: 32px;
	margin-bottom: 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.e-55752aec > .holder.tone-light .trust-zone
{
	border-bottom-color: var(--ot-bg-3-border);
}

.e-55752aec .trust-group
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-55752aec .trust-eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.55);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-55752aec > .holder.tone-light .trust-eyebrow
{
	color: var(--ot-text-3);
}

.e-55752aec .trust-mark
{
	width: 22px;
	height: 1px;
	background: var(--ot-brand);
}

.e-55752aec .trust-logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px 36px;
}

.e-55752aec .trust-logo
{
	display: inline-flex;
	align-items: center;
	height: 32px;
	color: rgba(255, 255, 255, 0.55);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.005em;
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms;
}

.e-55752aec > .holder.tone-light .trust-logo
{
	color: var(--ot-text-3);
}

.e-55752aec a.trust-logo
{
	cursor: pointer;
}

.e-55752aec a.trust-logo:hover
{
	color: white;
}

.e-55752aec > .holder.tone-light a.trust-logo:hover
{
	color: var(--ot-text-1);
}

.e-55752aec .trust-logo > img
{
	height: 100%;
	width: auto;
	max-width: 120px;
	object-fit: contain;
	opacity: 0.7;
	filter: grayscale(1) brightness(2);
	transition: opacity 200ms cubic-bezier(0.22, 1, 0.36, 1), filter 200ms;
}

.e-55752aec > .holder.tone-light .trust-logo > img
{
	filter: grayscale(1);
}

.e-55752aec a.trust-logo:hover > img,
.e-55752aec .trust-logos.payments .trust-logo > img,
.e-55752aec .trust-logos.awards .trust-logo > img
{
	opacity: 1;
}

.e-55752aec a.trust-logo:hover > img
{
	filter: none;
}

/* ========================================== */
/* ===== BOTTOM ZONE ======================== */
/* ========================================== */

.e-55752aec .bottom-zone
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.e-55752aec .bottom-left
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	font-size: 11.5px;
	color: rgba(255, 255, 255, 0.45);
	letter-spacing: 0.005em;
}

.e-55752aec > .holder.tone-light .bottom-left
{
	color: var(--ot-text-3);
}

.e-55752aec .bottom-sep
{
	opacity: 0.4;
}

.e-55752aec .bottom-links
{
	display: inline-flex;
	gap: 4px;
	flex-wrap: wrap;
}

.e-55752aec .bottom-link
{
	display: inline-flex;
	align-items: center;
	padding: 6px 10px;
	border-radius: 6px;
	font-size: 11.5px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.55);
	letter-spacing: 0.005em;
	transition: color 180ms, background 180ms;
}

.e-55752aec > .holder.tone-light .bottom-link
{
	color: var(--ot-text-3);
}

.e-55752aec .bottom-link:hover
{
	color: white;
	background: rgba(255, 255, 255, 0.05);
}

.e-55752aec > .holder.tone-light .bottom-link:hover
{
	color: var(--ot-text-1);
	background: var(--ot-bg-1);
}

/* ========================================== */
/* ===== NOTE ZONE ========================== */
/* ========================================== */

.e-55752aec .note-zone
{
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	font-size: 11.5px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.45);
	letter-spacing: 0.005em;
}

.e-55752aec > .holder.tone-light .note-zone
{
	border-top-color: var(--ot-bg-3-border);
	color: var(--ot-text-3);
}

/* ========================================== */
/* ===== CREDITS ZONE ======================= */
/* Traka firmi koje su izradile sajt. Stoji kao POSLEDNJI blok futera. */
/* Sve boje se izvode iz currentColor holdera, pa se zona sama uklopi */
/* i u tone-dark i u tone-light i u svaku sp-theme-N prepisanu paletu, */
/* bez ijednog dodatnog pravila u sections.css. */
/* ========================================== */

.e-55752aec .credits-zone
{
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent);
	text-align: center;
}

.e-55752aec .credits-title
{
	font-size: 10.5px;
	font-weight: 700;
	color: color-mix(in srgb, currentColor 88%, transparent);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

/* Jedan red, jednaki razmaci, centrirano. */

.e-55752aec .credits-logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 20px 48px;
	margin-top: 16px;
}

/* Logotipi firmi stizu sa nesaglasnim podlogama (jedan na beloj, jedan */
/* providan, jedan na crnoj), pa svaki dobija istu neutralnu belu plocicu. */
/* Tako se traka cita i na tamnom baznom futeru i na svetlim temama. */
/* Plocice su jednake visine i medjusobno centrirane. */

.e-55752aec .credits-logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 18px;
	border-radius: 10px;
	background: #ffffff;
	opacity: 0.86;
	transition: opacity 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aec .credits-logo:hover
{
	opacity: 1;
}

/* max-height izjednacava logotipe po visini, max-width sprecava da */
/* najsiri wordmark nadjaca ostale, a width/height auto + object-fit */
/* contain cuvaju originalni odnos stranica svake slike. */

.e-55752aec .credits-logo > img
{
	width: auto;
	height: auto;
	max-height: 28px;
	max-width: 168px;
	object-fit: contain;
}

/* Ispis imena kad firma nema logotip. */

.e-55752aec .credits-name
{
	font-size: 12.5px;
	font-weight: 600;
	color: color-mix(in srgb, currentColor 70%, transparent);
	letter-spacing: 0.005em;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* Breakpointi prate konvenciju: 1100 / 900 / 700 / 500 */
/* ========================================== */

@media (max-width: 1100px)
{
	.e-55752aec > .holder > .inner
	{
		padding: 56px 28px 24px;
	}

	.e-55752aec .main-zone
	{
		grid-template-columns: 1fr;
		gap: 44px;
	}

	/* Contact ide gore (puna širina) iznad kolona linkova. */

	.e-55752aec .contact
	{
		order: -1;
	}
}

@media (max-width: 900px)
{
	.e-55752aec > .holder > .inner
	{
		padding: 48px 24px 24px;
	}

	.e-55752aec .brand-zone
	{
		grid-template-columns: 1fr;
		gap: 20px;
		padding-bottom: 32px;
		margin-bottom: 32px;
	}

	.e-55752aec .brand-aside
	{
		flex-wrap: wrap;
		gap: 16px;
	}

	.e-55752aec .columns
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 28px 32px;
	}
}

@media (max-width: 700px)
{
	.e-55752aec .trust-logos
	{
		gap: 18px 24px;
	}

	.e-55752aec .bottom-zone
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	/* Na telefonu logotipi idu jedan ispod drugog, centrirano. */

	.e-55752aec .credits-logos
	{
		flex-direction: column;
		gap: 22px;
	}
}

@media (max-width: 500px)
{
	.e-55752aec > .holder > .inner
	{
		padding: 40px 18px 20px;
	}

	.e-55752aec .columns
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.e-55752aec .brand > .brand-logo
	{
		height: 30px;
	}

	.e-55752aec .brand-tagline
	{
		font-size: 12px;
	}

	.e-55752aec .bottom-left
	{
		font-size: 11px;
	}
}
.e-55752aed
{
	display: block;
	width: 100%;

	--fb-blue: rgba(37, 99, 235, 1);
	--fb-blue-hover: rgba(29, 78, 216, 1);
	--fb-blue-soft: rgba(37, 99, 235, 0.08);
	--fb-blue-line: rgba(37, 99, 235, 0.16);
}

/* ===== HOLDER + VARIANTS ===== */

.e-55752aed > .holder
{
	width: 100%;
	background: var(--ot-bg-1);
	color: var(--ot-text-2);
}

.e-55752aed > .holder.variant-brand
{
	background: rgba(37, 99, 235, 0.04);
}

.e-55752aed > .holder.variant-contrast
{
	background: rgba(15, 23, 42, 1);
	color: rgba(255, 255, 255, 0.72);

	--fb-blue: rgba(96, 165, 250, 1);
	--fb-blue-hover: rgba(147, 197, 253, 1);
	--fb-blue-soft: rgba(96, 165, 250, 0.14);
	--fb-blue-line: rgba(96, 165, 250, 0.22);
}

.e-55752aed > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 56px 32px 28px;
}

/* ========================================== */
/* ===== 1. APP BANNER ====================== */
/* ========================================== */

.e-55752aed .app-banner
{
	display: grid;
	grid-template-columns: 1fr auto auto;
	align-items: center;
	gap: 40px;
	padding: 28px 36px;
	margin-bottom: 48px;
	background: var(--fb-blue-soft);
	border: 1px solid var(--fb-blue-line);
	border-radius: var(--ot-radius-l);
}

.e-55752aed .app-title
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
}

.e-55752aed > .holder.variant-contrast .app-title
{
	color: white;
}

.e-55752aed .app-perks
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: 13px;
	color: var(--ot-text-3);
}

.e-55752aed > .holder.variant-contrast .app-perks
{
	color: rgba(255, 255, 255, 0.6);
}

.e-55752aed .app-perk
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.e-55752aed .app-perk-dot
{
	color: var(--fb-blue);
}

/* Phone mock */

.e-55752aed .app-phone-image
{
	height: 96px;
	width: auto;
	display: block;
	border-radius: 14px;
}

.e-55752aed .app-phone-mock
{
	position: relative;
	width: 62px;
	height: 96px;
	border-radius: 14px;
	background: linear-gradient(160deg, var(--fb-blue) 0%, var(--fb-blue-hover) 100%);
	box-shadow: var(--ot-shadow-m);
	display: flex;
	align-items: center;
	justify-content: center;
}

.e-55752aed .app-phone-notch
{
	position: absolute;
	top: 8px;
	left: 50%;
	transform: translateX(-50%);
	width: 22px;
	height: 4px;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.5);
}

.e-55752aed .app-phone-screen > i
{
	font-size: 30px;
	color: white;
}

/* QR + badges */

.e-55752aed .app-get
{
	display: flex;
	align-items: center;
	gap: 18px;
}

.e-55752aed .app-qr
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 76px;
	height: 76px;
	background: white;
	border: 1px solid var(--fb-blue-line);
	border-radius: var(--ot-radius-m);
}

.e-55752aed .app-qr-image
{
	width: 100%;
	height: 100%;
	object-fit: contain;
	border-radius: var(--ot-radius-m);
}

.e-55752aed .app-qr > i
{
	font-size: 58px;
	color: var(--ot-text-1);
}

.e-55752aed .app-badges
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.e-55752aed .app-badge
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	min-width: 160px;
	background: var(--ot-text-1);
	border-radius: var(--ot-radius-m);
	color: white;
	transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), background 180ms;
}

.e-55752aed .app-badge:hover
{
	transform: translateY(-2px);
	background: var(--fb-blue);
}

.e-55752aed .app-badge > i
{
	font-size: 22px;
}

.e-55752aed .app-badge-text
{
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}

.e-55752aed .app-badge-top
{
	font-size: 10px;
	opacity: 0.75;
	letter-spacing: 0.02em;
}

.e-55752aed .app-badge-store
{
	font-size: 15px;
	font-weight: 600;
}

/* ========================================== */
/* ===== 2. TABS ZONE ======================= */
/* ========================================== */

.e-55752aed .tabs-zone
{
	padding-bottom: 44px;
	margin-bottom: 44px;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-55752aed > .holder.variant-contrast .tabs-zone
{
	border-bottom-color: rgba(255, 255, 255, 0.1);
}

.e-55752aed .tabs-head
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 28px;
}

.e-55752aed .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1), background 180ms, border-color 180ms;
}

.e-55752aed > .holder.variant-contrast .tab
{
	border-color: rgba(255, 255, 255, 0.14);
	color: rgba(255, 255, 255, 0.7);
}

.e-55752aed .tab > i
{
	font-size: 18px;
}

.e-55752aed .tab:hover
{
	color: var(--fb-blue);
	border-color: var(--fb-blue-line);
}

.e-55752aed .tab.active
{
	background: var(--fb-blue);
	border-color: var(--fb-blue);
	color: white;
}

.e-55752aed .tabs-links
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 12px 24px;
}

.e-55752aed .tab-link
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-2);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
	width: fit-content;
}

.e-55752aed > .holder.variant-contrast .tab-link
{
	color: rgba(255, 255, 255, 0.68);
}

.e-55752aed .tab-link:hover
{
	color: var(--fb-blue);
}

/* ========================================== */
/* ===== 3. MAIN ZONE (columns + aside) ===== */
/* ========================================== */

.e-55752aed .main-zone
{
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 64px;
	padding-bottom: 44px;
	margin-bottom: 32px;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-55752aed > .holder.variant-contrast .main-zone
{
	border-bottom-color: rgba(255, 255, 255, 0.1);
}

.e-55752aed .columns
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px 36px;
}

.e-55752aed .column
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.e-55752aed .column-title
{
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: 4px;
}

.e-55752aed > .holder.variant-contrast .column-title
{
	color: white;
}

.e-55752aed .link
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-2);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1), transform 180ms;
	width: fit-content;
}

.e-55752aed > .holder.variant-contrast .link
{
	color: rgba(255, 255, 255, 0.68);
}

.e-55752aed .link:hover
{
	color: var(--fb-blue);
	transform: translateX(2px);
}

/* Aside: newsletter + socials + phone */

.e-55752aed .aside
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-55752aed .newsletter-title
{
	font-family: var(--ot-font-secondary);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.015em;
	color: var(--ot-text-1);
}

.e-55752aed > .holder.variant-contrast .newsletter-title
{
	color: white;
}

.e-55752aed .newsletter-subtitle
{
	margin-top: 6px;
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-text-3);
}

.e-55752aed > .holder.variant-contrast .newsletter-subtitle
{
	color: rgba(255, 255, 255, 0.6);
}

.e-55752aed .newsletter-form
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 6px 6px 6px 18px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	transition: border-color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed > .holder.variant-contrast .newsletter-form
{
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(255, 255, 255, 0.14);
}

.e-55752aed .newsletter-form:focus-within
{
	border-color: var(--fb-blue);
}

.e-55752aed .newsletter-form > input
{
	flex: 1;
	min-width: 0;
	border: none;
	background: transparent;
	font-family: var(--ot-font-primary);
	font-size: 13.5px;
	color: var(--ot-text-1);
	outline: none;
}

.e-55752aed > .holder.variant-contrast .newsletter-form > input
{
	color: white;
}

.e-55752aed .newsletter-form > input::placeholder
{
	color: var(--ot-text-3);
}

.e-55752aed .newsletter-form > button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border: none;
	border-radius: 50%;
	background: var(--fb-blue);
	color: white;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), transform 180ms;
}

.e-55752aed .newsletter-form > button:hover
{
	background: var(--fb-blue-hover);
	transform: scale(1.05);
}

.e-55752aed .newsletter-form > button > i
{
	font-size: 20px;
}

/* Socials */

.e-55752aed .socials
{
	display: inline-flex;
	gap: 8px;
}

.e-55752aed .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms, border-color 180ms;
}

.e-55752aed > .holder.variant-contrast .social
{
	border-color: rgba(255, 255, 255, 0.14);
	color: rgba(255, 255, 255, 0.72);
}

.e-55752aed .social:hover
{
	background: var(--fb-blue);
	border-color: var(--fb-blue);
	color: white;
}

/* Phone pill */

.e-55752aed .phone-pill
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	align-self: flex-start;
	padding: 12px 22px;
	background: var(--fb-blue-soft);
	border: 1px solid var(--fb-blue-line);
	border-radius: 100px;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed .phone-pill:hover
{
	background: var(--fb-blue);
}

.e-55752aed .phone-pill > i
{
	font-size: 22px;
	color: var(--fb-blue);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed .phone-pill:hover > i
{
	color: white;
}

.e-55752aed .phone-text
{
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.e-55752aed .phone-label
{
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ot-text-3);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed .phone-number
{
	font-size: 16px;
	font-weight: 700;
	color: var(--ot-text-1);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed > .holder.variant-contrast .phone-number
{
	color: white;
}

.e-55752aed .phone-pill:hover .phone-label,
.e-55752aed .phone-pill:hover .phone-number
{
	color: white;
}

/* ========================================== */
/* ===== 4. PARTNERS ======================== */
/* ========================================== */

.e-55752aed .partners
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 28px 44px;
	padding-bottom: 28px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-55752aed > .holder.variant-contrast .partners
{
	border-bottom-color: rgba(255, 255, 255, 0.1);
}

.e-55752aed .partner
{
	display: inline-flex;
	align-items: center;
	height: 26px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-3);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-55752aed .partner:hover
{
	color: var(--ot-text-1);
}

.e-55752aed > .holder.variant-contrast .partner:hover
{
	color: white;
}

.e-55752aed .partner > img
{
	height: 100%;
	width: auto;
	max-width: 120px;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.65;
	transition: opacity 180ms cubic-bezier(0.22, 1, 0.36, 1), filter 180ms;
}

.e-55752aed .partner:hover > img
{
	filter: none;
	opacity: 1;
}

/* ========================================== */
/* ===== 5. PAYMENTS ======================== */
/* ========================================== */

.e-55752aed .payments
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding-bottom: 24px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-55752aed > .holder.variant-contrast .payments
{
	border-bottom-color: rgba(255, 255, 255, 0.1);
}

.e-55752aed .payments-label
{
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ot-text-2);
}

.e-55752aed > .holder.variant-contrast .payments-label
{
	color: rgba(255, 255, 255, 0.7);
}

.e-55752aed .payments-items
{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.e-55752aed .payments-item
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 30px;
	min-width: 48px;
	padding: 0 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 6px;
	font-size: 11.5px;
	font-weight: 700;
	color: var(--ot-text-2);
	letter-spacing: 0.02em;
}

.e-55752aed > .holder.variant-contrast .payments-item
{
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(255, 255, 255, 0.14);
	color: rgba(255, 255, 255, 0.78);
}

.e-55752aed .payments-item > img
{
	height: 18px;
	width: auto;
	object-fit: contain;
}

.e-55752aed .payments-agent
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 16px;
	background: var(--fb-blue-soft);
	border: 1px solid var(--fb-blue-line);
	border-radius: 100px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--fb-blue);
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-55752aed .payments-agent:hover
{
	background: var(--fb-blue);
	color: white;
}

.e-55752aed .payments-agent > i
{
	font-size: 17px;
}

/* ========================================== */
/* ===== 6. BOTTOM ========================== */
/* ========================================== */

.e-55752aed .bottom
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.e-55752aed .bottom-left
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-55752aed .copyright
{
	font-size: 12.5px;
	color: var(--ot-text-2);
}

.e-55752aed > .holder.variant-contrast .copyright
{
	color: rgba(255, 255, 255, 0.7);
}

.e-55752aed .legal
{
	font-size: 11px;
	line-height: 1.5;
	color: var(--ot-text-3);
	max-width: 620px;
}

.e-55752aed > .holder.variant-contrast .legal
{
	color: rgba(255, 255, 255, 0.45);
}

.e-55752aed .bottom-links
{
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
}

.e-55752aed .bottom-link
{
	display: inline-flex;
	align-items: center;
	padding: 6px 10px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1), background 180ms;
}

.e-55752aed .bottom-link:hover
{
	color: var(--fb-blue);
	background: var(--fb-blue-soft);
}

.e-55752aed .version
{
	margin-top: 14px;
	text-align: right;
	font-size: 10.5px;
	color: var(--ot-text-3);
	opacity: 0.7;
}

.e-55752aed > .holder.variant-contrast .version
{
	color: rgba(255, 255, 255, 0.4);
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* Breakpointi: 1100 / 900 / 700 / 500 */
/* ========================================== */

@media (max-width: 1100px)
{
	.e-55752aed > .holder > .inner
	{
		padding: 48px 28px 24px;
	}

	.e-55752aed .main-zone
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-55752aed .aside
	{
		order: -1;
	}

	.e-55752aed .tabs-links
	{
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 900px)
{
	.e-55752aed .app-banner
	{
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 24px;
	}

	.e-55752aed .app-phone
	{
		display: none;
	}

	.e-55752aed .tabs-links
	{
		grid-template-columns: repeat(3, 1fr);
	}

	.e-55752aed .columns
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 28px 32px;
	}
}

@media (max-width: 700px)
{
	.e-55752aed .app-get
	{
		flex-wrap: wrap;
	}

	.e-55752aed .tabs-links
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-55752aed .payments
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.e-55752aed .bottom
	{
		flex-direction: column;
	}
}

@media (max-width: 500px)
{
	.e-55752aed > .holder > .inner
	{
		padding: 40px 18px 20px;
	}

	.e-55752aed .app-badges
	{
		flex-direction: row;
		flex-wrap: wrap;
	}

	.e-55752aed .app-badge
	{
		min-width: 0;
	}

	.e-55752aed .tabs-links
	{
		grid-template-columns: 1fr;
	}

	.e-55752aed .columns
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.e-55752aed .version
	{
		text-align: left;
	}
}
.e-55752aee
{
	display: block;
	width: 100%;
}

.e-55752aee > .holder
{
	width: 100%;
	background: var(--ot-bg-1);
	color: var(--ot-text-2);
	border-top: 1px solid var(--ot-bg-1-border);
}

.e-55752aee > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 48px 32px 40px;
}

/* ========================================== */
/* ===== 1. LINK COLUMNS ==================== */
/* ========================================== */

.e-55752aee .columns-zone
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
}

.e-55752aee .column
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-55752aee .column-title
{
	margin-bottom: 4px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ot-text-1);
}

.e-55752aee a.brand-title
{
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-55752aee a.brand-title:hover
{
	color: var(--ot-blue);
}

.e-55752aee .link
{
	font-size: 14px;
	line-height: 1.4;
	color: var(--ot-text-2);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-55752aee .link:hover
{
	color: var(--ot-blue);
}

/* ===== CONTACT COLUMN ===== */

.e-55752aee .contact-company
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-55752aee .contact-address
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-55752aee .contact-line
{
	font-size: 14px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-55752aee .contact-phone,
.e-55752aee .contact-fax
{
	margin-top: 2px;
}

.e-55752aee .socials
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
}

.e-55752aee .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-1-border);
	color: var(--ot-text-2);
	transition: color var(--ot-transition), background var(--ot-transition), border-color var(--ot-transition);
}

.e-55752aee .social:hover
{
	color: var(--ot-blue);
	background: var(--ot-bg-1);
	border-color: var(--ot-blue-border);
}

/* ========================================== */
/* ===== 2. PARTNER STRIP =================== */
/* ========================================== */

.e-55752aee .partners-zone
{
	margin-top: 40px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--ot-bg-1-border);
}

.e-55752aee .strip-title
{
	margin-bottom: 16px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ot-text-1);
}

.e-55752aee .partners-logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 32px;
}

/* ========================================== */
/* ===== 3. TRUST GROUPS ==================== */
/* ========================================== */

.e-55752aee .trust-zone
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	margin-top: 32px;
}

.e-55752aee .trust-logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
}

/* ===== SHARED LOGO CHIP ===== */

.e-55752aee .logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	color: var(--ot-text-3);
	text-decoration: none;
	filter: grayscale(1);
	opacity: 0.7;
	transition: opacity var(--ot-transition), filter var(--ot-transition);
}

.e-55752aee .logo img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752aee a.logo:hover
{
	filter: grayscale(0);
	opacity: 1;
}

.e-55752aee .logo > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-s);
	background: var(--ot-bg-2);
	color: var(--ot-text-3);
	white-space: nowrap;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 960px)
{
	.e-55752aee .columns-zone
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 32px;
	}

	.e-55752aee .trust-zone
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

@media (max-width: 560px)
{
	.e-55752aee > .holder > .inner
	{
		padding: 36px 20px 32px;
	}

	.e-55752aee .columns-zone
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-55752aee .partners-logos
	{
		gap: 20px;
	}
}
.e-55752aef
{
	display: block;
	width: 100%;
}

.e-55752aef > .holder
{
	width: 100%;
	background: #f4efe6;
	color: #1f1d1a;
}

.e-55752aef > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 56px 32px 40px;
}

/* ========================================== */
/* ===== TOP ZONE =========================== */
/* ========================================== */

.e-55752aef .top-zone
{
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 56px;
}

/* ===== LEFT: REGION + NEWSLETTER ===== */

.e-55752aef .lead-zone
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.e-55752aef .region-label
{
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #3a3730;
}

.e-55752aef .region-field
{
	position: relative;
	width: 100%;
	max-width: 240px;
}

.e-55752aef .region-select
{
	width: 100%;
	padding: 11px 40px 11px 14px;
	font-size: 14px;
	font-family: inherit;
	color: #1f1d1a;
	background: #ffffff;
	border: 1px solid rgba(31, 29, 26, 0.18);
	border-radius: var(--ot-radius-s);
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	transition: border-color var(--ot-transition);
}

.e-55752aef .region-select:hover
{
	border-color: rgba(31, 29, 26, 0.35);
}

.e-55752aef .region-chevron
{
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	font-size: 20px;
	color: #6b665c;
	pointer-events: none;
}

.e-55752aef .promo
{
	margin: 28px 0 0;
	max-width: 260px;
	font-size: 14px;
	line-height: 1.55;
	color: #3a3730;
}

.e-55752aef .promo-link
{
	color: #1f1d1a;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752aef .promo-link:hover
{
	color: #000000;
}

.e-55752aef .newsletter-btn
{
	margin-top: 20px;
	padding: 13px 26px;
	font-size: 14px;
	font-weight: 700;
	color: #ffffff;
	background: #16140f;
	border-radius: 100px;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-55752aef .newsletter-btn:hover
{
	background: #2c2820;
}

/* ===== RIGHT: LINK COLUMNS ===== */

.e-55752aef .columns-zone
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
}

.e-55752aef .column
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-55752aef .column-title
{
	margin-bottom: 4px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #1f1d1a;
}

.e-55752aef .link
{
	display: inline-flex;
	align-items: flex-start;
	gap: 6px;
	font-size: 14px;
	line-height: 1.4;
	color: #3a3730;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-55752aef .link:hover
{
	color: #16140f;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752aef .link > .link-icon
{
	flex-shrink: 0;
	font-size: 17px;
	line-height: 1.2;
	color: #6b665c;
}

/* ========================================== */
/* ===== BOTTOM ZONE ======================== */
/* ========================================== */

.e-55752aef .bottom-zone
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 44px;
	padding-top: 28px;
	border-top: 1px solid rgba(31, 29, 26, 0.14);
}

.e-55752aef .cert-zone
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-55752aef .cert
{
	display: inline-flex;
	align-items: center;
	height: 30px;
	color: #4a463f;
	text-decoration: none;
	filter: grayscale(1);
	opacity: 0.85;
	transition: opacity var(--ot-transition);
}

.e-55752aef .cert:hover
{
	opacity: 1;
}

.e-55752aef .cert img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752aef .cert > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 14px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: #4a463f;
	border: 1px solid rgba(31, 29, 26, 0.2);
	border-radius: var(--ot-radius-s);
	white-space: nowrap;
}

.e-55752aef .socials
{
	display: flex;
	align-items: center;
	gap: 18px;
}

.e-55752aef .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #16140f;
	transition: opacity var(--ot-transition);
}

.e-55752aef .social:hover
{
	opacity: 0.6;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 1024px)
{
	.e-55752aef .top-zone
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-55752aef .columns-zone
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 32px;
	}
}

@media (max-width: 640px)
{
	.e-55752aef > .holder > .inner
	{
		padding: 40px 20px 32px;
	}

	.e-55752aef .columns-zone
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-55752aef .bottom-zone
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
	}
}
.e-55752af0
{
	display: block;
	width: 100%;
}

.e-55752af0 > .holder
{
	width: 100%;
	padding: 0 24px;
}

.e-55752af0 > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 56px 56px 36px;
	background: #dcebfa;
	color: #141a22;
	border-radius: 32px 32px 0 0;
}

/* ========================================== */
/* ===== TOP ZONE =========================== */
/* ========================================== */

.e-55752af0 .top-zone
{
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 56px;
}

/* ===== LEFT: CONTACT ===== */

.e-55752af0 .contact-col
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.e-55752af0 .logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	height: 56px;
	padding: 8px 14px;
	background: #ffffff;
	border-radius: var(--ot-radius-m);
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(20, 26, 34, 0.08);
}

.e-55752af0 .logo img
{
	height: 32px;
	width: auto;
	object-fit: contain;
}

.e-55752af0 .logo-text
{
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--ot-orange, #f5701a);
}

.e-55752af0 .contact-title
{
	margin: 24px 0 12px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 800;
	color: #141a22;
}

.e-55752af0 .contact-line
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 14px;
	color: #2a323d;
	text-decoration: none;
}

.e-55752af0 .contact-line > .contact-icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: #5a6572;
}

.e-55752af0 .contact-line > .contact-email
{
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752af0 .contact-line:hover
{
	color: #141a22;
}

.e-55752af0 .contact-subtitle
{
	margin: 22px 0 10px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 800;
	color: #141a22;
}

.e-55752af0 .hours
{
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
	max-width: 260px;
}

.e-55752af0 .hours-row
{
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: #2a323d;
}

.e-55752af0 .hours-day
{
	color: #2a323d;
}

.e-55752af0 .hours-time
{
	color: #5a6572;
	white-space: nowrap;
}

.e-55752af0 .company
{
	margin-top: 22px;
}

.e-55752af0 .company-name
{
	font-size: 13px;
	font-weight: 800;
	color: #141a22;
}

.e-55752af0 .company-address
{
	margin-top: 4px;
	font-size: 13px;
	font-style: normal;
	line-height: 1.5;
	color: #5a6572;
}

/* ===== RIGHT: LINK COLUMNS ===== */

.e-55752af0 .columns-zone
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
}

.e-55752af0 .column
{
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.e-55752af0 .group
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-55752af0 .column-title
{
	font-size: 13px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #141a22;
}

.e-55752af0 .link
{
	display: inline-flex;
	align-items: flex-start;
	gap: 6px;
	font-size: 14px;
	line-height: 1.4;
	color: #2a323d;
	text-decoration: none;
	transition: color var(--ot-transition), transform var(--ot-transition);
}

.e-55752af0 .link > .arrow
{
	flex-shrink: 0;
	font-size: 17px;
	line-height: 1.35;
	color: #5a6572;
	transition: transform var(--ot-transition);
}

.e-55752af0 .link:hover
{
	color: #141a22;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752af0 .link:hover > .arrow
{
	transform: translateX(3px);
}

/* ========================================== */
/* ===== DIVIDER + SLOGAN =================== */
/* ========================================== */

.e-55752af0 .divider
{
	height: 1px;
	margin: 40px 0;
	background: rgba(20, 26, 34, 0.14);
}

.e-55752af0 .slogan-zone
{
	padding: 8px 0 24px;
}

.e-55752af0 .slogan
{
	margin: 0;
	font-family: inherit;
	font-size: clamp(40px, 8vw, 104px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	text-align: left;
	color: #141a22;
}

/* ========================================== */
/* ===== BOTTOM ZONE ======================== */
/* ========================================== */

.e-55752af0 .bottom-zone
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
}

.e-55752af0 .bottom-left
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.e-55752af0 .trust
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-55752af0 .trust-badge
{
	display: inline-flex;
	align-items: center;
	height: 30px;
	color: #4a535f;
	text-decoration: none;
	filter: grayscale(1);
	opacity: 0.85;
	transition: opacity var(--ot-transition);
}

.e-55752af0 .trust-badge:hover
{
	opacity: 1;
}

.e-55752af0 .trust-badge img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752af0 .trust-badge > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: #4a535f;
	border: 1px solid rgba(20, 26, 34, 0.2);
	border-radius: var(--ot-radius-s);
	white-space: nowrap;
}

.e-55752af0 .trustpilot
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 30px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 700;
	color: #141a22;
	text-decoration: none;
	background: #ffffff;
	border-radius: var(--ot-radius-s);
	box-shadow: 0 1px 6px rgba(20, 26, 34, 0.08);
	transition: opacity var(--ot-transition);
}

.e-55752af0 .trustpilot:hover
{
	opacity: 0.75;
}

.e-55752af0 .trustpilot > .trustpilot-star
{
	font-size: 18px;
	color: #00b67a;
}

.e-55752af0 .socials
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-55752af0 .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: #141a22;
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0 1px 6px rgba(20, 26, 34, 0.08);
	transition: opacity var(--ot-transition);
}

.e-55752af0 .social:hover
{
	opacity: 0.65;
}

.e-55752af0 .bottom-right
{
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.e-55752af0 .legal
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

.e-55752af0 .legal-link
{
	font-size: 13px;
	color: #2a323d;
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--ot-transition);
}

.e-55752af0 .legal-link:hover
{
	color: #141a22;
}

.e-55752af0 .copy
{
	font-size: 13px;
	color: #5a6572;
	white-space: nowrap;
}

.e-55752af0 .payments
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.e-55752af0 .payment
{
	display: inline-flex;
	align-items: center;
	height: 24px;
}

.e-55752af0 .payment img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752af0 .payment > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #4a535f;
	background: #ffffff;
	border: 1px solid rgba(20, 26, 34, 0.16);
	border-radius: 4px;
	white-space: nowrap;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 1024px)
{
	.e-55752af0 > .holder > .inner
	{
		padding: 44px 36px 32px;
	}

	.e-55752af0 .top-zone
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-55752af0 .columns-zone
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 32px;
	}
}

@media (max-width: 640px)
{
	.e-55752af0 > .holder
	{
		padding: 0 12px;
	}

	.e-55752af0 > .holder > .inner
	{
		padding: 36px 22px 28px;
		border-radius: 24px 24px 0 0;
	}

	.e-55752af0 .columns-zone
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-55752af0 .bottom-zone
	{
		flex-direction: column;
		align-items: center;
		gap: 24px;
		text-align: center;
	}

	.e-55752af0 .bottom-left,
	.e-55752af0 .bottom-right
	{
		justify-content: center;
	}
}
/* ===== BEGIN: layout-footer-6 (žuti blok sa tabovima destinacija + tamno plavi kontakt blok) ===== */

.e-55752af1 { display: block; width: 100%; }

.e-55752af1 > .holder { width: 100%; }

/* Iste horizontalne margine kao .ot-container-l da se podnožje poklopi sa sekcijama iznad. */

.e-55752af1 .inner { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 calc(var(--ot-spacing-m) * 2); }

/* ===== ŽUTA TRAKA ===== */

.e-55752af1 .band-yellow { width: 100%; background: #ffd400; color: #141e5a; }

.e-55752af1 .band-yellow > .inner { padding-top: 40px; padding-bottom: 48px; }

.e-55752af1 .tabs { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px; margin-bottom: 28px; }

.e-55752af1 .tab
{
	appearance: none;
	border: 0;
	background: transparent;
	color: #141e5a;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	padding: 14px 26px;
	border-radius: 10px 10px 0 0;
	cursor: pointer;
	transition: background var(--ot-transition), opacity var(--ot-transition);
}

.e-55752af1 .tab:hover { background: rgba(255, 255, 255, 0.4); }

.e-55752af1 .tab.active { background: #ffffff; padding-top: 18px; padding-bottom: 18px; }

.e-55752af1 .tab.active:hover { background: #ffffff; }

.e-55752af1 .dest-grid
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	align-items: start;
	column-gap: 28px;
	row-gap: 32px;
}

.e-55752af1 .dest-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }

.e-55752af1 .dest-country
{
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;
	color: #141e5a;
	margin-bottom: 4px;
}

.e-55752af1 .dest-city
{
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
	color: #141e5a;
	text-decoration: none;
	transition: opacity var(--ot-transition);
}

.e-55752af1 .dest-city:hover { opacity: 0.65; text-decoration: underline; }

/* ===== TAMNO PLAVA TRAKA ===== */

.e-55752af1 .band-blue { width: 100%; background: #141e5a; color: #ffffff; }

.e-55752af1 .band-blue > .inner { padding-top: 52px; padding-bottom: 56px; }

.e-55752af1 .blue-title
{
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	color: #ffffff;
	margin: 0 0 36px;
}

.e-55752af1 .blue-cols
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: start;
	column-gap: 48px;
	row-gap: 40px;
}

.e-55752af1 .col { display: flex; flex-direction: column; min-width: 0; }

.e-55752af1 .col-title
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3;
	color: #ffffff;
	margin-bottom: 14px;
}

/* ===== KONTAKT ===== */

.e-55752af1 .contact-hours { font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, 0.85); margin-bottom: 14px; }

.e-55752af1 .contact-phone
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	text-decoration: none;
	transition: opacity var(--ot-transition);
}

.e-55752af1 .contact-phone:hover { opacity: 0.75; }

.e-55752af1 .contact-icon { font-size: 26px; line-height: 1; }

.e-55752af1 .contact-message
{
	margin-top: 12px;
	font-size: 15px;
	color: rgba(255, 255, 255, 0.75);
	text-decoration: underline;
	align-self: flex-start;
	transition: color var(--ot-transition);
}

.e-55752af1 .contact-message:hover { color: #ffffff; }

/* ===== NEWSLETTER ===== */

.e-55752af1 .news-text { font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, 0.85); margin-bottom: 16px; }

.e-55752af1 .news-form { display: flex; flex-direction: column; gap: 14px; }

.e-55752af1 .news-row { display: flex; align-items: stretch; gap: 10px; }

.e-55752af1 .news-input
{
	flex: 1;
	min-width: 0;
	height: 46px;
	padding: 0 16px;
	border: 0;
	border-radius: 8px;
	background: #ffffff;
	color: #141e5a;
	font-family: inherit;
	font-size: 15px;
	outline: none;
}

.e-55752af1 .news-input::placeholder { color: #8a90ad; }

.e-55752af1 .news-button
{
	appearance: none;
	border: 0;
	height: 46px;
	padding: 0 22px;
	border-radius: 8px;
	background: #ffd400;
	color: #141e5a;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	transition: background var(--ot-transition), opacity var(--ot-transition);
}

.e-55752af1 .news-button:hover { background: #ffe14d; }

/* Dugme je prigušeno dok e-mail nije unet / nije ispravan. */

.e-55752af1 .news-input:invalid ~ .news-button
{
	opacity: 0.45;
	cursor: default;
	background: #ffd400;
}

.e-55752af1 .news-consent { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }

.e-55752af1 .news-check { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 2px; accent-color: #ffd400; cursor: pointer; }

.e-55752af1 .consent-text { font-size: 12px; line-height: 1.5; color: rgba(255, 255, 255, 0.75); }

.e-55752af1 .consent-link { color: #ffffff; text-decoration: underline; }

.e-55752af1 .consent-link:hover { color: #ffd400; }

/* ===== DRUŠTVENE MREŽE ===== */

.e-55752af1 .socials { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }

.e-55752af1 .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	transition: opacity var(--ot-transition);
}

.e-55752af1 .social:hover { opacity: 0.65; }

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-55752af1 .dest-grid { grid-template-columns: repeat(3, 1fr); }

	.e-55752af1 .blue-cols { grid-template-columns: repeat(2, 1fr); column-gap: 32px; }

	.e-55752af1 .blue-title { font-size: 30px; }
}

/* Framework smanjuje gutter kontejnera na 900px — podnožje prati isti prelom. */

@media (max-width: 900px)
{
	.e-55752af1 .inner { padding: 0 var(--ot-spacing-m); }
}

@media (max-width: 768px)
{
	.e-55752af1 .band-yellow > .inner { padding-top: 32px; padding-bottom: 36px; }

	.e-55752af1 .band-blue > .inner { padding-top: 40px; padding-bottom: 44px; }

	.e-55752af1 .dest-grid { grid-template-columns: 1fr; row-gap: 26px; }

	.e-55752af1 .blue-cols { grid-template-columns: 1fr; row-gap: 32px; }

	.e-55752af1 .blue-title { font-size: 26px; margin-bottom: 26px; }

	.e-55752af1 .news-row { flex-direction: column; align-items: stretch; }

	.e-55752af1 .news-input { width: 100%; }

	.e-55752af1 .news-button { width: 100%; }
}

@media (max-width: 640px)
{
	.e-55752af1 .tabs { gap: 4px; }

	.e-55752af1 .tab { padding: 12px 18px; font-size: 15px; }

	.e-55752af1 .tab.active { padding-top: 15px; padding-bottom: 15px; }

	.e-55752af1 .contact-phone { font-size: 22px; }

	.e-55752af1 .contact-icon { font-size: 22px; }
}

/* ===== END: layout-footer-6 ===== */
.e-55752af2
{
	display: block;
	width: 100%;
}

.e-55752af2 > .holder
{
	width: 100%;
	padding: 0 24px;
}

.e-55752af2 > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 56px 56px 36px;
	background: #cde8f7;
	color: #16294d;
	border-radius: 24px 24px 0 0;
}

/* ========================================== */
/* ===== TOP ZONE =========================== */
/* ========================================== */

.e-55752af2 .top-zone
{
	display: grid;
	grid-template-columns: 300px 1fr;
	align-items: start;
	gap: 56px;
}

/* ===== LEFT: CONTACT ===== */

.e-55752af2 .contact-col
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.e-55752af2 .logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	height: 56px;
	padding: 8px 16px;
	background: #ffffff;
	border-radius: var(--ot-radius-m);
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(22, 41, 77, 0.08);
}

.e-55752af2 .logo img
{
	height: 32px;
	width: auto;
	object-fit: contain;
}

.e-55752af2 .logo-text
{
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: #16294d;
}

.e-55752af2 .contact-title
{
	margin: 24px 0 12px;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 800;
	color: #16294d;
}

.e-55752af2 .contact-line
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 14px;
	color: rgba(22, 41, 77, 0.86);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-55752af2 .contact-line > .contact-icon
{
	flex-shrink: 0;
	font-size: 18px;
	color: rgba(22, 41, 77, 0.6);
}

.e-55752af2 .contact-line > .contact-email
{
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752af2 .contact-line:hover
{
	color: #16294d;
}

.e-55752af2 .contact-subtitle
{
	margin: 22px 0 10px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 800;
	color: #16294d;
}

.e-55752af2 .hours
{
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
	max-width: 280px;
}

.e-55752af2 .hours-row
{
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: rgba(22, 41, 77, 0.86);
}

.e-55752af2 .hours-time
{
	color: rgba(22, 41, 77, 0.62);
	text-align: right;
}

.e-55752af2 .company
{
	margin-top: 22px;
}

.e-55752af2 .company-name
{
	font-size: 13px;
	font-weight: 800;
	color: #16294d;
}

.e-55752af2 .company-address
{
	display: flex;
	flex-direction: column;
	margin-top: 4px;
	font-size: 13px;
	font-style: normal;
	line-height: 1.5;
	color: rgba(22, 41, 77, 0.62);
}

/* ===== RIGHT: LINK COLUMNS ===== */

.e-55752af2 .columns-zone
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: start;
	gap: 40px;
}

.e-55752af2 .column
{
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.e-55752af2 .group
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-55752af2 .column-title
{
	font-size: 13px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #16294d;
}

.e-55752af2 .link
{
	display: inline-flex;
	align-items: flex-start;
	gap: 6px;
	font-size: 14px;
	line-height: 1.4;
	color: rgba(22, 41, 77, 0.82);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-55752af2 .link > .chev
{
	flex-shrink: 0;
	font-size: 17px;
	line-height: 1.35;
	color: rgba(22, 41, 77, 0.55);
	transition: transform var(--ot-transition);
}

.e-55752af2 .link:hover
{
	color: #16294d;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.e-55752af2 .link:hover > .chev
{
	transform: translateX(3px);
}

/* ========================================== */
/* ===== DIVIDER + SLOGAN =================== */
/* ========================================== */

.e-55752af2 .divider
{
	height: 1px;
	margin: 40px 0;
	background: rgba(22, 41, 77, 0.16);
}

.e-55752af2 .slogan-zone
{
	padding: 8px 0 24px;
}

.e-55752af2 .slogan
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: clamp(40px, 8vw, 104px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	text-align: left;
	color: #16294d;
}

/* ========================================== */
/* ===== BOTTOM ZONE ======================== */
/* ========================================== */

.e-55752af2 .bottom-zone
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
}

.e-55752af2 .bottom-left
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.e-55752af2 .trust
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-55752af2 .trust-badge
{
	display: inline-flex;
	align-items: center;
	height: 30px;
	color: rgba(22, 41, 77, 0.7);
	text-decoration: none;
	opacity: 0.9;
	transition: opacity var(--ot-transition);
}

.e-55752af2 .trust-badge:hover
{
	opacity: 1;
}

.e-55752af2 .trust-badge img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752af2 .trust-badge > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: rgba(22, 41, 77, 0.7);
	border: 1px solid rgba(22, 41, 77, 0.2);
	border-radius: var(--ot-radius-s);
	white-space: nowrap;
}

.e-55752af2 .trustpilot
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 30px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 700;
	color: #16294d;
	text-decoration: none;
	background: #ffffff;
	border-radius: var(--ot-radius-s);
	box-shadow: 0 1px 6px rgba(22, 41, 77, 0.08);
	transition: opacity var(--ot-transition);
}

.e-55752af2 .trustpilot:hover
{
	opacity: 0.75;
}

.e-55752af2 .trustpilot > .trustpilot-star
{
	font-size: 15px;
	line-height: 1;
	color: #00b67a;
}

.e-55752af2 .socials
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-55752af2 .social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: #16294d;
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0 1px 6px rgba(22, 41, 77, 0.08);
	transition: opacity var(--ot-transition);
}

.e-55752af2 .social:hover
{
	opacity: 0.65;
}

.e-55752af2 .bottom-right
{
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.e-55752af2 .legal
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

.e-55752af2 .legal-link
{
	font-size: 13px;
	color: rgba(22, 41, 77, 0.82);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color var(--ot-transition);
}

.e-55752af2 .legal-link:hover
{
	color: #16294d;
}

.e-55752af2 .copy
{
	font-size: 13px;
	color: rgba(22, 41, 77, 0.62);
	white-space: nowrap;
}

.e-55752af2 .payments
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.e-55752af2 .payment
{
	display: inline-flex;
	align-items: center;
	height: 24px;
}

.e-55752af2 .payment img
{
	height: 100%;
	width: auto;
	object-fit: contain;
}

.e-55752af2 .payment > span
{
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(22, 41, 77, 0.7);
	background: #ffffff;
	border: 1px solid rgba(22, 41, 77, 0.16);
	border-radius: 4px;
	white-space: nowrap;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 1024px)
{
	.e-55752af2 > .holder > .inner
	{
		padding: 44px 36px 32px;
	}

	.e-55752af2 .top-zone
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-55752af2 .columns-zone
	{
		grid-template-columns: repeat(3, 1fr);
		gap: 32px;
	}

	.e-55752af2 .hours
	{
		max-width: 320px;
	}
}

@media (max-width: 640px)
{
	.e-55752af2 > .holder
	{
		padding: 0 12px;
	}

	.e-55752af2 > .holder > .inner
	{
		padding: 36px 22px 28px;
		border-radius: 20px 20px 0 0;
	}

	.e-55752af2 .columns-zone
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-55752af2 .bottom-zone
	{
		flex-direction: column;
		align-items: center;
		gap: 24px;
		text-align: center;
	}

	.e-55752af2 .bottom-left,
	.e-55752af2 .bottom-right
	{
		justify-content: center;
	}
}
/* ===== BEGIN: layout-footer-beige ===== */

.e-d502ae1
{
	display: block;
	width: 100%;
}

.e-d502ae1 > .holder
{
	width: 100%;
	padding: 0 24px;
	background: #e7e0d4;
	color: #2b2a26;
	font-family: var(--ot-font-primary);
}

.e-d502ae1 > .holder > .inner
{
	max-width: 1440px;
	margin: 0 auto;
	padding: 40px 0 30px;
}

.e-d502ae1 .divider
{
	height: 1px;
	background: rgba(43, 42, 38, 0.16);
	margin: 18px 0;
}

/* ===== PUTANJA ===== */

.e-d502ae1 .crumbs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 13px;
	line-height: 1.6;
	color: #55534b;
}

.e-d502ae1 .crumb
{
	display: inline-flex;
	align-items: center;
}

.e-d502ae1 .crumb:not(:last-child)::after
{
	content: '›';
	margin: 0 9px;
	color: #8b887e;
}

.e-d502ae1 .crumb-link
{
	color: #2b2a26;
	text-decoration: none;
}

.e-d502ae1 .crumb:first-child .crumb-link
{
	text-decoration: underline;
}

.e-d502ae1 .crumb-link:hover
{
	text-decoration: underline;
}

.e-d502ae1 .crumb-text
{
	color: #55534b;
}

/* ===== BLOKOVI LINKOVA ===== */

.e-d502ae1 .blocks
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px 40px;
	padding: 8px 0 10px;
}

.e-d502ae1 .block
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 9px;
}

.e-d502ae1 .block-title
{
	font-size: 15px;
	font-weight: 800;
	color: #2b2a26;
}

.e-d502ae1 .block-link
{
	font-size: 14px;
	line-height: 1.4;
	color: #4a4842;
	text-decoration: none;
}

.e-d502ae1 .block-link:hover
{
	color: #2b2a26;
	text-decoration: underline;
}

/* ===== RED POVERENJA ===== */

.e-d502ae1 .trust
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: start;
	gap: 26px 30px;
	padding: 6px 0 4px;
}

.e-d502ae1 .trust-group
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-d502ae1 .trust-title
{
	font-size: 13px;
	font-weight: 800;
	color: #2b2a26;
}

.e-d502ae1 .trust-items
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.e-d502ae1 .trust-item
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: #2b2a26;
}

.e-d502ae1 .trust-item.is-social
{
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #d8cfbe;
}

.e-d502ae1 .trust-item.is-badge
{
	min-width: 62px;
	height: 36px;
	padding: 0 10px;
	border-radius: 6px;
	background: #ffffff;
}

.e-d502ae1 .trust-item img
{
	max-width: 100%;
	max-height: 24px;
	display: block;
}

.e-d502ae1 .trust-name
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	white-space: nowrap;
	color: #2b2a26;
}

/* ===== DUGMAD PRODAVNICA ===== */

.e-d502ae1 .apps
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 26px 0 4px;
}

.e-d502ae1 .app
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 170px;
	min-height: 46px;
	padding: 8px 20px;
	border-radius: 8px;
	background: #1c1b18;
	color: #ffffff;
	text-decoration: none;
}

.e-d502ae1 .app img
{
	max-width: 100%;
	max-height: 30px;
	display: block;
}

.e-d502ae1 .app-text
{
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.e-d502ae1 .app-note
{
	font-size: 10px;
	color: rgba(255, 255, 255, 0.75);
}

.e-d502ae1 .app-store
{
	font-size: 15px;
	font-weight: 700;
}

/* ===== DONJA TRAKA ===== */

.e-d502ae1 .bottom
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 22px;
}

.e-d502ae1 .bottom-link
{
	font-size: 12px;
	color: #6b6a63;
	text-decoration: none;
}

.e-d502ae1 .bottom-link:hover
{
	color: #2b2a26;
	text-decoration: underline;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-d502ae1 .blocks
	{
		grid-template-columns: repeat(2, 1fr);
	}

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

@media (max-width: 640px)
{
	.e-d502ae1 > .holder > .inner
	{
		padding: 28px 0 24px;
	}

	.e-d502ae1 .crumbs
	{
		display: none;
	}

	.e-d502ae1 .blocks
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.e-d502ae1 .trust
	{
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.e-d502ae1 .trust-group
	{
		align-items: center;
	}

	.e-d502ae1 .trust-items
	{
		justify-content: center;
	}

	.e-d502ae1 .apps
	{
		flex-direction: column;
	}

	.e-d502ae1 .app
	{
		width: 100%;
	}
}

/* ===== END: layout-footer-beige ===== */
.e-7195b5f3
{
	display: block;
	width: 100%;
}

.e-7195b5f3 > .holder
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 8px 48px;
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.e-7195b5f3 > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-7195b5f3 > .holder.tone-brand
{
	background: var(--ot-brand);
	color: white;
}

.e-7195b5f3 > .holder.tone-light
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-7195b5f3 > .holder > .track
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 22px;
}

.e-7195b5f3 > .holder > .track > .message
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
	white-space: nowrap;
}

.e-7195b5f3 > .holder > .track > .message.active
{
	position: relative;
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.e-7195b5f3 > .holder > .track > .message > .message-icon
{
	font-size: 15px;
	opacity: 0.85;
}

.e-7195b5f3 > .holder > .track > .message > .message-text
{
	letter-spacing: 0.01em;
}

.e-7195b5f3 > .holder > .track > .message > .message-link
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: inherit;
	transition: opacity 180ms;
}

.e-7195b5f3 > .holder > .track > .message > .message-link:hover
{
	opacity: 0.78;
}

.e-7195b5f3 > .holder > .track > .message > .message-link > i
{
	font-size: 14px;
}

.e-7195b5f3 > .holder > .close
{
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: inherit;
	cursor: pointer;
	opacity: 0.7;
	transition: opacity 180ms, background 180ms;
}

.e-7195b5f3 > .holder > .close:hover
{
	opacity: 1;
	background: rgba(255, 255, 255, 0.12);
}

.e-7195b5f3 > .holder.tone-light > .close:hover
{
	background: var(--ot-bg-3);
}

.e-7195b5f3 > .holder > .close > i
{
	font-size: 14px;
}

@media (max-width: 720px)
{
	.e-7195b5f3 > .holder
	{
		min-height: 34px;
		padding: 7px 40px;
		font-size: 11.5px;
	}
}
.e-6ee5c69e
{
	display: block;
}

.e-6ee5c69e > .holder
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-6ee5c69e > .holder.width-m    { width: 640px; }
.e-6ee5c69e > .holder.width-l    { width: 880px; }
.e-6ee5c69e > .holder.width-xl   { width: 1080px; }
.e-6ee5c69e > .holder.width-full { width: calc(100vw - 64px); max-width: 1280px; }

/* ===== BODY ===== */

.e-6ee5c69e > .holder > .body
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
	padding: 28px;
}

.e-6ee5c69e > .holder.has-feature > .body
{
	grid-template-columns: 1fr 280px;
}

/* ===== COLUMNS ===== */

/* Broj kolona prati sadržaj (--menu-cols iz rendera), ne širinu panela. */

.e-6ee5c69e .columns
{
	display: grid;
	grid-template-columns: repeat(var(--menu-cols, 3), 1fr);
	gap: 24px 32px;
}

.e-6ee5c69e .column
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.e-6ee5c69e .column-title
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 6px;
	padding: 0 10px;
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-6ee5c69e .column-title > i
{
	font-size: 14px;
	color: var(--ot-brand);
	opacity: 0.85;
}

/* ===== LINK ===== */

.e-6ee5c69e .link
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 8px;
	color: var(--ot-text-1);
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), transform 180ms;
	min-width: 0;
}

.e-6ee5c69e .link:hover
{
	background: var(--ot-bg-2);
	transform: translateX(2px);
}

.e-6ee5c69e .link > .link-flag
{
	font-size: 18px;
	line-height: 1;
	flex-shrink: 0;
}

.e-6ee5c69e .link > .link-icon
{
	font-size: 18px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 180ms;
}

.e-6ee5c69e .link:hover > .link-icon
{
	color: var(--ot-brand);
}

.e-6ee5c69e .link > .link-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1;
}

.e-6ee5c69e .link > .link-text > .link-label
{
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-6ee5c69e .link > .link-text > .link-description
{
	font-size: 11.5px;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-6ee5c69e .link > .link-badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 7px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	flex-shrink: 0;
}

/* ===== FEATURE CARD ===== */

.e-6ee5c69e .feature
{
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	color: white;
	background: var(--ot-bg-3);
	min-height: 260px;
	transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6ee5c69e .feature:hover
{
	transform: translateY(-2px);
}

.e-6ee5c69e .feature > .feature-cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6ee5c69e .feature:hover > .feature-cover
{
	transform: scale(1.04);
}

.e-6ee5c69e .feature > .feature-cover > .feature-overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.0) 30%, rgba(20, 18, 16, 0.55) 75%, rgba(20, 18, 16, 0.85) 100%);
}

.e-6ee5c69e .feature > .feature-content
{
	position: relative;
	z-index: 1;
	margin-top: auto;
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-6ee5c69e .feature > .feature-content > .feature-eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 254, 252, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-6ee5c69e .feature > .feature-content > .feature-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-6ee5c69e .feature > .feature-content > .feature-description
{
	font-size: 12.5px;
	line-height: 1.5;
	color: rgba(255, 254, 252, 0.82);
	margin: 0;
}

.e-6ee5c69e .feature > .feature-content > .feature-cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-6ee5c69e .feature > .feature-content > .feature-cta > i
{
	font-size: 16px;
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6ee5c69e .feature:hover > .feature-content > .feature-cta > i
{
	transform: translateX(4px);
}

/* ===== BOTTOM ===== */

.e-6ee5c69e > .holder > .bottom
{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	padding: 12px 22px;
	background: var(--ot-bg-2);
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-6ee5c69e .bottom-link
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-2);
	transition: background 160ms, color 160ms;
}

.e-6ee5c69e .bottom-link:hover
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-6ee5c69e .bottom-link > i
{
	font-size: 15px;
	opacity: 0.75;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-6ee5c69e > .holder.width-l,
	.e-6ee5c69e > .holder.width-xl,
	.e-6ee5c69e > .holder.width-full
	{
		width: calc(100vw - 32px);
		max-width: 720px;
	}

	.e-6ee5c69e > .holder.has-feature > .body
	{
		grid-template-columns: 1fr;
	}

	.e-6ee5c69e .columns
	{
		grid-template-columns: repeat(2, 1fr);
	}
}
.e-730d9f10
{
	display: block;
}

/* ===== HOLDER ===== */

.e-730d9f10 > .holder
{
	min-width: var(--min-width, 200px);
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 6px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

.e-730d9f10 > .holder.tone-dark
{
	background: var(--ot-text-1);
	border-color: rgba(255, 255, 255, 0.08);
}

/* ===== ENTRY ===== */

.e-730d9f10 .entry
{
	display: flex;
	flex-direction: column;
}

/* ===== SEPARATOR ===== */

.e-730d9f10 .entry.type-separator > .separator
{
	height: 1px;
	background: var(--ot-bg-2-border);
	margin: 4px 6px;
}

.e-730d9f10 > .holder.tone-dark .entry.type-separator > .separator
{
	background: rgba(255, 255, 255, 0.08);
}

/* ===== HEADER ===== */

.e-730d9f10 .entry.type-header > .header
{
	padding: 10px 12px 6px;
	font-size: 10px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-730d9f10 > .holder.tone-dark .entry.type-header > .header
{
	color: rgba(255, 255, 255, 0.55);
}

/* ===== ROW (link or action) ===== */

.e-730d9f10 .row
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	background: transparent;
	border: 0;
	border-radius: 6px;
	color: var(--ot-text-1);
	cursor: pointer;
	font: inherit;
	text-align: left;
	width: 100%;
	min-width: 0;
	position: relative;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms;
}

.e-730d9f10 > .holder.tone-dark .row
{
	color: rgba(255, 255, 255, 0.85);
}

.e-730d9f10 .row:hover
{
	background: var(--ot-bg-2);
}

.e-730d9f10 > .holder.tone-dark .row:hover
{
	background: rgba(255, 255, 255, 0.08);
}

/* Active state */

.e-730d9f10 .entry.active > .row
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	font-weight: 600;
}

.e-730d9f10 .entry.active > .row::before
{
	content: '';
	position: absolute;
	left: -6px;
	top: 8px;
	bottom: 8px;
	width: 2px;
	background: var(--ot-brand);
	border-radius: 2px;
}

.e-730d9f10 > .holder.tone-dark .entry.active > .row
{
	background: rgba(255, 255, 255, 0.12);
	color: white;
}

/* Danger state */

.e-730d9f10 .entry.danger > .row
{
	color: var(--ot-brand);
}

.e-730d9f10 .entry.danger > .row:hover
{
	background: var(--ot-brand-opacity);
}

/* ===== LEADING (icon / flag) ===== */

.e-730d9f10 .leading
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	line-height: 1;
}

.e-730d9f10 .leading.flag
{
	font-size: 16px;
}

.e-730d9f10 .leading.icon > i
{
	font-size: 17px;
	color: var(--ot-text-3);
	transition: color 200ms;
}

.e-730d9f10 > .holder.tone-dark .leading.icon > i
{
	color: rgba(255, 255, 255, 0.55);
}

.e-730d9f10 .row:hover .leading.icon > i
{
	color: var(--ot-brand);
}

.e-730d9f10 .entry.active .leading.icon > i
{
	color: var(--ot-brand);
}

.e-730d9f10 .entry.danger .leading.icon > i
{
	color: var(--ot-brand);
}

/* Size adjustments */

.e-730d9f10 > .holder.size-s .leading.icon > i { font-size: 15px; }
.e-730d9f10 > .holder.size-s .leading.flag      { font-size: 14px; }
.e-730d9f10 > .holder.size-l .leading.icon > i { font-size: 19px; }
.e-730d9f10 > .holder.size-l .leading.flag      { font-size: 18px; }

/* ===== TEXT ===== */

.e-730d9f10 .text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1;
	line-height: 1.3;
}

.e-730d9f10 .label
{
	font-size: 13px;
	font-weight: 500;
	color: inherit;
	letter-spacing: -0.005em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-730d9f10 > .holder.size-s .label  { font-size: 12px; }
.e-730d9f10 > .holder.size-l .label  { font-size: 14px; }

.e-730d9f10 .description
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-730d9f10 > .holder.tone-dark .description
{
	color: rgba(255, 255, 255, 0.55);
}

.e-730d9f10 > .holder.size-l .description { font-size: 11.5px; }

/* ===== BADGE ===== */

.e-730d9f10 .badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	flex-shrink: 0;
}

/* ===== SHORTCUT ===== */

.e-730d9f10 .shortcut
{
	font-family: var(--ot-font-secondary);
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
	flex-shrink: 0;
	padding: 2px 6px;
	background: var(--ot-bg-2);
	border-radius: 4px;
}

.e-730d9f10 > .holder.tone-dark .shortcut
{
	color: rgba(255, 255, 255, 0.55);
	background: rgba(255, 255, 255, 0.08);
}
/* Contents — sticky holder se lepi za scroll kontejner stranice, ne za wrapper. */

.e-452637df
{
	display: contents;
}

.e-452637df > .holder
{
	width: 100%;
	z-index: 100;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms, padding 240ms;
}

.e-452637df > .holder.sticky
{
	position: sticky;
	top: 0;
}

.e-452637df > .holder.mobile-open
{
	position: relative;
	z-index: 200;
}

.e-452637df > .holder.tone-light
{
	background: var(--ot-bg-1);
}

.e-452637df > .holder.tone-light.scrolled
{
	background: var(--ot-bg-1-opacity);
	backdrop-filter: blur(14px) saturate(180%);
	-webkit-backdrop-filter: blur(14px) saturate(180%);
}

.e-452637df > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: white;
}

/* ===== INNER ===== */

.e-452637df > .holder > .inner
{
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 0 28px;
	min-height: 76px;
	transition: min-height 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637df > .holder.scrolled > .inner
{
	min-height: 64px;
}

/* ===== BRAND ===== */

.e-452637df .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	color: inherit;
	transition: opacity 180ms;
}

.e-452637df .brand:hover
{
	opacity: 0.78;
}

.e-452637df .brand > .brand-logo
{
	height: 32px;
	width: auto;
	display: block;
}

.e-452637df .brand > .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

/* ===== LINKS ===== */

.e-452637df > .holder > .inner > .links
{
	display: flex;
	align-items: center;
	gap: 2px;
	flex: 1;
	margin-left: 8px;
}

.e-452637df .link-wrap
{
	display: contents;
}

.e-452637df .link
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 9px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-452637df > .holder.tone-dark .link
{
	color: rgba(255, 255, 255, 0.78);
}

.e-452637df .link:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637df > .holder.tone-dark .link:hover
{
	background: rgba(255, 255, 255, 0.08);
	color: white;
}

.e-452637df .link.active
{
	color: var(--ot-text-1);
	font-weight: 600;
}

.e-452637df > .holder.tone-dark .link.active
{
	color: white;
}

.e-452637df .link > .link-icon
{
	font-size: 17px;
	opacity: 0.85;
}

.e-452637df .link > .link-badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-left: 2px;
}

.e-452637df .link > .link-chevron
{
	font-size: 16px;
	margin-left: -2px;
	opacity: 0.6;
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637df .link.has-megamenu:hover > .link-chevron
{
	transform: translateY(1px);
}

/* ===== RIGHT ===== */

.e-452637df > .holder > .inner > .right
{
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.e-452637df .action
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-452637df > .holder.tone-dark .action
{
	color: rgba(255, 255, 255, 0.78);
}

.e-452637df .action:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637df > .holder.tone-dark .action:hover
{
	background: rgba(255, 255, 255, 0.08);
	color: white;
}

.e-452637df .action > i
{
	font-size: 21px;
}

.e-452637df .action > .action-badge
{
	position: absolute;
	top: 4px;
	right: 4px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-brand);
	border: 2px solid var(--ot-bg-1);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	letter-spacing: 0;
}

.e-452637df > .holder.tone-dark .action > .action-badge
{
	border-color: var(--ot-text-1);
}

/* ===== CTA ===== */

.e-452637df .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-left: 8px;
	padding: 11px 20px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-bg-1);
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms;
}

.e-452637df .cta:hover
{
	background: var(--ot-brand);
	color: white;
	transform: translateY(-1px);
}

.e-452637df > .holder.tone-dark .cta
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-452637df > .holder.tone-dark .cta:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-452637df .cta > i
{
	font-size: 16px;
}

/* ===== HAMBURGER ===== */

.e-452637df .burger
{
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	margin-left: 4px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637df .burger:hover
{
	background: var(--ot-bg-2);
}

.e-452637df > .holder.tone-dark .burger:hover
{
	background: rgba(255, 255, 255, 0.08);
}

.e-452637df .burger-line
{
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: var(--ot-text-1);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms;
}

.e-452637df > .holder.tone-dark .burger-line
{
	background: white;
}

.e-452637df > .holder.mobile-open .burger-line:nth-child(1)
{
	transform: translateY(7px) rotate(45deg);
}

.e-452637df > .holder.mobile-open .burger-line:nth-child(2)
{
	opacity: 0;
}

.e-452637df > .holder.mobile-open .burger-line:nth-child(3)
{
	transform: translateY(-7px) rotate(-45deg);
}

/* ===== MOBILE PANEL ===== */

.e-452637df .mobile-overlay
{
	position: fixed;
	inset: 0;
	z-index: 198;
	background: rgba(20, 20, 24, 0.5);
	opacity: 0;
	visibility: hidden;
	transition: opacity 280ms cubic-bezier(0.22, 1, 0.36, 1), visibility 280ms;
}

.e-452637df > .holder.mobile-open .mobile-overlay
{
	opacity: 1;
	visibility: visible;
}

.e-452637df .mobile-panel
{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 199;
	display: flex;
	flex-direction: column;
	width: min(380px, 86vw);
	height: 100dvh;
	background: var(--ot-bg-1);
	border-left: 1px solid var(--ot-bg-2-border);
	transform: translateX(100%);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
	overflow-y: auto;
}

.e-452637df > .holder.mobile-open .mobile-panel
{
	transform: translateX(0);
}

.e-452637df .mobile-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	position: sticky;
	top: 0;
	background: var(--ot-bg-1);
	z-index: 1;
}

.e-452637df .mobile-head .brand-logo
{
	height: 30px;
}

.e-452637df .mobile-head .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
}

.e-452637df .mobile-close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 180ms, color 180ms;
}

.e-452637df .mobile-close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-452637df .mobile-close > i
{
	font-size: 20px;
}

.e-452637df .mobile-nav
{
	display: flex;
	flex-direction: column;
	padding: 12px;
	flex: 1;
}

.e-452637df .mobile-item
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-452637df .mobile-item:last-child
{
	border-bottom: 0;
}

.e-452637df .mobile-link
{
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 15px 10px;
	background: transparent;
	border: 0;
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	transition: color 160ms;
}

.e-452637df .mobile-link:hover
{
	color: var(--ot-brand);
}

.e-452637df .mobile-link-label
{
	flex: 1;
}

.e-452637df .mobile-link-badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-452637df .mobile-link-chevron
{
	font-size: 22px;
	color: var(--ot-text-3);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637df .mobile-link.expanded .mobile-link-chevron
{
	transform: rotate(180deg);
}

/* Mobile submenu (accordion) */

.e-452637df .mobile-sub
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 4px 0 14px 10px;
}

.e-452637df .mobile-sub-group
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 8px;
}

.e-452637df .mobile-sub-title
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	padding: 6px 10px 4px;
}

.e-452637df .mobile-sub-link
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: 8px;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--ot-text-2);
	transition: background 160ms, color 160ms;
}

.e-452637df .mobile-sub-link:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637df .mobile-sub-link.bottom
{
	font-weight: 600;
	color: var(--ot-brand);
	margin-top: 4px;
}

.e-452637df .mobile-sub-flag
{
	font-size: 18px;
	line-height: 1;
}

.e-452637df .mobile-sub-icon
{
	font-size: 19px;
	color: var(--ot-text-3);
}

.e-452637df .mobile-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 12px 20px 24px;
	padding: 15px 20px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-bg-1);
	transition: background 200ms;
}

.e-452637df .mobile-cta:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-452637df .mobile-cta > i
{
	font-size: 18px;
}

/* ===== RESPONSIVE ===== */

/* 11 stavki — na užim desktopima dodatno stegnuto, ispod 1360px burger. */

@media (max-width: 1450px)
{
	.e-452637df > .holder > .inner
	{
		padding: 0 20px;
		gap: 10px;
	}

	.e-452637df > .holder > .inner > .links
	{
		margin-left: 0;
	}

	.e-452637df .link
	{
		padding: 10px 7px;
	}
}

@media (max-width: 1360px)
{
	.e-452637df > .holder > .inner > .links
	{
		display: none;
	}

	.e-452637df .burger
	{
		display: flex;
	}
}

@media (max-width: 900px)
{
	.e-452637df > .holder > .inner
	{
		justify-content: space-between;
		min-height: 64px;
		gap: 12px;
	}

	.e-452637df > .holder.scrolled > .inner
	{
		min-height: 58px;
	}

	.e-452637df > .holder > .inner > .links
	{
		display: none;
	}

	.e-452637df .burger
	{
		display: flex;
	}

	/* CTA postaje icon-only na tabletu da ostane mesta. */

	.e-452637df .cta
	{
		padding: 11px 16px;
	}
}

@media (max-width: 600px)
{
	.e-452637df > .holder > .inner
	{
		padding: 0 16px;
	}

	.e-452637df .brand > .brand-logo
	{
		height: 28px;
	}

	/* Sakrij CTA u baru — postoji u mobilnom meniju. */

	.e-452637df > .holder > .inner > .right > .cta
	{
		display: none;
	}
}
/* Contents — sticky holder se lepi za scroll kontejner stranice, ne za wrapper. Varijanta 2: centriran logo, linkovi levo i desno. */

.e-452637de
{
	display: contents;
}

.e-452637de > .holder
{
	width: 100%;
	z-index: 100;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms, padding 240ms;
}

.e-452637de > .holder.sticky
{
	position: sticky;
	top: 0;
}

.e-452637de > .holder.mobile-open
{
	position: relative;
	z-index: 200;
}

.e-452637de > .holder.tone-light
{
	background: var(--ot-bg-1);
}

.e-452637de > .holder.tone-light.scrolled
{
	background: var(--ot-bg-1-opacity);
	backdrop-filter: blur(14px) saturate(180%);
	-webkit-backdrop-filter: blur(14px) saturate(180%);
}

.e-452637de > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: white;
}

/* ===== INNER ===== */

/* Tri ćelije: leva (1fr) — brend (auto, centriran) — desna (1fr). Jednake 1fr bočne ćelije drže brend tačno u sredini bez obzira na širinu sadržaja. */

.e-452637de > .holder > .inner
{
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 0 28px;
	min-height: 76px;
	transition: min-height 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637de > .holder.scrolled > .inner
{
	min-height: 64px;
}

.e-452637de > .holder > .inner > .side
{
	display: flex;
	align-items: center;
	gap: 4px;
	min-width: 0;
}

.e-452637de > .holder > .inner > .side-left
{
	justify-content: flex-end;
}

.e-452637de > .holder > .inner > .side-right
{
	justify-content: flex-start;
}

/* ===== BRAND ===== */

.e-452637de .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	color: inherit;
	transition: opacity 180ms;
}

.e-452637de > .holder > .inner > .brand
{
	justify-self: center;
	margin: 0 12px;
}

.e-452637de .brand:hover
{
	opacity: 0.78;
}

.e-452637de .brand > .brand-logo
{
	height: 32px;
	width: auto;
	display: block;
}

.e-452637de .brand > .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

/* ===== LINKS ===== */

.e-452637de .links
{
	display: flex;
	align-items: center;
	gap: 2px;
	min-width: 0;
}

.e-452637de .links.links-left
{
	justify-content: flex-end;
}

.e-452637de .links.links-right
{
	justify-content: flex-start;
}

.e-452637de .link-wrap
{
	display: contents;
}

.e-452637de .link
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 9px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-452637de > .holder.tone-dark .link
{
	color: rgba(255, 255, 255, 0.78);
}

.e-452637de .link:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637de > .holder.tone-dark .link:hover
{
	background: rgba(255, 255, 255, 0.08);
	color: white;
}

.e-452637de .link.active
{
	color: var(--ot-text-1);
	font-weight: 600;
}

.e-452637de > .holder.tone-dark .link.active
{
	color: white;
}

.e-452637de .link > .link-icon
{
	font-size: 17px;
	opacity: 0.85;
}

.e-452637de .link > .link-badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-left: 2px;
}

.e-452637de .link > .link-chevron
{
	font-size: 16px;
	margin-left: -2px;
	opacity: 0.6;
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637de .link.has-megamenu:hover > .link-chevron
{
	transform: translateY(1px);
}

/* ===== ACTIONS ===== */

.e-452637de .actions
{
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.e-452637de .action
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-452637de > .holder.tone-dark .action
{
	color: rgba(255, 255, 255, 0.78);
}

.e-452637de .action:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637de > .holder.tone-dark .action:hover
{
	background: rgba(255, 255, 255, 0.08);
	color: white;
}

.e-452637de .action > i
{
	font-size: 21px;
}

.e-452637de .action > .action-badge
{
	position: absolute;
	top: 4px;
	right: 4px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-brand);
	border: 2px solid var(--ot-bg-1);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	letter-spacing: 0;
}

.e-452637de > .holder.tone-dark .action > .action-badge
{
	border-color: var(--ot-text-1);
}

/* ===== CTA ===== */

.e-452637de .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-left: 8px;
	padding: 11px 20px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-bg-1);
	white-space: nowrap;
	flex-shrink: 0;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms;
}

.e-452637de .cta:hover
{
	background: var(--ot-brand);
	color: white;
	transform: translateY(-1px);
}

.e-452637de > .holder.tone-dark .cta
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-452637de > .holder.tone-dark .cta:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-452637de .cta > i
{
	font-size: 16px;
}

/* ===== HAMBURGER ===== */

.e-452637de .burger
{
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	margin-left: 4px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637de .burger:hover
{
	background: var(--ot-bg-2);
}

.e-452637de > .holder.tone-dark .burger:hover
{
	background: rgba(255, 255, 255, 0.08);
}

.e-452637de .burger-line
{
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: var(--ot-text-1);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms;
}

.e-452637de > .holder.tone-dark .burger-line
{
	background: white;
}

.e-452637de > .holder.mobile-open .burger-line:nth-child(1)
{
	transform: translateY(7px) rotate(45deg);
}

.e-452637de > .holder.mobile-open .burger-line:nth-child(2)
{
	opacity: 0;
}

.e-452637de > .holder.mobile-open .burger-line:nth-child(3)
{
	transform: translateY(-7px) rotate(-45deg);
}

/* ===== MOBILE PANEL ===== */

.e-452637de .mobile-overlay
{
	position: fixed;
	inset: 0;
	z-index: 198;
	background: rgba(20, 20, 24, 0.5);
	opacity: 0;
	visibility: hidden;
	transition: opacity 280ms cubic-bezier(0.22, 1, 0.36, 1), visibility 280ms;
}

.e-452637de > .holder.mobile-open .mobile-overlay
{
	opacity: 1;
	visibility: visible;
}

.e-452637de .mobile-panel
{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 199;
	display: flex;
	flex-direction: column;
	width: min(380px, 86vw);
	height: 100dvh;
	background: var(--ot-bg-1);
	border-left: 1px solid var(--ot-bg-2-border);
	transform: translateX(100%);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
	overflow-y: auto;
}

.e-452637de > .holder.mobile-open .mobile-panel
{
	transform: translateX(0);
}

.e-452637de .mobile-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	position: sticky;
	top: 0;
	background: var(--ot-bg-1);
	z-index: 1;
}

.e-452637de .mobile-head .brand-logo
{
	height: 30px;
}

.e-452637de .mobile-head .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
}

.e-452637de .mobile-close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 180ms, color 180ms;
}

.e-452637de .mobile-close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-452637de .mobile-close > i
{
	font-size: 20px;
}

.e-452637de .mobile-nav
{
	display: flex;
	flex-direction: column;
	padding: 12px;
	flex: 1;
}

.e-452637de .mobile-item
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-452637de .mobile-item:last-child
{
	border-bottom: 0;
}

.e-452637de .mobile-link
{
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 15px 10px;
	background: transparent;
	border: 0;
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	text-align: left;
	cursor: pointer;
	transition: color 160ms;
}

.e-452637de .mobile-link:hover
{
	color: var(--ot-brand);
}

.e-452637de .mobile-link-label
{
	flex: 1;
}

.e-452637de .mobile-link-badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-452637de .mobile-link-chevron
{
	font-size: 22px;
	color: var(--ot-text-3);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637de .mobile-link.expanded .mobile-link-chevron
{
	transform: rotate(180deg);
}

/* Mobile submenu (accordion) */

.e-452637de .mobile-sub
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 4px 0 14px 10px;
}

.e-452637de .mobile-sub-group
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 8px;
}

.e-452637de .mobile-sub-title
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	padding: 6px 10px 4px;
}

.e-452637de .mobile-sub-link
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: 8px;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--ot-text-2);
	transition: background 160ms, color 160ms;
}

.e-452637de .mobile-sub-link:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-452637de .mobile-sub-link.bottom
{
	font-weight: 600;
	color: var(--ot-brand);
	margin-top: 4px;
}

.e-452637de .mobile-sub-flag
{
	font-size: 18px;
	line-height: 1;
}

.e-452637de .mobile-sub-icon
{
	font-size: 19px;
	color: var(--ot-text-3);
}

.e-452637de .mobile-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 12px 20px 24px;
	padding: 15px 20px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-bg-1);
	transition: background 200ms;
}

.e-452637de .mobile-cta:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-452637de .mobile-cta > i
{
	font-size: 18px;
}

/* ===== RESPONSIVE ===== */

/* Podeljeni linkovi levo/desno — na užim desktopima stegnuto, ispod 1360px burger. */

@media (max-width: 1450px)
{
	.e-452637de > .holder > .inner
	{
		padding: 0 20px;
		gap: 10px;
	}

	.e-452637de .link
	{
		padding: 10px 7px;
	}
}

@media (max-width: 1360px)
{
	.e-452637de .links
	{
		display: none;
	}

	.e-452637de .burger
	{
		display: flex;
	}
}

@media (max-width: 900px)
{
	.e-452637de > .holder > .inner
	{
		grid-template-columns: 1fr auto 1fr;
		min-height: 64px;
		gap: 12px;
	}

	.e-452637de > .holder.scrolled > .inner
	{
		min-height: 58px;
	}

	.e-452637de .links
	{
		display: none;
	}

	.e-452637de .burger
	{
		display: flex;
	}

	/* CTA postaje icon-only na tabletu da ostane mesta. */

	.e-452637de .cta
	{
		padding: 11px 16px;
	}
}

@media (max-width: 600px)
{
	.e-452637de > .holder > .inner
	{
		padding: 0 16px;
	}

	.e-452637de .brand > .brand-logo
	{
		height: 28px;
	}

	/* Sakrij CTA u baru — postoji u mobilnom meniju. */

	.e-452637de .side-right > .cta
	{
		display: none;
	}
}
/* Contents — dvoredni meni: gornji red (logo, search, pomoćni linkovi), donji red (CTA pill, glavni linkovi, telefon + srce). Sticky se lepi za scroll kontejner stranice. */

.e-452637dd
{
	display: contents;
}

.e-452637dd > .holder
{
	width: 100%;
	z-index: 100;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms;
}

.e-452637dd > .holder.sticky
{
	position: sticky;
	top: 0;
}

.e-452637dd > .holder.mobile-open
{
	position: relative;
	z-index: 200;
}

.e-452637dd > .holder.tone-light
{
	background: var(--ot-bg-1);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-452637dd > .holder.tone-light.scrolled
{
	background: var(--ot-bg-1-opacity);
	backdrop-filter: blur(14px) saturate(180%);
	-webkit-backdrop-filter: blur(14px) saturate(180%);
}

.e-452637dd > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: white;
}

/* ===== INNER + ROWS ===== */

.e-452637dd > .holder > .inner
{
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 0 28px;
}

.e-452637dd .row
{
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100%;
}

.e-452637dd .row-top
{
	min-height: 68px;
	padding-top: 6px;
}

.e-452637dd .row-bottom
{
	min-height: 56px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-452637dd > .holder.tone-dark .row-bottom
{
	border-top-color: rgba(255, 255, 255, 0.12);
}

/* ===== BRAND ===== */

.e-452637dd .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	color: inherit;
	transition: opacity 180ms;
}

.e-452637dd .brand:hover
{
	opacity: 0.78;
}

.e-452637dd .brand > .brand-logo
{
	height: 34px;
	width: auto;
	display: block;
}

.e-452637dd .brand > .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

/* ===== SEARCH ===== */

.e-452637dd .search
{
	position: relative;
	display: flex;
	align-items: center;
	flex: 1;
	max-width: 640px;
}

.e-452637dd .search > .search-input
{
	width: 100%;
	height: 44px;
	padding: 0 46px 0 20px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: inherit;
	font-size: 14px;
	color: var(--ot-text-1);
	outline: none;
	transition: border-color 180ms, background 180ms, box-shadow 180ms;
}

.e-452637dd .search > .search-input::placeholder
{
	color: var(--ot-text-3);
}

.e-452637dd .search > .search-input:focus
{
	background: var(--ot-bg-1);
	border-color: var(--ot-blue);
	box-shadow: 0 0 0 3px var(--ot-blue-opacity);
}

.e-452637dd .search > .search-icon
{
	position: absolute;
	right: 16px;
	font-size: 21px;
	color: var(--ot-blue);
	pointer-events: none;
}

/* ===== TOP LINKS ===== */

.e-452637dd .top-links
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex-shrink: 0;
	margin-left: auto;
}

.e-452637dd .top-link
{
	font-size: 13.5px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
	white-space: nowrap;
	transition: color 160ms;
}

.e-452637dd .top-link:hover
{
	color: var(--ot-blue);
}

.e-452637dd > .holder.tone-dark .top-link
{
	color: rgba(255, 255, 255, 0.82);
}

.e-452637dd > .holder.tone-dark .top-link:hover
{
	color: white;
}

/* ===== CTA ===== */

.e-452637dd .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	padding: 11px 22px;
	background: var(--ot-blue);
	border-radius: 100px;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: -0.005em;
	color: white;
	white-space: nowrap;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), transform 200ms, box-shadow 200ms;
}

.e-452637dd .cta:hover
{
	background: var(--ot-blue-hover);
	transform: translateY(-1px);
	box-shadow: 0 6px 18px var(--ot-blue-opacity);
}

.e-452637dd .cta > i
{
	font-size: 18px;
}

/* ===== MAIN LINKS ===== */

.e-452637dd .links
{
	display: flex;
	align-items: center;
	gap: 4px;
	flex: 1;
	min-width: 0;
	justify-content: center;
}

.e-452637dd .link-wrap
{
	position: relative;
}

.e-452637dd .link
{
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 10px 12px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-452637dd .link:hover,
.e-452637dd .link.open
{
	background: var(--ot-blue-opacity);
	color: var(--ot-blue);
}

.e-452637dd .link.active
{
	color: var(--ot-blue);
}

.e-452637dd > .holder.tone-dark .link
{
	color: rgba(255, 255, 255, 0.82);
}

.e-452637dd > .holder.tone-dark .link:hover,
.e-452637dd > .holder.tone-dark .link.open
{
	background: rgba(255, 255, 255, 0.1);
	color: white;
}

.e-452637dd .link > .link-flag
{
	position: absolute;
	top: -9px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	background: var(--ot-blue);
	border-radius: 100px;
	font-size: 8.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	white-space: nowrap;
	pointer-events: none;
}

.e-452637dd .link > .link-chevron
{
	font-size: 17px;
	opacity: 0.6;
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637dd .link.open > .link-chevron
{
	transform: rotate(180deg);
}

/* ===== DROPDOWN (visual only) ===== */

.e-452637dd .dropdown
{
	position: absolute;
	top: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%);
	z-index: 120;
	display: flex;
	flex-direction: column;
	min-width: 210px;
	padding: 8px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 14px;
	box-shadow: 0 20px 46px rgba(20, 20, 30, 0.14);
}

.e-452637dd .dropdown-link
{
	padding: 10px 12px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-2);
	white-space: nowrap;
	transition: background 160ms, color 160ms;
}

.e-452637dd .dropdown-link:hover
{
	background: var(--ot-blue-opacity);
	color: var(--ot-blue);
}

/* ===== TOOLS (phone + favorite) ===== */

.e-452637dd .tools
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex-shrink: 0;
	margin-left: auto;
}

.e-452637dd .phone
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	line-height: 1.2;
	color: inherit;
	transition: opacity 160ms;
}

.e-452637dd .phone:hover
{
	opacity: 0.82;
}

.e-452637dd .phone > .phone-number
{
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ot-green);
}

.e-452637dd .phone > .phone-hours
{
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ot-text-2);
}

.e-452637dd > .holder.tone-dark .phone > .phone-hours
{
	color: rgba(255, 255, 255, 0.7);
}

.e-452637dd .favorite
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 180ms, color 180ms;
}

.e-452637dd .favorite:hover
{
	background: var(--ot-blue-opacity);
	color: var(--ot-blue);
}

.e-452637dd > .holder.tone-dark .favorite
{
	color: rgba(255, 255, 255, 0.82);
}

.e-452637dd > .holder.tone-dark .favorite:hover
{
	background: rgba(255, 255, 255, 0.1);
	color: white;
}

.e-452637dd .favorite > i
{
	font-size: 23px;
}

.e-452637dd .favorite > .fav-badge
{
	position: absolute;
	top: 3px;
	right: 3px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ot-blue);
	border: 2px solid var(--ot-bg-1);
	border-radius: 100px;
	font-size: 10px;
	font-weight: 700;
	color: white;
}

.e-452637dd > .holder.tone-dark .favorite > .fav-badge
{
	border-color: var(--ot-text-1);
}

/* ===== HAMBURGER ===== */

.e-452637dd .burger
{
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 42px;
	height: 42px;
	margin-left: 4px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-452637dd .burger:hover
{
	background: var(--ot-bg-2);
}

.e-452637dd > .holder.tone-dark .burger:hover
{
	background: rgba(255, 255, 255, 0.08);
}

.e-452637dd .burger-line
{
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: var(--ot-text-1);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms;
}

.e-452637dd > .holder.tone-dark .burger-line
{
	background: white;
}

.e-452637dd > .holder.mobile-open .burger-line:nth-child(1)
{
	transform: translateY(7px) rotate(45deg);
}

.e-452637dd > .holder.mobile-open .burger-line:nth-child(2)
{
	opacity: 0;
}

.e-452637dd > .holder.mobile-open .burger-line:nth-child(3)
{
	transform: translateY(-7px) rotate(-45deg);
}

/* ===== MOBILE PANEL ===== */

.e-452637dd .mobile-overlay
{
	position: fixed;
	inset: 0;
	z-index: 198;
	background: rgba(20, 20, 24, 0.5);
	opacity: 0;
	visibility: hidden;
	transition: opacity 280ms cubic-bezier(0.22, 1, 0.36, 1), visibility 280ms;
}

.e-452637dd > .holder.mobile-open .mobile-overlay
{
	opacity: 1;
	visibility: visible;
}

.e-452637dd .mobile-panel
{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 199;
	display: flex;
	flex-direction: column;
	width: min(380px, 86vw);
	height: 100dvh;
	background: var(--ot-bg-1);
	border-left: 1px solid var(--ot-bg-2-border);
	transform: translateX(100%);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
	overflow-y: auto;
}

.e-452637dd > .holder.mobile-open .mobile-panel
{
	transform: translateX(0);
}

.e-452637dd .mobile-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	position: sticky;
	top: 0;
	background: var(--ot-bg-1);
	z-index: 1;
}

.e-452637dd .mobile-head .brand-logo
{
	height: 30px;
}

.e-452637dd .mobile-head .brand-name
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
}

.e-452637dd .mobile-close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 180ms, color 180ms;
}

.e-452637dd .mobile-close:hover
{
	background: var(--ot-bg-3);
	color: var(--ot-text-1);
}

.e-452637dd .mobile-close > i
{
	font-size: 20px;
}

.e-452637dd .mobile-search
{
	position: relative;
	display: flex;
	align-items: center;
	margin: 16px 20px 4px;
}

.e-452637dd .mobile-search > .search-input
{
	width: 100%;
	height: 46px;
	padding: 0 46px 0 18px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: inherit;
	font-size: 15px;
	color: var(--ot-text-1);
	outline: none;
}

.e-452637dd .mobile-search > .search-input::placeholder
{
	color: var(--ot-text-3);
}

.e-452637dd .mobile-search > .search-icon
{
	position: absolute;
	right: 16px;
	font-size: 21px;
	color: var(--ot-blue);
	pointer-events: none;
}

.e-452637dd .mobile-nav
{
	display: flex;
	flex-direction: column;
	padding: 12px;
}

.e-452637dd .mobile-link
{
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 15px 10px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	transition: color 160ms;
}

.e-452637dd .mobile-link:last-child
{
	border-bottom: 0;
}

.e-452637dd .mobile-link:hover
{
	color: var(--ot-blue);
}

.e-452637dd .mobile-link-label
{
	flex: 1;
}

.e-452637dd .mobile-link-badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-blue);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.e-452637dd .mobile-link-chevron
{
	font-size: 22px;
	color: var(--ot-text-3);
}

.e-452637dd .mobile-top-links
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px 22px 4px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-452637dd .mobile-top-link
{
	padding: 8px 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-2);
	transition: color 160ms;
}

.e-452637dd .mobile-top-link:hover
{
	color: var(--ot-blue);
}

.e-452637dd .mobile-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 14px 20px 12px;
	padding: 15px 20px;
	background: var(--ot-blue);
	border-radius: 100px;
	font-size: 15px;
	font-weight: 700;
	color: white;
	transition: background 200ms;
}

.e-452637dd .mobile-cta:hover
{
	background: var(--ot-blue-hover);
}

.e-452637dd .mobile-cta > i
{
	font-size: 18px;
}

.e-452637dd .mobile-phone
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 0 20px 24px;
	line-height: 1.2;
}

.e-452637dd .mobile-phone > .phone-number
{
	font-size: 18px;
	font-weight: 700;
	color: var(--ot-green);
}

.e-452637dd .mobile-phone > .phone-hours
{
	font-size: 12px;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1200px)
{
	.e-452637dd > .holder > .inner
	{
		padding: 0 20px;
	}

	.e-452637dd .links
	{
		gap: 0;
	}

	.e-452637dd .link
	{
		padding: 10px 8px;
		font-size: 13.5px;
	}
}

@media (max-width: 1000px)
{
	.e-452637dd .top-links
	{
		display: none;
	}

	.e-452637dd .row-bottom
	{
		display: none;
	}

	.e-452637dd .burger
	{
		display: flex;
	}

	.e-452637dd .search
	{
		max-width: none;
	}
}

@media (max-width: 600px)
{
	.e-452637dd > .holder > .inner
	{
		padding: 0 16px;
	}

	.e-452637dd .row-top
	{
		flex-wrap: wrap;
		gap: 12px;
		padding: 12px 0;
	}

	.e-452637dd .brand
	{
		order: 1;
	}

	.e-452637dd .burger
	{
		order: 2;
		margin-left: auto;
	}

	.e-452637dd .search
	{
		order: 3;
		flex-basis: 100%;
	}

	.e-452637dd .brand > .brand-logo
	{
		height: 30px;
	}
}
.e-ef22c0a
{
	display: block;
	width: 100%;
}

.e-ef22c0a > .holder
{
	position: relative;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
}

/* ===== TONES ===== */

.e-ef22c0a > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: white;
}

.e-ef22c0a > .holder.tone-light
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border: 1px solid var(--ot-bg-2-border);
}

.e-ef22c0a > .holder.variant-brand
{
	background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);
	color: white;
}

/* ===== FULL VARIANT (image background) ===== */

.e-ef22c0a > .holder.variant-full
{
	background: var(--ot-bg-3);
	color: white;
}

.e-ef22c0a > .holder.variant-full > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
}

.e-ef22c0a > .holder.variant-full > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	z-index: 0;
}

.e-ef22c0a > .holder.variant-full > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(135deg, rgba(20, 18, 16, 0.78) 0%, rgba(20, 18, 16, 0.5) 100%);
}

/* ===== CONTENT ===== */

.e-ef22c0a > .holder > .content
{
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1fr;
	align-items: center;
	gap: 0;
	padding: 56px 56px;
}

.e-ef22c0a > .holder.variant-split.has-image > .content
{
	grid-template-columns: 1.2fr 1fr;
	gap: 48px;
	padding: 56px 56px 56px 64px;
}

/* No image -> two columns: text + decorative graphic */
.e-ef22c0a > .holder:not(.has-image):not(.variant-compact):not(.variant-full) > .content
{
	grid-template-columns: 1.15fr 0.85fr;
	gap: 40px;
}

.e-ef22c0a > .holder.variant-compact > .content
{
	padding: 36px 40px;
}

/* ===== TEXT ===== */

.e-ef22c0a .text
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 580px;
}

/* Eyebrow */

.e-ef22c0a .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-ef22c0a > .holder.tone-dark .eyebrow,
.e-ef22c0a > .holder.variant-full .eyebrow
{
	color: rgba(255, 254, 252, 0.85);
}

.e-ef22c0a > .holder.tone-light .eyebrow
{
	color: var(--ot-brand);
}

.e-ef22c0a > .holder.variant-brand .eyebrow
{
	color: rgba(255, 254, 252, 0.85);
}

.e-ef22c0a .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: currentColor;
	opacity: 0.7;
}

/* Title */

.e-ef22c0a .title
{
	font-family: var(--ot-font-secondary);
	font-size: 44px;
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.05;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-ef22c0a > .holder.variant-compact .title
{
	font-size: 32px;
}

.e-ef22c0a .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-ef22c0a > .holder.tone-dark .title,
.e-ef22c0a > .holder.variant-full .title,
.e-ef22c0a > .holder.variant-brand .title
{
	color: white;
}

.e-ef22c0a > .holder.variant-brand .title em
{
	color: white;
	opacity: 0.85;
}

.e-ef22c0a > .holder.variant-full .title em
{
	color: white;
	font-style: italic;
}

/* Description */

.e-ef22c0a .description
{
	font-size: 14.5px;
	line-height: 1.65;
	margin: 0;
	max-width: 480px;
	color: inherit;
	opacity: 0.78;
}

.e-ef22c0a > .holder.tone-light .description
{
	color: var(--ot-text-2);
	opacity: 1;
}

/* Perks */

.e-ef22c0a .perks
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 4px 0 8px;
	padding: 0;
	list-style: none;
}

.e-ef22c0a .perk
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.005em;
}

.e-ef22c0a .perk > i
{
	font-size: 16px;
	color: var(--ot-brand);
}

.e-ef22c0a > .holder.tone-dark .perk > i,
.e-ef22c0a > .holder.variant-full .perk > i
{
	color: rgba(255, 254, 252, 0.85);
}

.e-ef22c0a > .holder.variant-brand .perk > i
{
	color: white;
	opacity: 0.85;
}

/* ===== FORM ===== */

.e-ef22c0a .form
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 6px;
}

.e-ef22c0a .form-row
{
	display: flex;
	align-items: stretch;
	gap: 8px;
	background: var(--ot-bg-1);
	border: 1px solid transparent;
	border-radius: 100px;
	padding: 6px 6px 6px 18px;
	max-width: 480px;
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-ef22c0a > .holder.tone-light .form-row
{
	border-color: var(--ot-bg-3-border);
}

.e-ef22c0a .form-row:focus-within
{
	border-color: var(--ot-brand);
}

.e-ef22c0a .form-input
{
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1;
	min-width: 0;
}

.e-ef22c0a .form-icon
{
	font-size: 18px;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

.e-ef22c0a .form-input > input
{
	width: 100%;
	height: 44px;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	outline: none;
}

.e-ef22c0a .form-input > input::placeholder
{
	color: var(--ot-text-3);
}

.e-ef22c0a .form-cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 22px;
	background: var(--ot-text-1);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.005em;
	color: var(--ot-bg-1);
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms;
}

.e-ef22c0a .form-cta:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 12px;
}

.e-ef22c0a > .holder.variant-brand .form-cta
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-ef22c0a > .holder.variant-brand .form-cta:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-ef22c0a .form-cta > i
{
	font-size: 17px;
}

/* Disclaimer */

.e-ef22c0a .form-disclaimer
{
	display: block;
	font-size: 11px;
	line-height: 1.55;
	margin: 0;
	max-width: 480px;
	color: inherit;
	opacity: 0.55;
}

.e-ef22c0a > .holder.tone-light .form-disclaimer
{
	color: var(--ot-text-3);
	opacity: 1;
}

.e-ef22c0a .form-disclaimer > span
{
	display: inline;
}

.e-ef22c0a .form-disclaimer a
{
	display: inline;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ===== SIDE IMAGE (split variant) ===== */

.e-ef22c0a .side
{
	position: relative;
	min-height: 340px;
	border-radius: var(--ot-radius-m);
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-ef22c0a .side > .side-decoration
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(160deg, rgba(20, 18, 16, 0.0) 60%, rgba(20, 18, 16, 0.32) 100%);
}

/* ===== DECORATIVE GRAPHIC (no image) ===== */

.e-ef22c0a .decor
{
	position: relative;
	align-self: stretch;
	min-height: 280px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.e-ef22c0a .decor-ring
{
	position: absolute;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.10);
}

.e-ef22c0a .decor-ring-1
{
	width: 300px;
	height: 300px;
}

.e-ef22c0a .decor-ring-2
{
	width: 210px;
	height: 210px;
	border-color: rgba(255, 255, 255, 0.16);
}

.e-ef22c0a .decor-badge
{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 128px;
	height: 128px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);
	color: white;
}

.e-ef22c0a .decor-badge > i
{
	font-size: 56px;
}

.e-ef22c0a .decor-chip
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 15px;
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

.e-ef22c0a .decor-chip > i
{
	font-size: 17px;
	color: var(--ot-brand);
}

.e-ef22c0a .decor-chip-1
{
	top: 26px;
	right: 16px;
}

.e-ef22c0a .decor-chip-2
{
	bottom: 30px;
	left: 8px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-ef22c0a > .holder.variant-split.has-image > .content,
	.e-ef22c0a > .holder:not(.has-image):not(.variant-compact):not(.variant-full) > .content
	{
		grid-template-columns: 1fr;
		gap: 32px;
		padding: 44px 40px;
	}

	.e-ef22c0a .side
	{
		min-height: 220px;
	}

	.e-ef22c0a .decor
	{
		display: none;
	}
}

@media (max-width: 700px)
{
	.e-ef22c0a > .holder > .content
	{
		padding: 36px 28px;
	}

	.e-ef22c0a .title
	{
		font-size: 32px;
	}

	.e-ef22c0a .form-row
	{
		flex-direction: column;
		padding: 8px;
		border-radius: var(--ot-radius-m);
	}

	.e-ef22c0a .form-input
	{
		padding: 4px 10px;
	}

	.e-ef22c0a .form-cta
	{
		justify-content: center;
		padding: 14px 22px;
		border-radius: 100px;
	}
}
.e-2120f33a
{
	display: block;
}

.e-2120f33a > .holder
{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	pointer-events: none;
}

/* ===== TRIGGER ===== */

.e-2120f33a .trigger
{
	position: fixed;
	bottom: 54px;
	right: 28px;
	z-index: 901;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	background: #037ad5;
	border: 0;
	border-radius: 50%;
	color: var(--ot-bg-1);
	cursor: pointer;
	pointer-events: auto;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms;
}

.e-2120f33a > .holder.position-left .trigger
{
	right: auto;
	left: 28px;
}

.e-2120f33a .trigger:hover
{
	background: #0268b5;
	transform: scale(1.06);
}

.e-2120f33a > .holder.is-open .trigger
{
	background: #0268b5;
	transform: scale(0.92);
}

.e-2120f33a .trigger > .trigger-icon
{
	font-size: 26px;
	z-index: 1;
	font-variation-settings: 'FILL' 1;
}

.e-2120f33a .trigger > .trigger-pulse
{
	position: absolute;
	inset: -2px;
	border-radius: 50%;
	border: 2px solid #037ad5;
	opacity: 0;
	animation: e-2120f33a-pulse 2.4s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}

@keyframes e-2120f33a-pulse
{
	0%   { transform: scale(0.95); opacity: 0.5; }
	70%  { transform: scale(1.15); opacity: 0; }
	100% { transform: scale(1.15); opacity: 0; }
}

.e-2120f33a > .holder.is-open .trigger > .trigger-pulse
{
	display: none;
}

/* ===== BACKDROP ===== */

.e-2120f33a .backdrop
{
	position: fixed;
	inset: 0;
	z-index: 901;
	background: rgba(20, 18, 16, 0.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	pointer-events: auto;
	animation: e-2120f33a-fade 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes e-2120f33a-fade
{
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* ===== PANEL ===== */

.e-2120f33a .panel
{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 902;
	width: 100%;
	max-width: 420px;
	background: var(--ot-bg-1);
	border-left: 1px solid var(--ot-bg-2-border);
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: auto;
	overflow: hidden;
}

.e-2120f33a > .holder.position-left .panel
{
	right: auto;
	left: 0;
	border-left: 0;
	border-right: 1px solid var(--ot-bg-2-border);
	transform: translateX(-100%);
}

.e-2120f33a > .holder.is-open .panel
{
	transform: translateX(0);
}

/* ===== HEAD ===== */

.e-2120f33a .panel-head
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 28px 28px 24px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-2120f33a .panel-head-text
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.e-2120f33a .panel-eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-2120f33a .panel-eyebrow > .panel-eyebrow-mark
{
	width: 22px;
	height: 1px;
	background: var(--ot-brand);
}

.e-2120f33a .panel-title
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-2120f33a .panel-subtitle
{
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
}

.e-2120f33a .panel-close
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: var(--ot-bg-2);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	flex-shrink: 0;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), transform 200ms;
}

.e-2120f33a .panel-close:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	transform: rotate(90deg);
}

.e-2120f33a .panel-close > i
{
	font-size: 18px;
}

/* ===== BODY ===== */

.e-2120f33a .panel-body
{
	flex: 1;
	overflow-y: auto;
	padding: 24px 28px 28px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ===== CONTACTS GRID ===== */

.e-2120f33a .contacts
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-2120f33a .contact
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: inherit;
	transition: border-color 240ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms, transform 240ms;
}

.e-2120f33a .contact:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-3-border);
	transform: translateX(2px);
}

.e-2120f33a .contact-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	flex-shrink: 0;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms;
}

.e-2120f33a .contact:hover .contact-icon
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-2120f33a .contact.accent-brand:hover  .contact-icon { background: var(--ot-brand);             color: white; }
.e-2120f33a .contact.accent-green:hover  .contact-icon { background: rgba(20, 144, 95, 1);        color: white; }
.e-2120f33a .contact.accent-blue:hover   .contact-icon { background: rgba(40, 100, 200, 1);       color: white; }
.e-2120f33a .contact.accent-purple:hover .contact-icon { background: rgba(110, 60, 180, 1);       color: white; }

.e-2120f33a .contact-icon > i
{
	font-size: 19px;
}

.e-2120f33a .contact-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1;
	line-height: 1.3;
}

.e-2120f33a .contact-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-2120f33a .contact-value
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-2120f33a .contact-arrow
{
	font-size: 16px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1), transform 200ms;
}

.e-2120f33a .contact:hover .contact-arrow
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

/* ===== FORM ===== */

.e-2120f33a .form
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-top: 4px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-2120f33a .form-head
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 16px;
	margin-bottom: 8px;
}

.e-2120f33a .form-title
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-2120f33a .form-description
{
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--ot-text-2);
	margin: 0;
}

/* Field */

.e-2120f33a .field
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-2120f33a .field:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-2120f33a .field-textarea
{
	align-items: flex-start;
	padding-top: 14px;
}

.e-2120f33a .field-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-2120f33a .field:focus-within .field-icon
{
	color: var(--ot-brand);
}

.e-2120f33a .field input,
.e-2120f33a .field textarea
{
	width: 100%;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	outline: none;
	resize: none;
}

.e-2120f33a .field input::placeholder,
.e-2120f33a .field textarea::placeholder
{
	color: var(--ot-text-3);
}

.e-2120f33a .field textarea
{
	min-height: 60px;
	line-height: 1.55;
}

/* Form CTA */

.e-2120f33a .form-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 6px;
	padding: 14px 22px;
	background: var(--ot-text-1);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.005em;
	color: var(--ot-bg-1);
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms, transform 240ms;
}

.e-2120f33a .form-cta:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 12px;
	transform: translateY(-1px);
}

.e-2120f33a .form-cta > i
{
	font-size: 17px;
}

/* ===== FOOT ===== */

.e-2120f33a .panel-foot
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 28px;
	background: var(--ot-bg-2);
	border-top: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-2120f33a .panel-foot > i
{
	font-size: 20px;
	color: var(--ot-brand);
	flex-shrink: 0;
}

.e-2120f33a .panel-foot-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.3;
	min-width: 0;
}

.e-2120f33a .panel-foot-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-2120f33a .panel-foot-value
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 600px)
{
	.e-2120f33a .trigger
	{
		bottom: 46px;
		right: 20px;
		width: 52px;
		height: 52px;
	}

	.e-2120f33a > .holder.position-left .trigger
	{
		left: 20px;
	}

	.e-2120f33a .panel
	{
		max-width: 100%;
	}

	.e-2120f33a .panel-head
	{
		padding: 22px 22px 20px;
	}

	.e-2120f33a .panel-body
	{
		padding: 20px 22px 22px;
	}

	.e-2120f33a .panel-foot
	{
		padding: 16px 22px;
	}
}
.e-4e98bf65
{
	display: block;
}

.e-4e98bf65 > .holder
{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 900;
	display: flex;
	align-items: center;
	height: 38px;
	background: #ff8401;
	color: #000000;
	overflow: hidden;
}

.e-4e98bf65 > .holder > .label
{
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	height: 100%;
	padding: 0 16px;
	background: #037ad5;
	color: #FFFFFF;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
}

.e-4e98bf65 > .holder > .track
{
	position: relative;
	flex: 1;
	height: 100%;
	overflow: hidden;
	white-space: nowrap;
}

.e-4e98bf65 > .holder > .track > .message
{
	position: absolute;
	top: 50%;
	left: 0;
	display: inline-block;
	padding-left: 100%;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.01em;
	white-space: nowrap;
	transform: translateY(-50%);
	animation: e-4e98bf65-scroll 28s linear infinite;
}

@keyframes e-4e98bf65-scroll
{
	from
	{
		transform: translate(0, -50%);
	}

	to
	{
		transform: translate(-100%, -50%);
	}
}
.e-47aff2f
{
	display: block;
	width: 100%;
}

.e-47aff2f > .holder
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 42px;
	padding: 0 32px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.005em;
}

.e-47aff2f > .holder.tone-light
{
	background: var(--ot-bg-1);
	color: var(--ot-text-2);
}

.e-47aff2f > .holder.tone-dark
{
	background: var(--ot-text-1);
	color: rgba(255, 255, 255, 0.78);
}

/* ===== ROWS ===== */

.e-47aff2f > .holder > .left,
.e-47aff2f > .holder > .right
{
	display: flex;
	align-items: center;
	gap: 4px;
	flex-wrap: wrap;
}

.e-47aff2f > .holder > .left
{
	flex-shrink: 0;
}

/* ===== ITEM ===== */

.e-47aff2f .item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: transparent;
	border: 0;
	border-radius: 6px;
	color: inherit;
	cursor: pointer;
	white-space: nowrap;
	font: inherit;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), color 180ms;
}

.e-47aff2f > .holder.tone-light .item:hover
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-47aff2f > .holder.tone-dark .item:hover
{
	background: rgba(255, 255, 255, 0.08);
	color: white;
}

.e-47aff2f .item.phone
{
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-47aff2f > .holder.tone-dark .item.phone
{
	color: white;
}

.e-47aff2f .item > i
{
	font-size: 15px;
	opacity: 0.85;
}

.e-47aff2f .item > .badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 1px 6px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-left: 2px;
}

.e-47aff2f .dropdown-trigger > .chevron
{
	font-size: 14px;
	margin-left: -2px;
	opacity: 0.6;
	transition: transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-47aff2f .avatar
{
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-47aff2f > .holder
	{
		padding: 0 20px;
		gap: 16px;
	}

	.e-47aff2f .item
	{
		padding: 6px 10px;
	}
}

@media (max-width: 900px)
{
	.e-47aff2f > .holder
	{
		display: none;
	}
}
.e-8d5a0f0
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-8d5a0f0 > .holder
{
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	position: sticky;
	top: 96px;
}

/* ===== HEAD ===== */

.e-8d5a0f0 .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
	background: var(--ot-bg-1);
}

.e-8d5a0f0 .head-left
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.e-8d5a0f0 .head-icon
{
	font-size: 19px;
	color: var(--ot-brand);
}

.e-8d5a0f0 .head-title
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-8d5a0f0 .head-clear
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 10px;
	background: transparent;
	border: 0;
	border-radius: 6px;
	font-family: inherit;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-8d5a0f0 .head-clear:hover
{
	color: var(--ot-brand);
	background: var(--ot-brand-opacity);
}

.e-8d5a0f0 .head-clear > i
{
	font-size: 14px;
}

/* ===== BODY ===== */

.e-8d5a0f0 .body
{
	padding: 4px 0;
}

/* ===== GROUP ===== */

.e-8d5a0f0 .group
{
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-8d5a0f0 .group:last-child
{
	border-bottom: 0;
}

.e-8d5a0f0 .group-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 22px;
	background: transparent;
	border: 0;
	color: var(--ot-text-1);
	cursor: pointer;
	font: inherit;
	width: 100%;
}

.e-8d5a0f0 .group-head-text
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.e-8d5a0f0 .group-head-icon
{
	font-size: 16px;
	color: var(--ot-text-3);
	transition: color 200ms;
}

.e-8d5a0f0 .group.has-value .group-head-icon
{
	color: var(--ot-brand);
}

.e-8d5a0f0 .group-label
{
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-8d5a0f0 .group-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	padding: 1px 6px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 10.5px;
	font-weight: 500;
	color: white;
	font-variation-settings: 'opsz' 144;
}

.e-8d5a0f0 .group-chevron
{
	font-size: 18px;
	color: var(--ot-text-3);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .group.is-collapsed .group-chevron
{
	transform: rotate(-90deg);
}

.e-8d5a0f0 .group-body
{
	padding: 0 22px 18px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-8d5a0f0 .group.is-collapsed .group-body
{
	display: none;
}

/* ===== SEARCH ===== */

.e-8d5a0f0 .search
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .search:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-8d5a0f0 .search-icon
{
	font-size: 16px;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

.e-8d5a0f0 .search > input
{
	flex: 1;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	outline: none;
}

.e-8d5a0f0 .search > input::placeholder
{
	color: var(--ot-text-3);
}

/* ===== OPTIONS (checkbox / radio) ===== */

.e-8d5a0f0 .options
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-8d5a0f0 .options-search
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	margin-bottom: 6px;
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .options-search:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-8d5a0f0 .options-search > i
{
	font-size: 14px;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

.e-8d5a0f0 .options-search > input
{
	flex: 1;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-1);
	outline: none;
}

/* OPTION */

.e-8d5a0f0 .option
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 8px;
	border-radius: 6px;
	cursor: pointer;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .option:hover
{
	background: var(--ot-bg-2);
}

.e-8d5a0f0 .option-control
{
	position: relative;
	display: inline-flex;
	flex-shrink: 0;
}

.e-8d5a0f0 .option-control > input
{
	position: absolute;
	opacity: 0;
	width: 18px;
	height: 18px;
	cursor: pointer;
}

.e-8d5a0f0 .option-mark
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	background: var(--ot-bg-1);
	border: 1.5px solid var(--ot-bg-3-border);
	border-radius: 4px;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms;
}

.e-8d5a0f0 .group-radio .option-mark
{
	border-radius: 50%;
}

.e-8d5a0f0 .option-mark > i
{
	font-size: 14px;
	color: white;
	opacity: 0;
	transition: opacity 180ms;
	font-variation-settings: 'FILL' 1;
}

.e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
}

.e-8d5a0f0 .option.is-checked .option-mark > i
{
	opacity: 1;
}

.e-8d5a0f0 .group-radio .option.is-checked .option-mark > i
{
	font-size: 8px;
	color: white;
}

.e-8d5a0f0 .option-flag
{
	font-size: 16px;
	line-height: 1;
	flex-shrink: 0;
}

.e-8d5a0f0 .option-icon
{
	font-size: 17px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 180ms;
}

.e-8d5a0f0 .option.is-checked .option-icon
{
	color: var(--ot-brand);
}

.e-8d5a0f0 .option-label
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.002em;
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-8d5a0f0 .option.is-checked .option-label
{
	font-weight: 600;
}

.e-8d5a0f0 .option-count
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	flex-shrink: 0;
	letter-spacing: 0;
}

/* Expand button */

.e-8d5a0f0 .option-expand
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 8px;
	background: transparent;
	border: 0;
	font: inherit;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-brand);
	cursor: pointer;
	margin-top: 4px;
	width: fit-content;
	transition: gap 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .option-expand:hover
{
	gap: 8px;
}

.e-8d5a0f0 .option-expand > i
{
	font-size: 14px;
}

/* ===== RANGE ===== */

.e-8d5a0f0 .range-fields
{
	display: flex;
	align-items: center;
	gap: 8px;
}

.e-8d5a0f0 .range-field
{
	flex: 1;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-s);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
	cursor: text;
	min-width: 0;
}

.e-8d5a0f0 .range-field:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-8d5a0f0 .range-label
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	flex-shrink: 0;
}

.e-8d5a0f0 .range-field > input
{
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	outline: none;
	-moz-appearance: textfield;
	width: 100%;
	min-width: 0;
	flex: 1;
}

.e-8d5a0f0 .range-field > input::-webkit-outer-spin-button,
.e-8d5a0f0 .range-field > input::-webkit-inner-spin-button
{
	-webkit-appearance: none;
	margin: 0;
}

.e-8d5a0f0 .range-unit
{
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	flex-shrink: 0;
}

.e-8d5a0f0 .range-sep
{
	font-size: 13px;
	color: var(--ot-text-3);
	flex-shrink: 0;
}

/* ===== STARS ===== */

.e-8d5a0f0 .stars
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-8d5a0f0 .star-row
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 8px;
	background: transparent;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	font: inherit;
	width: 100%;
	transition: background 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-8d5a0f0 .star-row:hover
{
	background: var(--ot-bg-2);
}

.e-8d5a0f0 .star-row.is-checked
{
	background: var(--ot-brand-opacity);
}

.e-8d5a0f0 .star-icons
{
	display: inline-flex;
	gap: 1px;
}

.e-8d5a0f0 .star-icons > .star-on
{
	font-size: 16px;
	color: rgba(220, 165, 50, 1);
	font-variation-settings: 'FILL' 1;
}

.e-8d5a0f0 .star-icons > .star-off
{
	font-size: 16px;
	color: var(--ot-bg-3);
}

.e-8d5a0f0 .star-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

.e-8d5a0f0 .star-row.is-checked .star-label
{
	color: var(--ot-text-1);
	font-weight: 600;
}

/* ===== FOOT (apply) ===== */

.e-8d5a0f0 .foot
{
	padding: 14px 22px;
	border-top: 1px solid var(--ot-bg-2-border);
	background: var(--ot-bg-1);
	flex-shrink: 0;
}

.e-8d5a0f0 .apply
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 14px 18px;
	background: var(--ot-text-1);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-bg-1);
	letter-spacing: 0.005em;
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms;
}

.e-8d5a0f0 .apply:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 12px;
}

.e-8d5a0f0 .apply-count
{
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	background: rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
}

.e-8d5a0f0 .apply > i
{
	font-size: 17px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-8d5a0f0 > .holder
	{
		position: relative;
		top: auto;
		max-height: none;
	}
}
.e-6a07c313
{
	display: block;
	width: 100%;
}

.e-6a07c313 > .holder
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 24px 0;
}

/* ===== COUNTER ===== */

.e-6a07c313 .counter
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	flex-shrink: 0;
}

.e-6a07c313 .counter-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	margin-right: 2px;
}

.e-6a07c313 .counter-value
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

.e-6a07c313 .counter-sep
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: 0.005em;
}

.e-6a07c313 .counter-total
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-3);
	letter-spacing: -0.01em;
	font-variation-settings: 'opsz' 144;
}

/* ===== PAGES (left) ===== */

.e-6a07c313 .pages
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* ===== ASIDE (counter + per-page on the right) ===== */

.e-6a07c313 .aside
{
	display: inline-flex;
	align-items: center;
	gap: 24px;
	flex-shrink: 0;
}

/* Arrow */

.e-6a07c313 .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	font: inherit;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, border-color 220ms, transform 220ms;
}

.e-6a07c313 .arrow:hover:not(:disabled)
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
	transform: scale(1.04);
}

.e-6a07c313 .arrow:disabled
{
	opacity: 0.3;
	cursor: not-allowed;
}

.e-6a07c313 .arrow > i
{
	font-size: 18px;
}

/* Strelica sa natpisom ("Prethodna" / "Sledeća") prestaje da bude krug i uzima */
/* oblik pilule; bez labelPrev/labelNext ovo pravilo se nikad ne upali. */

.e-6a07c313 .arrow.is-labeled
{
	width: auto;
	gap: 8px;
	padding: 0 18px;
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
}

/* Page number */

.e-6a07c313 .page
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 8px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 50%;
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-2);
	letter-spacing: -0.005em;
	cursor: pointer;
	font-variation-settings: 'opsz' 144;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, border-color 220ms, transform 220ms;
}

.e-6a07c313 .page:hover:not(:disabled):not(.is-active)
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border-color: var(--ot-bg-2-border);
}

.e-6a07c313 .page.is-active
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	font-weight: 600;
	border-color: var(--ot-text-1);
	cursor: default;
}

.e-6a07c313 .page.is-dots
{
	cursor: default;
	color: var(--ot-text-3);
}

.e-6a07c313 .page.is-dots:hover
{
	background: transparent;
	border-color: transparent;
}

.e-6a07c313 .page.is-dots > i
{
	font-size: 18px;
}

/* ===== PER-PAGE ===== */

.e-6a07c313 .per-page
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.e-6a07c313 .per-page-select
{
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 36px 0 16px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	font-variation-settings: 'opsz' 144;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23787878' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6a07c313 .per-page-select:hover,
.e-6a07c313 .per-page-select:focus
{
	border-color: var(--ot-bg-3-border);
	outline: none;
}

.e-6a07c313 .per-page-label
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-6a07c313 > .holder
	{
		flex-wrap: wrap;
		gap: 16px;
		justify-content: center;
	}

	.e-6a07c313 .pages
	{
		flex: 1 1 100%;
		justify-content: center;
		flex-wrap: wrap;
	}

	.e-6a07c313 .aside
	{
		flex: 1 1 100%;
		justify-content: center;
		flex-wrap: wrap;
	}
}

@media (max-width: 600px)
{
	.e-6a07c313 .arrow
	{
		width: 36px;
		height: 36px;
	}

	.e-6a07c313 .page
	{
		min-width: 36px;
		height: 36px;
		font-size: 13px;
	}
}
.e-13096690
{
	display: block;
	width: 100%;
}

.e-13096690 > .holder
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* ===== LEFT (count + filter trigger) ===== */

.e-13096690 .left
{
	display: inline-flex;
	align-items: center;
	gap: 16px;
	flex: 1;
	min-width: 0;
}

.e-13096690 .filter-trigger
{
	display: none;
	align-items: center;
	gap: 8px;
	padding: 10px 16px 10px 14px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	cursor: pointer;
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-13096690 .filter-trigger:hover
{
	border-color: var(--ot-bg-3-border);
	background: var(--ot-bg-2);
}

.e-13096690 .filter-trigger > i
{
	font-size: 16px;
	color: var(--ot-brand);
}

.e-13096690 .filter-trigger-count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	padding: 1px 6px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-family: var(--ot-font-secondary);
	font-size: 10.5px;
	font-weight: 500;
	color: white;
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
}

/* Count */

.e-13096690 .count
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
}

.e-13096690 .count-value
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

.e-13096690 .count-label
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* ===== RIGHT (sort + view) ===== */

.e-13096690 .right
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

/* Sort */

.e-13096690 .sort
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px 10px 14px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font: inherit;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-13096690 .sort:hover
{
	border-color: var(--ot-bg-3-border);
	background: var(--ot-bg-2);
}

.e-13096690 .sort-icon
{
	font-size: 16px;
	color: var(--ot-text-3);
}

.e-13096690 .sort-label
{
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-13096690 .sort-value
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-13096690 .sort-chevron
{
	font-size: 16px;
	color: var(--ot-text-3);
	margin-left: -2px;
}

/* View toggle */

.e-13096690 .view
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	padding: 4px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
}

.e-13096690 .view-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: 0;
	border-radius: 100px;
	color: var(--ot-text-3);
	cursor: pointer;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1), color 200ms;
}

.e-13096690 .view-btn:hover
{
	color: var(--ot-text-1);
}

.e-13096690 .view-btn.is-active
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-13096690 .view-btn > i
{
	font-size: 18px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-13096690 > .holder
	{
		flex-wrap: wrap;
		gap: 12px;
	}

	.e-13096690 .filter-trigger
	{
		display: inline-flex;
	}

	.e-13096690 .left
	{
		flex: 1 1 100%;
		justify-content: space-between;
	}

	.e-13096690 .right
	{
		flex: 1 1 100%;
		justify-content: space-between;
	}

	.e-13096690 .sort-label
	{
		display: none;
	}
}

@media (max-width: 500px)
{
	.e-13096690 .view
	{
		display: none;
	}
}
/* ===== BEGIN: section-about-1 ===== */

.e-3dcde5cd
{
	display: block;
	width: 100%;
}

.e-3dcde5cd > .holder
{
	width: 100%;
}

/* ===== FRAME (rounded block holding the full-bleed photo) ===== */

.e-3dcde5cd .frame
{
	position: relative;
	min-height: 460px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-3dcde5cd .frame > .media-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-2);
	background-size: cover;
	background-position: center;
}

/* ===== PANEL (white block floating over the left of the photo) ===== */

.e-3dcde5cd .panel
{
	position: relative;
	z-index: 1;
	width: 46%;
	margin: 44px;
	padding: 48px;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

.e-3dcde5cd .panel > .title
{
	margin: 0 0 22px;
	max-width: 12em;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-brand);
}

.e-3dcde5cd .panel > .desc
{
	margin: 0 0 32px;
	font-size: 16px;
	line-height: 1.75;
	color: var(--ot-text-2);
}

/* ===== PILL BUTTON (transparent, thin outline, dark uppercase) ===== */

.e-3dcde5cd .panel > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0 26px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ot-text-1);
	transition: background 220ms ease, border-color 220ms ease, color 220ms ease;
}

.e-3dcde5cd .panel > .button:hover
{
	background: var(--ot-bg-2);
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== LOGOS ROW ===== */

.e-3dcde5cd .logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 28px;
	margin-top: 40px;
}

.e-3dcde5cd .logos > .logo
{
	flex: 0 0 auto;
	width: 96px;
	height: 30px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0.85;
	transition: opacity 220ms ease;
}

.e-3dcde5cd .logos > .logo:hover
{
	opacity: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-3dcde5cd .frame
	{
		display: flex;
		flex-direction: column;
		min-height: 0;
	}

	.e-3dcde5cd .frame > .media-image
	{
		position: static;
		height: 260px;
	}

	.e-3dcde5cd .panel
	{
		width: auto;
		margin: 0;
		padding: 40px;
		border-radius: 0;
		box-shadow: none;
	}
}

@media (max-width: 640px)
{
	.e-3dcde5cd .frame > .media-image
	{
		height: 200px;
	}

	.e-3dcde5cd .panel
	{
		padding: 28px;
	}

	.e-3dcde5cd .panel > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-about-1 ===== */
/* ===== BEGIN: section-about-2 ===== */

.e-3dcde5cc
{
	display: block;
	width: 100%;
}

.e-3dcde5cc > .holder
{
	width: 100%;
}

/* ===== FRAME (rounded block holding the full-bleed photo) ===== */

.e-3dcde5cc .frame
{
	position: relative;
	min-height: 460px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-3dcde5cc .frame > .media-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-2);
	background-size: cover;
	background-position: center;
}

/* ===== PANEL (white block floating over the left of the photo) ===== */

.e-3dcde5cc .panel
{
	position: relative;
	z-index: 1;
	width: 46%;
	margin: 44px;
	padding: 48px;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

.e-3dcde5cc .panel > .title
{
	margin: 0 0 22px;
	max-width: 12em;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-brand);
}

.e-3dcde5cc .panel > .desc
{
	margin: 0 0 32px;
	font-size: 16px;
	line-height: 1.75;
	color: var(--ot-text-2);
}

/* ===== PILL BUTTON (transparent, thin outline, dark uppercase) ===== */

.e-3dcde5cc .panel > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0 26px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ot-text-1);
	transition: background 220ms ease, border-color 220ms ease, color 220ms ease;
}

.e-3dcde5cc .panel > .button:hover
{
	background: var(--ot-bg-2);
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== LOGOS ROW ===== */

.e-3dcde5cc .logos
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 28px;
	margin-top: 40px;
}

.e-3dcde5cc .logos > .logo
{
	flex: 0 0 auto;
	width: 96px;
	height: 30px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0.85;
	transition: opacity 220ms ease;
}

.e-3dcde5cc .logos > .logo:hover
{
	opacity: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-3dcde5cc .frame
	{
		display: flex;
		flex-direction: column;
		min-height: 0;
	}

	.e-3dcde5cc .frame > .media-image
	{
		position: static;
		height: 260px;
	}

	.e-3dcde5cc .panel
	{
		width: auto;
		margin: 0;
		padding: 40px;
		border-radius: 0;
		box-shadow: none;
	}
}

@media (max-width: 640px)
{
	.e-3dcde5cc .frame > .media-image
	{
		height: 200px;
	}

	.e-3dcde5cc .panel
	{
		padding: 28px;
	}

	.e-3dcde5cc .panel > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-about-2 ===== */
/* ===== BEGIN: section-active-mozaik-1 (mozaik aktivnih odmora: red od tri pa red od dve sire kartice) ===== */

.e-64670b38
{
	display: block;
	width: 100%;
}

.e-64670b38 > .holder
{
	width: 100%;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-64670b38 > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* Broj kolona i proporcija slike stizu inline kao --cols i --ratio, pa media query moze da ih pregazi. */

.e-64670b38 > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (cela klikabilna, jednake visine u redu) ===== */

.e-64670b38 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 10px;
	background: #dceefb;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-64670b38 .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* Redovi sa manje kartica dobijaju siru proporciju, pa su prirodno visi od gustih redova. */

.e-64670b38 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: var(--ratio, 4 / 3);
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-64670b38 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (svetloplavi blok: naslov, opis, pa dugme prikovano na dno) ===== */

.e-64670b38 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 20px 22px 22px;
	background: #dceefb;
}

.e-64670b38 .card > .card-body > .card-name
{
	font-family: var(--ot-font-primary);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: #24303a;
}

.e-64670b38 .card > .card-body > .card-desc
{
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	color: #55617a;
}

/* margin-top: auto drzi dugmad svih kartica u redu u istoj liniji, bez obzira na duzinu opisa. */

.e-64670b38 .card > .card-body > .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding: 11px 22px;
	border-radius: 999px;
	background: #f5821e;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-decoration: none;
	color: #ffffff;
	transition: background 220ms ease;
}

.e-64670b38 .card:hover > .card-body > .card-button
{
	background: #dd7213;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-64670b38 > .holder > .grid
	{
		gap: 20px;
	}

	.e-64670b38 > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-64670b38 .card > .card-image
	{
		aspect-ratio: 16 / 9;
	}
}

@media (max-width: 640px)
{
	.e-64670b38 > .holder > .grid
	{
		gap: 16px;
	}

	.e-64670b38 > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-64670b38 .card > .card-body
	{
		padding: 18px 18px 20px;
	}

	.e-64670b38 .card > .card-body > .card-name
	{
		font-size: 19px;
	}
}

/* ===== END: section-active-mozaik-1 ===== */
/* ===== BEGIN: section-active-trips-1 ===== */

.e-1ae67f37
{
	display: block;
	width: 100%;
	--active-orange: #f57c00;
	--active-orange-hover: #e06f00;
}

.e-1ae67f37 > .holder
{
	width: 100%;
	padding: 40px;
	border-radius: 24px;
	background: #f7f1e6;
}

/* ===== HEADER (levo poravnat veliki tamni naslov) ===== */

.e-1ae67f37 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

.e-1ae67f37 .title
{
	margin: 0;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== GRID (red 1: 3 uske; red 2: 2 sire) ===== */

.e-1ae67f37 .grid
{
	display: grid;
	gap: 20px;
	align-items: stretch;
}

.e-1ae67f37 .grid-narrow
{
	grid-template-columns: repeat(3, 1fr);
}

.e-1ae67f37 .grid-wide
{
	grid-template-columns: repeat(2, 1fr);
	margin-top: 20px;
}

/* Tri sire kartice u redu: kolone se izjednace sa prvim redom. */

.e-1ae67f37 .grid-wide.is-triple
{
	grid-template-columns: repeat(3, 1fr);
}

.e-1ae67f37 .grid-extra
{
	grid-template-columns: repeat(3, 1fr);
	margin-top: 20px;
}

/* ===== CARD (slika gore + svetlo plavi blok dole) ===== */

.e-1ae67f37 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 18px;
	background: #ffffff;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-1ae67f37 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
}

.e-1ae67f37 .card-image
{
	display: block;
	width: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-1ae67f37 .card-narrow .card-image
{
	height: 190px;
}

.e-1ae67f37 .card-wide .card-image
{
	height: 280px;
}

.e-1ae67f37 .grid-wide.is-triple .card-wide .card-image
{
	height: 190px;
}

.e-1ae67f37 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (svetlo plavi gradijent, footer poravnat na dno) ===== */

.e-1ae67f37 .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 18px 20px 20px;
	background: linear-gradient(180deg, #eef6fe 0%, #e2f0fc 100%);
}

.e-1ae67f37 .card-title
{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-1ae67f37 .card-wide .card-title
{
	font-size: 21px;
}

.e-1ae67f37 .grid-wide.is-triple .card-wide .card-title
{
	font-size: 18px;
}

.e-1ae67f37 .card-text
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: #334155;
}

/* Prostor iznad footera se rasteze da kartice budu jednake visine; dugme poravnato desno. */

.e-1ae67f37 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 14px;
}

/* Sve kartice: narandzasto dugme sa tekstom "Saznaj vise". */

.e-1ae67f37 .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 22px;
	flex-shrink: 0;
	border-radius: 12px;
	background: var(--active-orange);
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	transition: background var(--ot-transition);
}

.e-1ae67f37 .card:hover .card-button
{
	background: var(--active-orange-hover);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 900px)
{
	.e-1ae67f37 .grid-narrow,
	.e-1ae67f37 .grid-extra
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-1ae67f37 .grid-wide,
	.e-1ae67f37 .grid-wide.is-triple
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-1ae67f37 .title
	{
		font-size: 30px;
	}
}

@media (max-width: 560px)
{
	.e-1ae67f37 > .holder
	{
		padding: 24px 18px;
	}

	.e-1ae67f37 .grid-narrow,
	.e-1ae67f37 .grid-wide,
	.e-1ae67f37 .grid-wide.is-triple,
	.e-1ae67f37 .grid-extra
	{
		grid-template-columns: 1fr;
	}

	.e-1ae67f37 .card-wide .card-image,
	.e-1ae67f37 .grid-wide.is-triple .card-wide .card-image
	{
		height: 210px;
	}

	.e-1ae67f37 .card-button
	{
		flex: 1 1 auto;
	}
}

/* ===== END: section-active-trips-1 ===== */
/* ===== BEGIN: section-all-inclusive-1 (tamna mreža 3×2 hotel kartica) ===== */

.e-2ae854a6
{
	display: block;
	width: 100%;
}

.e-2ae854a6 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-2ae854a6 > .holder > .head
{
	margin-bottom: 24px;
}

.e-2ae854a6 .title
{
	margin: 0;
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #ffffff;
}

/* ===== GRID (3 columns x 2 rows, equal cells) ===== */

.e-2ae854a6 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-2ae854a6 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: #172336;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, background 320ms ease, border-color 320ms ease;
}

.e-2ae854a6 .card:hover
{
	transform: translateY(-6px);
	background: #1c2942;
	border-color: rgba(255, 255, 255, 0.16);
	box-shadow: 0 20px 44px rgba(0, 0, 0, 0.5);
}

/* ===== CARD IMAGE (inset, rounded, holds the two badges) ===== */

.e-2ae854a6 .card > .card-image
{
	position: relative;
	display: block;
	margin: 12px 12px 0;
	aspect-ratio: 3 / 2;
	background-color: #0f1a2b;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

/* ===== PROMO PILL (orange, top-left) ===== */

.e-2ae854a6 .card-image > .promo
{
	position: absolute;
	top: 10px;
	left: 10px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	max-width: calc(100% - 20px);
	padding: 5px 10px;
	background: #f5811f;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.e-2ae854a6 .card-image > .promo > i
{
	font-size: 14px;
	line-height: 1;
}

.e-2ae854a6 .card-image > .promo > span
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== SERVICE PILL (blue, top-right) ===== */

.e-2ae854a6 .card-image > .service
{
	position: absolute;
	top: 10px;
	right: 10px;
	max-width: calc(100% - 20px);
	padding: 5px 10px;
	background: #037ad5;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* ===== CARD BODY ===== */

.e-2ae854a6 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 10px;
	padding: 14px 16px 16px;
}

/* ===== NAME + STARS ===== */

.e-2ae854a6 .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.e-2ae854a6 .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.4em;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
}

.e-2ae854a6 .stars
{
	display: inline-flex;
	flex-shrink: 0;
	gap: 1px;
	padding-top: 2px;
	color: #f5c518;
}

.e-2ae854a6 .stars > i
{
	font-size: 15px;
	line-height: 1;
}

/* ===== RATING + LOCATION ===== */

.e-2ae854a6 .rating-row
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.e-2ae854a6 .rating
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.e-2ae854a6 .rating-score
{
	padding: 3px 8px;
	background: rgba(46, 160, 92, 0.18);
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.2;
	color: #58d68d;
}

.e-2ae854a6 .rating-label
{
	font-size: 13px;
	font-weight: 700;
	color: #58d68d;
}

.e-2ae854a6 .location
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	line-height: 1.35;
	color: #9fb0c6;
}

.e-2ae854a6 .location > i
{
	font-size: 16px;
	line-height: 1;
}

/* ===== TAGS (departure + feature pills) ===== */

.e-2ae854a6 .tags
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}

.e-2ae854a6 .tag
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
}

.e-2ae854a6 .tag > i
{
	font-size: 15px;
	line-height: 1;
	flex-shrink: 0;
}

.e-2ae854a6 .tag > span
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-2ae854a6 .tag-departure
{
	background: rgba(255, 255, 255, 0.06);
	color: #cdd8e8;
}

.e-2ae854a6 .tag-feature
{
	background: rgba(46, 160, 92, 0.14);
	color: #7ee0a6;
}

/* ===== SPACER (stretches so footer pins to bottom) ===== */

.e-2ae854a6 .spacer
{
	flex: 1;
	min-height: 6px;
}

/* ===== FOOTER (price + button, pinned to bottom) ===== */

.e-2ae854a6 .footer
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.e-2ae854a6 .price-old
{
	font-size: 12px;
	color: #8494ab;
	text-decoration: line-through;
}

.e-2ae854a6 .price-line
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
}

.e-2ae854a6 .price-main
{
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px;
}

.e-2ae854a6 .price-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #8494ab;
}

.e-2ae854a6 .price-new
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
	color: #ffffff;
}

.e-2ae854a6 .price-unit
{
	font-size: 12px;
	color: #9fb0c6;
}

.e-2ae854a6 .cta
{
	flex-shrink: 0;
	padding: 9px 16px;
	background: #037ad5;
	border-radius: var(--ot-radius-s);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.1;
	color: #ffffff;
	white-space: nowrap;
	transition: background 200ms ease;
}

.e-2ae854a6 .card:hover .cta
{
	background: #0269b6;
}

.e-2ae854a6 .price-total
{
	font-size: 12px;
	color: #8494ab;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-2ae854a6 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-2ae854a6 .price-line
	{
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
	}

	.e-2ae854a6 .cta
	{
		width: 100%;
		text-align: center;
	}
}

/* ===== END: section-all-inclusive-1 ===== */
/* ===== BEGIN: section-all-inclusive-slider-1 ===== */

.e-50e07830
{
	display: block;
	width: 100%;
}

.e-50e07830 > .holder
{
	width: 100%;
}

/* ===== LAYOUT: text left (narrow) + slider right (wide) ===== */

.e-50e07830 .layout
{
	display: grid;
	grid-template-columns: minmax(260px, 340px) 1fr;
	gap: 40px;
	align-items: start;
}

/* ===== INTRO (left column) ===== */

.e-50e07830 .intro > .eyebrow
{
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-orange);
	letter-spacing: 0.02em;
}

.e-50e07830 .intro > .title
{
	margin: 10px 0 0;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

.e-50e07830 .intro > .subtitle
{
	margin: 14px 0 0;
	font-size: 17px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.e-50e07830 .intro > .description
{
	margin: 14px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-50e07830 .stage
{
	position: relative;
	outline: none;
}

.e-50e07830 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 0 40px;
}

.e-50e07830 .track
{
	display: flex;
	align-items: flex-start;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (staggered portrait cards) ===== */

.e-50e07830 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-50e07830 .cell:nth-child(even)
{
	margin-top: 38px;
}

.e-50e07830 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	text-decoration: none;
	background-color: var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(15, 40, 70, 0.10);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-50e07830 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(15, 40, 70, 0.18);
}

/* ===== CARD IMAGE (full-cover, gentle zoom on hover) ===== */

.e-50e07830 .card > .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-50e07830 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== ORANGE PRICE PILL (top-left, two lines) ===== */

.e-50e07830 .card > .pill
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 8px 14px;
	background: var(--ot-orange);
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(15, 40, 70, 0.18);
}

.e-50e07830 .pill > .pill-price
{
	font-size: 15px;
	font-weight: 800;
	line-height: 1.1;
	color: white;
	white-space: nowrap;
}

.e-50e07830 .pill > .pill-unit
{
	font-size: 11px;
	font-weight: 500;
	line-height: 1.1;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== FLOATING WHITE BOTTOM BLOCK (name + orange circle chevron) ===== */

.e-50e07830 .card > .card-panel
{
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 14px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	background: white;
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(15, 40, 70, 0.16);
}

.e-50e07830 .card-panel > .panel-name
{
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--ot-text-1);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.e-50e07830 .card-panel > .panel-arrow
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--ot-orange);
	color: white;
	font-size: 20px;
	line-height: 1;
	transition: background 240ms ease;
}

.e-50e07830 .card:hover .panel-arrow
{
	background: var(--ot-orange-hover);
}

/* ===== CONTROLS (below slider, right aligned: prev / counter / next) ===== */

.e-50e07830 .controls
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 14px;
	margin-top: 4px;
}

.e-50e07830 .controls > .counter
{
	font-size: 15px;
	font-weight: 700;
	color: var(--ot-text-1);
	min-width: 48px;
	text-align: center;
}

.e-50e07830 .controls > .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 0;
	cursor: pointer;
	transition: background 240ms, color 240ms, transform 240ms;
}

.e-50e07830 .controls > .arrow > i
{
	font-size: 24px;
	line-height: 1;
}

.e-50e07830 .controls > .arrow-prev
{
	background: var(--ot-bg-3);
	color: var(--ot-text-2);
	opacity: 0.6;
}

.e-50e07830 .controls > .arrow-prev:hover
{
	opacity: 1;
}

.e-50e07830 .controls > .arrow-next
{
	background: var(--ot-text-1);
	color: white;
}

.e-50e07830 .controls > .arrow-next:hover
{
	transform: scale(1.06);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-50e07830 .layout
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.e-50e07830 .intro > .title { font-size: 32px; }
}

@media (max-width: 640px)
{
	.e-50e07830 .intro > .title { font-size: 27px; }
	.e-50e07830 .cell { padding: 0 8px; }
	.e-50e07830 .cell:nth-child(even) { margin-top: 0; }
	.e-50e07830 .card-panel > .panel-name { font-size: 14px; }
}

/* ===== END: section-all-inclusive-slider-1 ===== */
/* ===== BEGIN: section-allinclusive-destinations-1 (red uspravnih foto kartica sa belom pilulom naziva) ===== */

.e-fec7e6d
{
	display: block;
	width: 100%;
}

.e-fec7e6d > .holder
{
	width: 100%;
}

/* ===== TITLE (levo poravnat, teget, jako bold; sans-serif eksplicitno jer sites globalno gura serif na h1-h6) ===== */

.e-fec7e6d > .holder > .title
{
	margin: 0 0 26px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: left;
	color: #16294d;
}

/* ===== GRID (4 uspravne kartice jednake sirine i visine u jednom redu) ===== */

.e-fec7e6d > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (cela kartica je link, full-cover slika, blago zaobljeni uglovi) ===== */

.e-fec7e6d > .holder > .grid > .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	border-radius: 12px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

/* Zasebni sloj nosi zumiranje da se sam okvir kartice ne pomera pri hoveru. */

.e-fec7e6d > .holder > .grid > .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-fec7e6d > .holder > .grid > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.e-fec7e6d > .holder > .grid > .card:hover::before
{
	transform: scale(1.06);
}

/* ===== LABEL (providna bela pilula dole levo, naziv destinacije teget bold) ===== */

.e-fec7e6d > .holder > .grid > .card > .label
{
	position: absolute;
	left: 16px;
	bottom: 16px;
	z-index: 2;
	display: inline-block;
	max-width: calc(100% - 32px);
	padding: 10px 18px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	color: #16294d;
	transition: background 260ms ease;
}

.e-fec7e6d > .holder > .grid > .card:hover > .label
{
	background: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-fec7e6d > .holder > .grid
	{
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	.e-fec7e6d > .holder > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-fec7e6d > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.e-fec7e6d > .holder > .title { font-size: 26px; }

	.e-fec7e6d > .holder > .grid > .card > .label
	{
		left: 12px;
		bottom: 12px;
		max-width: calc(100% - 24px);
		padding: 8px 14px;
		font-size: 14px;
	}
}

/* ===== END: section-allinclusive-destinations-1 ===== */
/* ===== BEGIN: section-allinclusive-mozaik-1 (All Inclusive mozaik plocica) ===== */

.e-6108d30d
{
	display: block;
	width: 100%;
}

.e-6108d30d > .holder
{
	width: 100%;
}

/* Naslov mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-6108d30d > .holder > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #16294d;
}

.e-6108d30d > .holder > .subtitle
{
	margin: 10px 0 0 0;
	max-width: 720px;
	font-size: 16px;
	line-height: 1.6;
	color: #6b7280;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-6108d30d > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin-top: 28px;
}

/* Sirine kolona stizu inline kao --cols, pa media query moze da ih pregazi. */

.e-6108d30d > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	gap: 22px;
}

/* ===== VISINE REDOVA (unutar reda jednake, redovi smeju da se razlikuju) ===== */

.e-6108d30d > .holder > .grid > .row > .tile
{
	height: 300px;
}

.e-6108d30d > .holder > .grid > .row:nth-of-type(1) > .tile
{
	height: 340px;
}

.e-6108d30d > .holder > .grid > .row:nth-of-type(2) > .tile
{
	height: 300px;
}

/* ===== TILE (klikabilan link, cela plocica je fotografija) ===== */

.e-6108d30d .tile
{
	position: relative;
	display: flex;
	overflow: hidden;
	border-radius: 12px;
	background-color: var(--ot-bg-3);
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-6108d30d .tile:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.e-6108d30d .tile > .tile-image
{
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6108d30d .tile:hover > .tile-image
{
	transform: scale(1.06);
}

/* ===== OVERLAY (blag tamni prelaz pri dnu radi citljivosti natpisa) ===== */

.e-6108d30d .tile > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 34%, rgba(0, 0, 0, 0.30) 62%, rgba(0, 0, 0, 0.66) 100%);
	transition: opacity 360ms ease;
}

.e-6108d30d .tile:hover > .overlay
{
	opacity: 0.9;
}

/* ===== NATPIS (dole levo, isti polozaj na svakoj plocici bez obzira na sirinu) ===== */

.e-6108d30d .tile > .caption
{
	position: absolute;
	z-index: 2;
	left: 24px;
	right: 24px;
	bottom: 22px;
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: left;
	color: #ffffff;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6108d30d > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-6108d30d > .holder > .grid > .row > .tile,
	.e-6108d30d > .holder > .grid > .row:nth-of-type(1) > .tile,
	.e-6108d30d > .holder > .grid > .row:nth-of-type(2) > .tile
	{
		height: 280px;
	}

	.e-6108d30d > .holder > .title
	{
		font-size: 30px;
	}

	.e-6108d30d .tile > .caption
	{
		font-size: 22px;
	}
}

@media (max-width: 640px)
{
	.e-6108d30d > .holder > .grid
	{
		gap: 18px;
	}

	.e-6108d30d > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-6108d30d > .holder > .grid > .row > .tile,
	.e-6108d30d > .holder > .grid > .row:nth-of-type(1) > .tile,
	.e-6108d30d > .holder > .grid > .row:nth-of-type(2) > .tile
	{
		height: 250px;
	}

	.e-6108d30d > .holder > .title
	{
		font-size: 26px;
	}

	.e-6108d30d > .holder > .subtitle
	{
		font-size: 15px;
	}

	.e-6108d30d .tile > .caption
	{
		left: 20px;
		right: 20px;
		bottom: 18px;
		font-size: 21px;
	}
}

/* ===== END: section-allinclusive-mozaik-1 ===== */
/* ===== BEGIN: section-allinclusive-picks-1 (karusel izdvojenih All Inclusive hotela) ===== */

.e-2ddaa1ce
{
	--aip-navy: #16294d;
	--aip-grey: #6b7280;
	--aip-blue: #2f6feb;
	--aip-green: #1f8a5f;
	--aip-pink: #e6197d;
	--aip-line: #e9ecf2;
	display: block;
	background-color: transparent;
}

.e-2ddaa1ce > .holder
{
	display: block;
}

/* Naslov: sites aplikacija gura serif na svaki h1-h6, pa sans-serif mora eksplicitno. */

.e-2ddaa1ce > .holder > .head
{
	margin-bottom: 26px;
}

.e-2ddaa1ce > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--aip-navy);
}

/* Strelica lebdi preko desne ivice reda, pa .stage ne sme da kljuca sadrzaj. */

.e-2ddaa1ce > .holder > .stage
{
	position: relative;
}

.e-2ddaa1ce > .holder > .stage > .viewport
{
	overflow: hidden;
	margin: 0 -12px;
	padding: 6px 0;
}

.e-2ddaa1ce > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-2ddaa1ce > .holder > .stage > .viewport > .track > .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 3));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 3));
	min-width: 0;
	padding: 0 12px;
}

/* Sve kartice su iste visine (align-items: stretch + height: 100%), pa im se dna poklapaju. */

.e-2ddaa1ce .cell > .card
{
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.e-2ddaa1ce .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(16, 24, 40, 0.14);
}

.e-2ddaa1ce .card > .card-media
{
	position: relative;
	flex: 0 0 250px;
	height: 250px;
	overflow: hidden;
}

.e-2ddaa1ce .card-media > .media-link
{
	position: absolute;
	inset: 0;
	display: block;
}

.e-2ddaa1ce .card-media > .media-link > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: var(--ot-bg-3);
	transition: transform 0.35s ease;
}

.e-2ddaa1ce .cell > .card:hover .media-image
{
	transform: scale(1.06);
}

/* Dvodelna logo plocica: jedan omotac nosi radijus i senku, delovi samo svoju boju. */

.e-2ddaa1ce .card-media > .card-plate
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: flex;
	align-items: stretch;
	max-width: calc(100% - 76px);
	overflow: hidden;
	border-radius: 4px;
	box-shadow: 0 6px 14px rgba(20, 18, 16, 0.22);
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: #ffffff;
}

.e-2ddaa1ce .card-plate > .plate-main
{
	display: flex;
	align-items: center;
	padding: 6px 11px;
}

.e-2ddaa1ce .card-plate > .plate-tail
{
	display: flex;
	align-items: center;
	padding: 6px 10px;
	letter-spacing: 0.02em;
}

.e-2ddaa1ce .card-media > .heart
{
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	background-color: rgba(255, 255, 255, 0.86);
	border: 0;
	border-radius: 50%;
	box-shadow: 0 4px 10px rgba(16, 24, 40, 0.18);
	color: var(--aip-navy);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.e-2ddaa1ce .card-media > .heart > i
{
	font-size: 19px;
	line-height: 1;
}

.e-2ddaa1ce .card-media > .heart.is-liked
{
	background-color: var(--aip-pink);
	color: #ffffff;
}

.e-2ddaa1ce .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	box-sizing: border-box;
	padding: 16px 18px 18px;
}

/* Sirina 100% je uslov da se naziv lomi po telu kartice: roditelj ima align-items: flex-start pa bi se span skupio na sadrzaj i ostao u jednom redu. */

.e-2ddaa1ce .card-body > .card-name
{
	width: 100%;
	font-family: var(--ot-font-primary);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--aip-navy);
	text-decoration: none;
}

.e-2ddaa1ce .card-body > .card-name:hover
{
	color: var(--aip-blue);
}

.e-2ddaa1ce .card-body > .marks
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px;
	margin-top: 10px;
}

.e-2ddaa1ce .marks > .mark
{
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
	color: var(--aip-blue);
}

.e-2ddaa1ce .marks > .mark-plus
{
	padding: 2px 7px;
	background-color: rgba(47, 111, 235, 0.12);
	border-radius: 4px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--aip-blue);
}

.e-2ddaa1ce .marks > .score
{
	margin-left: 4px;
	padding: 3px 10px;
	background-color: var(--aip-blue);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	color: #ffffff;
}

.e-2ddaa1ce .card-body > .review
{
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 10px;
}

.e-2ddaa1ce .review > .review-dot
{
	display: block;
	width: 9px;
	height: 9px;
	background-color: #dfe3ea;
	border-radius: 50%;
}

.e-2ddaa1ce .review > .review-dot.is-on
{
	background-color: var(--aip-green);
}

.e-2ddaa1ce .review > .review-count
{
	margin-left: 6px;
	font-size: 12px;
	line-height: 1.4;
	color: var(--aip-grey);
}

.e-2ddaa1ce .card-body > .rule
{
	display: block;
	width: 100%;
	height: 1px;
	margin: 14px 0;
	background-color: var(--aip-line);
}

.e-2ddaa1ce .card-body > .meta
{
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.e-2ddaa1ce .meta > .meta-line,
.e-2ddaa1ce .meta > .meta-city
{
	font-size: 13px;
	line-height: 1.5;
	color: var(--aip-grey);
}

/* Razpinjac gura cenu i dugme na dno kartice; min-height cene drzi dugmad u JEDNOJ liniji i kad kartica nema precrtanu staru cenu. */

.e-2ddaa1ce .card-body > .spacer
{
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 14px;
}

.e-2ddaa1ce .card-body > .price
{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	width: 100%;
	min-height: 76px;
	gap: 2px;
}

.e-2ddaa1ce .price > .price-label
{
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 800;
	line-height: 1.4;
	color: var(--aip-navy);
}

.e-2ddaa1ce .price > .price-old
{
	font-size: 13px;
	line-height: 1.4;
	color: var(--aip-grey);
	text-decoration: line-through;
}

.e-2ddaa1ce .price > .price-new
{
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--aip-navy);
}

.e-2ddaa1ce .card-body > .foot
{
	display: flex;
	justify-content: flex-end;
	width: 100%;
	margin-top: 14px;
}

.e-2ddaa1ce .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 42px;
	padding: 10px 26px;
	background-color: var(--aip-blue);
	border-radius: 999px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	color: #ffffff;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.e-2ddaa1ce .foot > .cta:hover
{
	background-color: #2559c7;
}

.e-2ddaa1ce > .holder > .stage > .arrow
{
	position: absolute;
	top: 125px;
	right: -16px;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	background-color: #ffffff;
	border: 1px solid #e3e7ee;
	border-radius: 50%;
	box-shadow: 0 8px 20px rgba(16, 24, 40, 0.16);
	color: var(--aip-navy);
	cursor: pointer;
	transform: translateY(-50%);
	transition: background-color 0.2s ease, color 0.2s ease;
}

.e-2ddaa1ce > .holder > .stage > .arrow > i
{
	font-size: 22px;
	line-height: 1;
}

.e-2ddaa1ce > .holder > .stage > .arrow:hover
{
	background-color: var(--aip-blue);
	border-color: var(--aip-blue);
	color: #ffffff;
}

.e-2ddaa1ce > .holder > .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 26px;
}

.e-2ddaa1ce > .holder > .dots > .dot
{
	display: block;
	width: 9px;
	height: 9px;
	background-color: #d9dee7;
	border-radius: 50%;
}

.e-2ddaa1ce > .holder > .dots > .dot.is-active
{
	width: 24px;
	background-color: var(--aip-navy);
	border-radius: 999px;
}

@media (max-width: 1024px)
{
	.e-2ddaa1ce > .holder > .head > .title
	{
		font-size: 28px;
	}

	.e-2ddaa1ce .card > .card-media
	{
		flex: 0 0 220px;
		height: 220px;
	}

	.e-2ddaa1ce > .holder > .stage > .arrow
	{
		top: 110px;
		right: -8px;
	}
}

@media (max-width: 640px)
{
	.e-2ddaa1ce > .holder > .head > .title
	{
		font-size: 24px;
	}

	.e-2ddaa1ce .card-body > .foot
	{
		justify-content: stretch;
	}

	.e-2ddaa1ce .foot > .cta
	{
		width: 100%;
	}

	.e-2ddaa1ce > .holder > .stage > .arrow
	{
		right: 2px;
	}
}

/* ===== END: section-allinclusive-picks-1 ===== */
/* ===== BEGIN: section-allinclusive-recommend ===== */

.e-6defae04
{
	--ai-orange: #f5821e;
	--ai-orange-hover: #dc6f0f;
	--ai-navy: #16294d;
	--ai-grey: #6b7280;
	--ai-lift: 22px;

	display: block;
	width: 100%;
}

.e-6defae04 > .holder
{
	width: 100%;
}

/* ===== RASPORED (uska uvodna kolona levo, karusel desno) ===== */

.e-6defae04 .layout
{
	display: grid;
	grid-template-columns: minmax(260px, 330px) 1fr;
	gap: 40px;
	align-items: start;
}

/* ===== UVODNA KOLONA ===== */

.e-6defae04 .intro
{
	text-align: left;
}

.e-6defae04 .intro > .eyebrow
{
	display: block;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.02em;
	color: var(--ai-orange);
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-6defae04 .intro > .title
{
	margin: 10px 0 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ai-navy);
}

.e-6defae04 .intro > .subtitle
{
	margin: 14px 0 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--ai-navy);
}

.e-6defae04 .intro > .description
{
	margin: 14px 0 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--ai-grey);
}

/* ===== KARUSEL ===== */

.e-6defae04 .stage
{
	position: relative;
	min-width: 0;
}

/* Gornji padding pravi mesto podignutim karticama da ih viewport ne odsece. */

.e-6defae04 .viewport
{
	position: relative;
	overflow: hidden;
	padding: var(--ai-lift) 0 26px;
}

.e-6defae04 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-6defae04 .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 2.6));
	max-width: calc(100% / var(--per-view, 2.6));
	box-sizing: border-box;
	padding: 0 11px;
}

.e-6defae04 .cell.is-raised
{
	transform: translateY(calc(-1 * var(--ai-lift)));
}

/* ===== KARTICA (cela je link; slika popunjava ceo okvir) ===== */

.e-6defae04 .card
{
	position: relative;
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: flex-end;
	min-width: 0;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	text-decoration: none;
	background: #dbe6f0;
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(15, 40, 70, 0.12);
	transition: box-shadow var(--ot-transition);
}

.e-6defae04 .card:hover
{
	box-shadow: 0 16px 38px rgba(15, 40, 70, 0.20);
}

.e-6defae04 .card > .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: #dbe6f0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-6defae04 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* Blaga senka pri dnu da bela plocica ne lebdi na svetloj fotografiji bez razdvajanja. */

.e-6defae04 .card > .card-shade
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	height: 55%;
	background: linear-gradient(to bottom, rgba(9, 20, 40, 0) 0%, rgba(9, 20, 40, 0.30) 100%);
}

/* ===== NARANDZASTA ZASTAVICA (isti offset gore-levo na svakoj kartici) ===== */

.e-6defae04 .card > .card-flag
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 8px 14px;
	background: var(--ai-orange);
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(9, 20, 40, 0.18);
}

.e-6defae04 .card-flag > .flag-price
{
	display: block;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
}

.e-6defae04 .card-flag > .flag-unit
{
	display: block;
	margin-top: 2px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	color: rgba(255, 255, 255, 0.92);
}

/* ===== BELA PLOCICA (lebdi preko donjeg dela slike, uvucena sa sve tri strane) ===== */

.e-6defae04 .card > .card-plate
{
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	gap: 12px;
	width: calc(100% - 28px);
	margin: 0 14px 14px;
	padding: 14px 16px;
	background: rgba(255, 255, 255, 0.94);
	border-radius: 10px;
	box-shadow: 0 8px 20px rgba(9, 20, 40, 0.14);
}

/* Rezervisana visina dva reda drzi sve plocice iste visine i dugmad u istoj liniji. */

.e-6defae04 .card-plate > .plate-text
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

/* Rezervacija stoji na samom nazivu (a ne na koloni) da napomena uvek dodaje isti prirastaj,
pa sve plocice jedne sekcije ostanu iste visine bez obzira na to da li se naziv prelama. */

.e-6defae04 .plate-text > .plate-name
{
	display: -webkit-box;
	min-height: 44px;
	overflow: hidden;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--ai-navy);
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* Sitna napomena ispod naziva (grad, regija i drzava hotela); prazna se ne renderuje.
Ostaje u jednom redu sa elipsom da sve plocice zadrze istu visinu i kad je lokacija duga. */

.e-6defae04 .plate-text > .plate-note
{
	display: block;
	margin-top: 3px;
	overflow: hidden;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ai-grey);
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Kategorija hotela: Unicode zvezdice, jer je Material FILL osa prikovana na 0 pa bi glif ostao konturan. */

.e-6defae04 .plate-text > .plate-stars
{
	display: block;
	margin-top: 4px;
	overflow: hidden;
	font-size: 12px;
	line-height: 1;
	color: var(--ai-orange);
	letter-spacing: 1px;
	white-space: nowrap;
}

/* Sitni podaci o aranzmanu (broj nocenja, prevoz); red je opcion i renderuje se samo kad je lista popunjena. */
/* Ostaje u JEDNOM redu, kao i napomena iznad, da sve plocice jedne sekcije zadrze istu visinu. */

.e-6defae04 .plate-text > .plate-meta
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 6px;
	overflow: hidden;
	white-space: nowrap;
}

.e-6defae04 .plate-meta > .meta-item
{
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 4px;
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--ai-grey);
}

.e-6defae04 .meta-item > i
{
	font-size: 15px;
	line-height: 1;
	color: var(--ai-orange);
}

.e-6defae04 .card-plate > .plate-go
{
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: var(--ai-orange);
	border-radius: 50%;
	transition: background var(--ot-transition);
}

.e-6defae04 .plate-go > i
{
	font-size: 24px;
	line-height: 1;
	color: #ffffff;
}

.e-6defae04 .card:hover .plate-go
{
	background: var(--ai-orange-hover);
}

/* ===== KONTROLE (ispod karusela, poravnate desno) ===== */

.e-6defae04 .controls
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	padding: 0 11px;
}

.e-6defae04 .controls > .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: none;
	background: #ffffff;
	border-radius: 50%;
	color: var(--ai-navy);
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(15, 40, 70, 0.14);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-6defae04 .controls > .arrow > i
{
	font-size: 24px;
	line-height: 1;
}

.e-6defae04 .controls > .arrow:hover
{
	background: var(--ai-orange);
	color: #ffffff;
}

.e-6defae04 .controls > .arrow.is-off
{
	opacity: 0.4;
	cursor: default;
}

.e-6defae04 .controls > .arrow.is-off:hover
{
	background: #ffffff;
	color: var(--ai-navy);
}

.e-6defae04 .controls > .counter
{
	min-width: 54px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-align: right;
	color: var(--ai-navy);
}

/* ===== RESPONSIVE (tablet uvod iznad karusela, mobilni jedna puna kartica) ===== */

@media (max-width: 1024px)
{
	.e-6defae04 .layout
	{
		grid-template-columns: 1fr;
		gap: 26px;
	}

	.e-6defae04 .intro > .title
	{
		font-size: 32px;
	}

	/* Kartica je ovde toliko siroka da nijedan naziv ne prelama, pa rezervisani drugi red postaje prazan prostor. */

	.e-6defae04 .plate-text > .plate-name
	{
		min-height: 0;
	}
}

@media (max-width: 640px)
{
	.e-6defae04 .intro > .title
	{
		font-size: 27px;
	}

	.e-6defae04 .viewport
	{
		padding: 0 0 22px;
	}

	.e-6defae04 .cell
	{
		padding: 0 4px;
	}

	.e-6defae04 .cell.is-raised
	{
		transform: none;
	}

	.e-6defae04 .controls
	{
		padding: 0 4px;
	}
}

/* ===== END: section-allinclusive-recommend ===== */
/* ===== BEGIN: section-ambassador-1 ===== */

.e-51868b33
{
	display: block;
	width: 100%;
	--ambassador-gold: #f5c518;
	--ambassador-ink: #1c1a12;
}

.e-51868b33 > .holder
{
	width: 100%;
	padding: 16px 0;
}

/* ===== ZONES (levo naslov / sredina portret / desno naslov + opis) ===== */

.e-51868b33 > .holder > .zones
{
	display: grid;
	grid-template-columns: 1.05fr 0.8fr 1.05fr;
	align-items: start;
	gap: 48px;
}

/* ===== LEVA ZONA (veliki serif naslov, poravnat pri vrhu) ===== */

.e-51868b33 .zone-left
{
	min-width: 0;
}

.e-51868b33 .left-title
{
	margin: 0;
	max-width: 7em;
	font-family: var(--ot-font-secondary);
	font-size: 46px;
	font-weight: 800;
	line-height: 1.14;
	color: white;
}

/* ===== SREDNJA ZONA (portret + zakosena zuta etiketa) ===== */

.e-51868b33 .zone-mid
{
	min-width: 0;
}

.e-51868b33 .photo-wrap
{
	position: relative;
	width: 100%;
}

.e-51868b33 .photo-wrap > .photo
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	background-color: rgba(255, 255, 255, 0.08);
	background-size: cover;
	background-position: center;
	border-radius: 6px;
}

.e-51868b33 .photo-wrap > .tag
{
	position: absolute;
	left: -24px;
	bottom: -18px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 12px 18px 14px;
	background: var(--ambassador-gold);
	border-radius: 4px;
	box-shadow: 0 10px 22px rgba(0, 0, 0, 0.28);
	transform: rotate(-10deg);
	transform-origin: left bottom;
}

.e-51868b33 .photo-wrap > .tag > .tag-ring
{
	width: 11px;
	height: 11px;
	border: 2px solid rgba(28, 26, 18, 0.55);
	border-radius: 50%;
	background: transparent;
}

.e-51868b33 .photo-wrap > .tag > .tag-text
{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	white-space: nowrap;
	color: var(--ambassador-ink);
}

/* ===== DESNA ZONA (naslov + prostran opis, poravnata pri sredini) ===== */

.e-51868b33 .zone-right
{
	align-self: center;
	min-width: 0;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa desni naslov vraca sans eksplicitno. */

.e-51868b33 .right-title
{
	margin: 0 0 16px;
	font-family: var(--ot-font-primary);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	color: white;
}

.e-51868b33 .right-text
{
	margin: 0;
	font-size: 15px;
	line-height: 1.85;
	color: rgba(255, 255, 255, 0.78);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-51868b33 > .holder > .zones
	{
		grid-template-columns: 1fr;
		gap: 34px;
	}

	.e-51868b33 .left-title
	{
		max-width: none;
		font-size: 36px;
	}

	.e-51868b33 .photo-wrap
	{
		max-width: 340px;
	}

	.e-51868b33 .zone-right
	{
		align-self: start;
	}
}

@media (max-width: 560px)
{
	.e-51868b33 .left-title
	{
		font-size: 29px;
	}

	.e-51868b33 .photo-wrap
	{
		max-width: none;
	}

	.e-51868b33 .photo-wrap > .tag
	{
		left: -8px;
		bottom: -10px;
		padding: 10px 14px 12px;
		transform: rotate(-6deg);
	}

	.e-51868b33 .photo-wrap > .tag > .tag-text
	{
		font-size: 11px;
	}

	.e-51868b33 .right-text
	{
		line-height: 1.75;
	}
}

/* ===== END: section-ambassador-1 ===== */
/* ===== BEGIN: section-ambassador-2 ===== */

.e-51868b34
{
	display: block;
	width: 100%;
	--director-orange: #e8730c;
	--director-ink: #0d3b66;
}

/* Kontejner nosi svetlo plavu pozadinu i izrazeno zaobljene uglove (uvucen od ivica ekrana). */

.e-51868b34 > .holder
{
	width: 100%;
	padding: 52px 48px;
	border-radius: 32px;
	background: #e2eefb;
}

/* ===== ZONES (levo naslov / sredina portret sa bedzom / desno citat i opis) ===== */

.e-51868b34 > .holder > .zones
{
	display: grid;
	grid-template-columns: 1.05fr 0.8fr 1.05fr;
	align-items: start;
	gap: 48px;
}

/* ===== LEVA ZONA (veliki jako bold tamni naslov) ===== */

.e-51868b34 .zone-left
{
	min-width: 0;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-51868b34 .left-title
{
	margin: 0;
	max-width: 8em;
	font-family: var(--ot-font-primary);
	font-size: 42px;
	font-weight: 800;
	line-height: 1.16;
	color: var(--director-ink);
}

/* ===== SREDNJA ZONA (portret + narandzasti okrugli bedz) ===== */

.e-51868b34 .zone-mid
{
	min-width: 0;
}

.e-51868b34 .photo-wrap
{
	position: relative;
	width: 100%;
}

.e-51868b34 .photo-wrap > .photo
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	background-color: rgba(13, 59, 102, 0.08);
	background-size: cover;
	background-position: center;
	border-radius: 14px;
}

/* Bedz naleze na donji levi ugao i izlazi preko leve ivice slike. */

.e-51868b34 .photo-wrap > .badge
{
	position: absolute;
	left: -42px;
	bottom: -26px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	width: 158px;
	height: 158px;
	padding: 14px;
	box-sizing: border-box;
	border: 3px solid #ffffff;
	border-radius: 50%;
	background: var(--director-orange);
	box-shadow: 0 12px 26px rgba(13, 59, 102, 0.22);
	text-align: center;
}

.e-51868b34 .photo-wrap > .badge > .badge-role
{
	font-size: 11px;
	font-weight: 500;
	line-height: 1.25;
	color: rgba(255, 255, 255, 0.9);
}

.e-51868b34 .photo-wrap > .badge > .badge-name
{
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

/* ===== DESNA ZONA (citat + prostran opis, poravnata pri sredini) ===== */

.e-51868b34 .zone-right
{
	align-self: center;
	min-width: 0;
}

.e-51868b34 .quote
{
	margin: 0 0 16px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--director-ink);
}

.e-51868b34 .text
{
	margin: 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.85;
	color: #334155;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-51868b34 > .holder
	{
		padding: 40px 32px;
	}

	.e-51868b34 > .holder > .zones
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-51868b34 .left-title
	{
		max-width: none;
		font-size: 34px;
	}

	.e-51868b34 .photo-wrap
	{
		max-width: 340px;
		margin-left: 42px;
	}

	.e-51868b34 .zone-right
	{
		align-self: start;
	}
}

@media (max-width: 560px)
{
	.e-51868b34 > .holder
	{
		padding: 28px 20px;
		border-radius: 24px;
	}

	.e-51868b34 .left-title
	{
		font-size: 27px;
	}

	.e-51868b34 .photo-wrap
	{
		max-width: none;
		margin-left: 28px;
	}

	.e-51868b34 .photo-wrap > .badge
	{
		left: -28px;
		bottom: -18px;
		width: 120px;
		height: 120px;
		padding: 10px;
	}

	.e-51868b34 .photo-wrap > .badge > .badge-role
	{
		font-size: 10px;
	}

	.e-51868b34 .photo-wrap > .badge > .badge-name
	{
		font-size: 14px;
	}

	.e-51868b34 .quote
	{
		font-size: 19px;
	}

	.e-51868b34 .text
	{
		line-height: 1.75;
	}
}

/* ===== END: section-ambassador-2 ===== */
/* ===== BEGIN: section-area-places-1 ===== */

.e-422f52f2
{
	--ap-purple: #3b1f5c;
	--ap-lilac: #f3edf7;

	display: block;
}

/* ===== NASLOV (centriran, sans-serif jer sites app inace gura serif na h1-h6) ===== */

.e-422f52f2 > .holder > .title
{
	margin: 0 0 28px 0;
	font-family: var(--ot-font-primary);
	font-size: 32px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	color: var(--ap-purple);
}

/* ===== RED KARTICA ===== */

.e-422f52f2 > .holder > .row
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	align-items: stretch;
	gap: 20px;
}

.e-422f52f2 .row > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(31, 15, 50, 0.08);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-422f52f2 .row > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 10px 24px rgba(31, 15, 50, 0.16);
}

/* Ista uspravna proporcija na svim karticama drzi dna slika u istoj liniji. */

.e-422f52f2 .card > .photo
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	background-color: #e6dfec;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-422f52f2 .row > .card:hover > .photo
{
	transform: scale(1.05);
}

/* Fiksna minimalna visina trake drzi sve nazive u istoj liniji i kad se prelome. */

.e-422f52f2 .card > .label
{
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 12px 10px;
	background: var(--ap-lilac);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	color: var(--ap-purple);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-422f52f2 > .holder > .row
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-422f52f2 > .holder > .title
	{
		margin-bottom: 20px;
		font-size: 24px;
	}

	.e-422f52f2 > .holder > .row
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}

	.e-422f52f2 .card > .label
	{
		min-height: 46px;
		font-size: 15px;
	}
}

/* ===== END: section-area-places-1 ===== */
.e-17139193
{
	display: block;
	width: 100%;
}

.e-17139193 > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	grid-auto-rows: 200px;
	gap: 16px;
}

/* ===== BANNER ===== */

.e-17139193 .banner
{
	position: relative;
	display: flex;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	background: var(--ot-bg-3);
	color: white;
	cursor: pointer;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
	min-height: 200px;
}

.e-17139193 .banner:hover
{
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-17139193 .banner > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-17139193 .banner > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-17139193 .banner:hover > .cover::before
{
	transform: scale(1.05);
}

.e-17139193 .banner > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* ===== TONE OVERLAY (preko slike) ===== */

.e-17139193 .tone-dark  > .cover > .cover-overlay { background: linear-gradient(180deg, rgba(20, 18, 16, 0.10) 0%, rgba(20, 18, 16, 0.40) 55%, rgba(20, 18, 16, 0.85) 100%); }
.e-17139193 .tone-light > .cover > .cover-overlay { background: linear-gradient(180deg, rgba(255, 255, 255, 0.0) 0%, rgba(255, 255, 255, 0.55) 60%, rgba(255, 255, 255, 0.92) 100%); }
.e-17139193 .tone-brand > .cover > .cover-overlay { background: linear-gradient(135deg, var(--ot-brand-opacity) 0%, var(--ot-brand) 100%); }
.e-17139193 .tone-gold  > .cover > .cover-overlay { background: linear-gradient(135deg, rgba(170, 130, 60, 0.30) 0%, rgba(150, 110, 45, 0.88) 100%); }
.e-17139193 .tone-green > .cover > .cover-overlay { background: linear-gradient(135deg, rgba(20, 144, 95, 0.30) 0%, rgba(15, 120, 78, 0.88) 100%); }
.e-17139193 .tone-blue  > .cover > .cover-overlay { background: linear-gradient(135deg, rgba(30, 110, 200, 0.30) 0%, rgba(20, 90, 175, 0.88) 100%); }

/* ===== TONE SOLID (bez slike) ===== */

.e-17139193 .banner:not(:has(.cover))
{
	background: var(--ot-text-1);
}

.e-17139193 .tone-light:not(:has(.cover)) { background: var(--ot-bg-2); }
.e-17139193 .tone-brand:not(:has(.cover)) { background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%); }
.e-17139193 .tone-gold:not(:has(.cover))  { background: linear-gradient(135deg, rgba(170, 130, 60, 1) 0%, rgba(120, 90, 40, 1) 100%); }
.e-17139193 .tone-green:not(:has(.cover)) { background: linear-gradient(135deg, rgba(20, 144, 95, 1) 0%, rgba(13, 105, 68, 1) 100%); }
.e-17139193 .tone-blue:not(:has(.cover))  { background: linear-gradient(135deg, rgba(30, 110, 200, 1) 0%, rgba(18, 80, 160, 1) 100%); }

/* ===== CONTENT ===== */

.e-17139193 .banner > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
	padding: 22px 24px 24px;
	width: 100%;
}

.e-17139193 .content-top
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.e-17139193 .meta
{
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	background: rgba(255, 255, 255, 0.96);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-1);
	letter-spacing: 0.02em;
}

.e-17139193 .eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-17139193 .content-main
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
}

.e-17139193 .title
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.06;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-17139193 .title em
{
	font-style: italic;
}

.e-17139193 .description
{
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.85);
	margin: 0;
	max-width: 420px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-17139193 .cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-17139193 .cta > i
{
	font-size: 16px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-17139193 .banner:hover .cta > i
{
	transform: translateX(4px);
}

/* ===== TONE-LIGHT TEKST (taman tekst na svetlom) ===== */

.e-17139193 .tone-light > .content > .content-main > .title,
.e-17139193 .tone-light > .content > .content-main > .cta
{
	color: var(--ot-text-1);
}

.e-17139193 .tone-light > .content > .content-main > .description
{
	color: var(--ot-text-2);
}

.e-17139193 .tone-light > .content > .content-top > .eyebrow
{
	color: var(--ot-brand);
}

/* ===== CLEAN — čista slika bez overlay-a, tekst ispod ===== */

.e-17139193 > .holder.variant-clean
{
	grid-auto-rows: 350px;
}

.e-17139193 .variant-clean .banner
{
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	color: var(--ot-text-1);
}

.e-17139193 .variant-clean .banner > .cover
{
	position: relative;
	inset: auto;
	flex: 1;
	min-height: 0;
}

.e-17139193 .variant-clean .banner > .content
{
	position: static;
	flex: none;
	gap: 8px;
	padding: 18px 22px 20px;
}

.e-17139193 .variant-clean .banner > .content > .content-top
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
}

.e-17139193 .variant-clean .banner .eyebrow
{
	color: var(--ot-brand);
}

.e-17139193 .variant-clean .banner .title,
.e-17139193 .variant-clean .banner .cta
{
	color: var(--ot-text-1);
}

.e-17139193 .variant-clean .banner .description
{
	color: var(--ot-text-2);
}

.e-17139193 .variant-clean .banner .cta
{
	color: var(--ot-brand);
}

/* ===== VEĆE PLOČICE — krupniji naslov ===== */

.e-17139193 .banner[style*="span 2"] .title
{
	font-size: 34px;
	letter-spacing: -0.025em;
}

.e-17139193 .banner[style*="span 2"][style*="row: span 2"] .title
{
	font-size: 42px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-17139193 > .holder
	{
		grid-template-columns: repeat(2, 1fr);
		grid-auto-rows: 190px;
	}
}

@media (max-width: 600px)
{
	.e-17139193 > .holder
	{
		grid-template-columns: 1fr;
		grid-auto-rows: 200px;
	}

	.e-17139193 .banner[style*="span 2"]
	{
		grid-column: auto !important;
	}

	.e-17139193 .banner[style*="row: span 2"]
	{
		grid-row: auto !important;
	}

	.e-17139193 .banner[style*="span 2"] .title,
	.e-17139193 .banner[style*="span 2"][style*="row: span 2"] .title
	{
		font-size: 28px;
	}
}
/* ===== BEGIN: section-benefit-bento-1 ===== */

.e-5d1b108a
{
	display: block;
	width: 100%;
}

.e-5d1b108a > .holder
{
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

/* ===== TOP (slogan left, benefits right) ===== */

.e-5d1b108a .top
{
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
	gap: 32px;
	align-items: center;
}

.e-5d1b108a .slogan
{
	font-size: 30px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
}

.e-5d1b108a .benefits
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.e-5d1b108a .benefit
{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-5d1b108a .benefit > .ico > i
{
	color: var(--ot-red);
	font-size: 30px;
}

.e-5d1b108a .benefit > .b-title
{
	font-size: 15px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.e-5d1b108a .benefit > .b-text
{
	font-size: 13px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== BENTO (2 stacked left + 1 tall right) ===== */

.e-5d1b108a .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1.1fr 0.9fr;
	grid-template-areas: 'a big' 'b big';
	gap: 20px;
}

.e-5d1b108a .bento > .slot-a
{
	grid-area: a;
}

.e-5d1b108a .bento > .slot-b
{
	grid-area: b;
}

.e-5d1b108a .bento > .slot-big
{
	grid-area: big;
}

/* ===== CARD ===== */

.e-5d1b108a .card
{
	position: relative;
	display: block;
	min-height: 240px;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.10);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5d1b108a .card.slot-big
{
	min-height: 500px;
}

.e-5d1b108a .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16);
}

.e-5d1b108a .card > .card-cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform var(--ot-transition);
}

.e-5d1b108a .card:hover > .card-cover
{
	transform: scale(1.05);
}

/* ===== YELLOW PRICE PILL (top-right, above the white block) ===== */

.e-5d1b108a .card > .card-price
{
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 3;
	padding: 6px 12px;
	border-radius: 999px;
	background: #f5c518;
	color: #1c1a12;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}

/* ===== WHITE OVERLAP BLOCK (top-left, juts past left edge) ===== */

.e-5d1b108a .card > .card-panel
{
	position: absolute;
	top: 24px;
	left: -6px;
	z-index: 2;
	max-width: 72%;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 16px 18px;
	background: #fff;
	border-radius: var(--ot-radius-s);
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.10);
}

.e-5d1b108a .card > .card-panel > .panel-title
{
	font-size: 18px;
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-5d1b108a .card > .card-panel > .panel-text
{
	font-size: 13px;
	line-height: 1.4;
	color: var(--ot-text-1);
}

.e-5d1b108a .card > .card-panel > .panel-cta
{
	margin-top: 4px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ot-red);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5d1b108a .top
	{
		grid-template-columns: 1fr;
	}

	.e-5d1b108a .benefits
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px)
{
	.e-5d1b108a .bento
	{
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-template-areas: 'a' 'b' 'big';
	}

	.e-5d1b108a .card.slot-big
	{
		min-height: 300px;
	}

	.e-5d1b108a .card > .card-panel
	{
		max-width: 90%;
	}
}

@media (max-width: 560px)
{
	.e-5d1b108a .slogan
	{
		font-size: 24px;
	}
}

/* ===== END: section-benefit-bento-1 ===== */
/* ===== BEGIN: section-benefit-cards-1 (mreža kartica pogodnosti sa akcentnim bojama) ===== */

.e-2ed710ad
{
	display: block;
	width: 100%;
}

.e-2ed710ad > .holder
{
	width: 100%;
}

/* ===== HEADER (centriran plavi naslov) ===== */

.e-2ed710ad > .holder > .head
{
	margin-bottom: 26px;
	text-align: center;
}

.e-2ed710ad .title
{
	margin: 0;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2;
	color: #037ad5;
}

/* ===== GRID (dva reda: 4 gore, 3 dole, ista ukupna širina) ===== */

.e-2ed710ad .grid
{
	display: grid;
	gap: 18px;
	align-items: stretch;
}

.e-2ed710ad .grid-top
{
	grid-template-columns: repeat(4, 1fr);
}

.e-2ed710ad .grid-bottom
{
	grid-template-columns: repeat(3, 1fr);
	margin-top: 18px;
}

/* ===== CARD (bela pozadina, tanak akcentni okvir, hover) ===== */

.e-2ed710ad .card
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	height: 100%;
	padding: 22px;
	border: 2px solid #f57c00;
	border-radius: 16px;
	background: #ffffff;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-2ed710ad .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.12);
}

/* ===== ICON TILE (kvadrat sa akcentnom pozadinom, bela ikonica) ===== */

.e-2ed710ad .card > .ico
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: #f57c00;
	color: #ffffff;
	flex-shrink: 0;
}

.e-2ed710ad .card > .ico > i
{
	font-size: 28px;
	line-height: 1;
}

/* ===== TITLE (plavi, bold, do dva reda) ===== */

.e-2ed710ad .card > .card-title
{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: #037ad5;
}

/* ===== TEXT (sivi opis) ===== */

.e-2ed710ad .card > .card-text
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: #64748b;
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 900px)
{
	.e-2ed710ad .grid-top,
	.e-2ed710ad .grid-bottom
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px)
{
	.e-2ed710ad .grid-top,
	.e-2ed710ad .grid-bottom
	{
		grid-template-columns: 1fr;
	}

	.e-2ed710ad .title
	{
		font-size: 25px;
	}
}

/* ===== END: section-benefit-cards-1 ===== */
/* ===== BEGIN: section-benefits-1 ===== */

.e-552d7a22
{
	display: block;
	width: 100%;
}

/* ===== HOLDER (white rounded block) ===== */

.e-552d7a22 > .holder
{
	width: 100%;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.08);
	overflow: hidden;
}

/* ===== GRID (two equal, equal-height columns) ===== */

.e-552d7a22 .grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
}

/* ===== LEFT COLUMN (full-height image) ===== */

.e-552d7a22 .media
{
	position: relative;
	min-height: 100%;
}

.e-552d7a22 .media > .media-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-2);
	background-size: cover;
	background-position: center;
}

/* ===== RIGHT COLUMN (content panel) ===== */

.e-552d7a22 .panel
{
	padding: 48px;
}

.e-552d7a22 .panel > .pill
{
	display: inline-flex;
	align-items: center;
	margin-bottom: 20px;
	padding: 6px 14px;
	background: #fce4f1;
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #e0218a;
}

.e-552d7a22 .panel > .title
{
	margin: 0 0 8px;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--ot-text-1);
}

.e-552d7a22 .panel > .subtitle
{
	margin: 0 0 28px;
	font-size: 17px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== BENEFITS LIST ===== */

.e-552d7a22 .benefits
{
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
}

.e-552d7a22 .benefit
{
	display: flex;
	align-items: center;
	gap: 14px;
}

.e-552d7a22 .benefit > .ico
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #e0218a;
}

.e-552d7a22 .benefit > .ico > i
{
	font-size: 26px;
	line-height: 1;
	font-variation-settings: 'FILL' 0, 'wght' 300;
}

.e-552d7a22 .benefit > .text
{
	font-size: 16px;
	line-height: 1.4;
	color: var(--ot-text-1);
}

.e-552d7a22 .benefit > .text b
{
	font-weight: 700;
}

/* ===== CTA BUTTON ===== */

.e-552d7a22 .panel > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 28px;
	background: #e0218a;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: white;
	transition: background 220ms ease;
}

.e-552d7a22 .panel > .cta:hover
{
	background: #c11a76;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-552d7a22 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-552d7a22 .media
	{
		min-height: 260px;
	}

	.e-552d7a22 .panel
	{
		padding: 36px;
	}
}

@media (max-width: 640px)
{
	.e-552d7a22 .media
	{
		min-height: 200px;
	}

	.e-552d7a22 .panel
	{
		padding: 24px;
	}

	.e-552d7a22 .panel > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-benefits-1 ===== */
.e-3d7bf54
{
	display: block;
	width: 100%;

	--bento-accent: #e0218a;
	--bento-accent-hover: #c4157a;
}

.e-3d7bf54 > .holder
{
	display: grid;
	grid-template-columns: 1.15fr 1fr 1fr;
	grid-template-rows: repeat(3, 200px);
	grid-template-areas:
		"big top      top"
		"big square-1 square-2"
		"big bottom   bottom";
	gap: 16px;
}

/* ===== SLOTS ===== */

.e-3d7bf54 .slot-big      { grid-area: big; }
.e-3d7bf54 .slot-top      { grid-area: top; }
.e-3d7bf54 .slot-square-1 { grid-area: square-1; }
.e-3d7bf54 .slot-square-2 { grid-area: square-2; }
.e-3d7bf54 .slot-bottom   { grid-area: bottom; }

/* ===== TILE ===== */

.e-3d7bf54 .tile
{
	position: relative;
	display: flex;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	background: var(--ot-bg-3);
	color: white;
	cursor: pointer;
	min-height: 160px;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3d7bf54 .tile:hover
{
	transform: translateY(-3px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.28);
}

/* ===== COVER ===== */

.e-3d7bf54 .tile > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-3d7bf54 .tile > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-3d7bf54 .tile:hover > .cover::before
{
	transform: scale(1.06);
}

.e-3d7bf54 .tile > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(18, 16, 22, 0.05) 0%, rgba(18, 16, 22, 0.35) 52%, rgba(18, 16, 22, 0.88) 100%);
}

/* ===== CTA (corner) ===== */

.e-3d7bf54 .tile > .cta
{
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: var(--bento-accent);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: white;
	box-shadow: 0 6px 16px rgba(224, 33, 138, 0.35);
	transition: background 240ms ease;
}

.e-3d7bf54 .tile:hover > .cta
{
	background: var(--bento-accent-hover);
}

.e-3d7bf54 .tile > .cta > i
{
	font-size: 15px;
}

/* ===== CONTENT ===== */

.e-3d7bf54 .tile > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 8px;
	padding: 22px 24px 24px;
	width: 100%;
}

.e-3d7bf54 .badge
{
	display: inline-flex;
	align-items: center;
	padding: 6px 13px;
	background: var(--bento-accent);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: white;
	box-shadow: 0 6px 16px rgba(224, 33, 138, 0.35);
}

.e-3d7bf54 .eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.88);
	text-transform: uppercase;
	letter-spacing: 0.16em;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}

.e-3d7bf54 .title
{
	margin: 0;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: white;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
}

.e-3d7bf54 .title em
{
	font-style: italic;
	color: var(--bento-accent);
}

.e-3d7bf54 .subtitle
{
	margin: 0;
	max-width: 420px;
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.9);
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===== BIG TILE — krupniji naslov ===== */

.e-3d7bf54 .slot-big .title
{
	font-size: 40px;
	letter-spacing: -0.03em;
}

.e-3d7bf54 .slot-big .subtitle
{
	font-size: 15px;
	max-width: 460px;
}

.e-3d7bf54 .slot-top .title,
.e-3d7bf54 .slot-bottom .title
{
	font-size: 30px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-3d7bf54 > .holder
	{
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 320px 190px 190px 190px;
		grid-template-areas:
			"big      big"
			"top      top"
			"square-1 square-2"
			"bottom   bottom";
		gap: 14px;
	}

	.e-3d7bf54 .slot-big .title
	{
		font-size: 34px;
	}
}

@media (max-width: 600px)
{
	.e-3d7bf54 > .holder
	{
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-auto-rows: 240px;
		grid-template-areas:
			"big"
			"top"
			"square-1"
			"square-2"
			"bottom";
	}

	.e-3d7bf54 .slot-big .title
	{
		font-size: 30px;
	}
}
/* ===== BEGIN: section-bento-categories-1 ===== */

.e-70e7969b
{
	display: block;
	width: 100%;
}

.e-70e7969b > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold dark title) ===== */

.e-70e7969b > .holder > .head
{
	margin-bottom: 28px;
}

.e-70e7969b .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== ROWS (bento — unequal widths, equal height within a row) ===== */

.e-70e7969b .row
{
	display: grid;
	gap: 16px;
}

.e-70e7969b .row-1
{
	grid-template-columns: 1fr 1.6fr 1fr;
}

.e-70e7969b .row-2
{
	grid-template-columns: repeat(4, 1fr);
	margin-top: 16px;
}

.e-70e7969b .row-1 > .card
{
	height: 320px;
}

.e-70e7969b .row-2 > .card
{
	height: 240px;
}

/* ===== CARD (full-cover image, clickable, pill overhangs left) ===== */

.e-70e7969b .card
{
	position: relative;
	display: block;
	overflow: visible;
	text-decoration: none;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-70e7969b .card > .card-image-wrap
{
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
}

.e-70e7969b .card > .card-image-wrap > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-70e7969b .card:hover > .card-image-wrap > .card-image
{
	transform: scale(1.05);
}

/* ===== PILL (white rounded label, blue accent bar, overhangs left edge) ===== */

.e-70e7969b .card > .pill
{
	position: absolute;
	left: -12px;
	bottom: 16px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: calc(100% - 4px);
	padding: 8px 14px 8px 10px;
	border-radius: var(--ot-radius-m);
	background: white;
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.16);
	transition: transform 260ms ease;
}

.e-70e7969b .card:hover > .pill
{
	transform: translateY(-3px);
}

.e-70e7969b .pill > .accent
{
	flex: 0 0 auto;
	width: 4px;
	height: 18px;
	border-radius: 2px;
	background: var(--ot-brand);
}

.e-70e7969b .pill > .pill-name
{
	overflow: hidden;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.2;
	color: var(--ot-text-1);
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* ===== RESPONSIVE — 2 columns on tablet, uniform heights ===== */

@media (max-width: 1024px)
{
	.e-70e7969b .head > .title { font-size: 27px; }

	.e-70e7969b .row-1,
	.e-70e7969b .row-2
	{
		grid-template-columns: 1fr 1fr;
	}

	.e-70e7969b .row-1 > .card,
	.e-70e7969b .row-2 > .card
	{
		height: auto;
		aspect-ratio: 4 / 3;
	}
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-70e7969b > .holder > .head { margin-bottom: 22px; }
	.e-70e7969b .head > .title { font-size: 23px; }

	.e-70e7969b .row-1,
	.e-70e7969b .row-2
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.e-70e7969b .row-2 { margin-top: 14px; }

	.e-70e7969b .card > .pill { left: -8px; }
}

/* ===== END: section-bento-categories-1 ===== */
/* ===== BEGIN: section-blog-1 ===== */

.e-432444
{
	display: block;
	width: 100%;
}

.e-432444 > .holder
{
	width: 100%;
}

/* ===== TITLE (centered, bold, dark grey) ===== */

.e-432444 > .holder > .title
{
	margin: 0 0 32px;
	text-align: center;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (row of 3 equal cards) ===== */

.e-432444 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-432444 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.07);
	overflow: hidden;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-432444 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (clean, full width, top) ===== */

.e-432444 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-432444 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD BODY ===== */

.e-432444 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 10px;
	padding: 20px;
}

.e-432444 .card-title
{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-432444 .card-excerpt
{
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== FOOT (novo + date left, read-more right, bottom aligned) ===== */

.e-432444 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: auto;
	padding-top: 16px;
}

.e-432444 .meta
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-432444 .meta > .badge
{
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ot-text-1);
}

.e-432444 .meta > .date
{
	font-size: 13px;
	color: var(--ot-text-3);
}

/* ===== READ MORE (magenta outline button) ===== */

.e-432444 .read
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: transparent;
	border: 1px solid #e0218a;
	border-radius: var(--ot-radius-m);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #e0218a;
	transition: background 220ms ease, color 220ms ease;
}

.e-432444 .card:hover .read
{
	background: #e0218a;
	color: white;
}

.e-432444 .read > i
{
	font-size: 16px;
	line-height: 1;
}

/* ===== MORE BUTTON (centered, solid magenta) ===== */

.e-432444 .more
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 40px auto 0;
	width: fit-content;
	padding: 14px 32px;
	background: #e0218a;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: white;
	transition: background 220ms ease, transform 220ms ease;
}

.e-432444 .more:hover
{
	background: #c01477;
	transform: translateY(-2px);
}

.e-432444 .more > i
{
	font-size: 20px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-432444 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-432444 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-blog-1 ===== */
/* ===== BEGIN: section-blog-2 ===== */

.e-432445
{
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 56px 40px;
	background: var(--ot-bg-2);
}

.e-432445 > .holder
{
	width: 100%;
}

/* ===== TITLE (centered, bold, dark grey) ===== */

.e-432445 > .holder > .title
{
	margin: 0 0 32px;
	text-align: center;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (row of 3 equal cards) ===== */

.e-432445 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-432445 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.07);
	overflow: hidden;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-432445 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (clean, full width, top) ===== */

.e-432445 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-432445 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD BODY ===== */

.e-432445 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 10px;
	padding: 20px;
}

.e-432445 .card-title
{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-432445 .card-excerpt
{
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== FOOT (novo + date left, read-more right, bottom aligned) ===== */

.e-432445 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: auto;
	padding-top: 16px;
}

.e-432445 .meta
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-432445 .meta > .badge
{
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ot-text-1);
}

.e-432445 .meta > .date
{
	font-size: 13px;
	color: var(--ot-text-3);
}

/* ===== READ MORE (magenta outline button) ===== */

.e-432445 .read
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: transparent;
	border: 1px solid #e0218a;
	border-radius: var(--ot-radius-m);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #e0218a;
	transition: background 220ms ease, color 220ms ease;
}

.e-432445 .card:hover .read
{
	background: #e0218a;
	color: white;
}

.e-432445 .read > i
{
	font-size: 16px;
	line-height: 1;
}

/* ===== MORE BUTTON (centered, solid magenta) ===== */

.e-432445 .more
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 40px auto 0;
	width: fit-content;
	padding: 14px 32px;
	background: #e0218a;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: white;
	transition: background 220ms ease, transform 220ms ease;
}

.e-432445 .more:hover
{
	background: #c01477;
	transform: translateY(-2px);
}

.e-432445 .more > i
{
	font-size: 20px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-432445
	{
		padding: 40px 20px;
	}

	.e-432445 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-432445 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-blog-2 ===== */
/* ===== BEGIN: section-blog-inspiration-1 ===== */

.e-5d27025f
{
	display: block;
	width: 100%;
}

.e-5d27025f > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov CENTRIRAN, sans-serif, tamno plav) ===== */

.e-5d27025f > .holder > .head
{
	margin: 0 0 30px 0;
	text-align: center;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-5d27025f > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #141e5a;
}

/* ===== GRID (tri jednake kolone, jednake visine kartica) ===== */

.e-5d27025f > .holder > .grid
{
	display: grid;
	align-items: stretch;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (bela kartica, cela je jedan link) ===== */

.e-5d27025f > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-5d27025f > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== IMAGE (fiksne proporcije, iste visine u svim karticama) ===== */

.e-5d27025f > .holder > .grid > .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-5d27025f > .holder > .grid > .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== TAGS (plave oznake, dole levo preko slike) ===== */

.e-5d27025f > .holder > .grid > .card > .card-image > .tags
{
	position: absolute;
	bottom: 12px;
	left: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-5d27025f > .holder > .grid > .card > .card-image > .tags > .tag
{
	display: inline-block;
	padding: 5px 10px;
	border-radius: 999px;
	background: #2f6feb;
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	color: #ffffff;
}

/* ===== DATE (datum dole desno preko slike) ===== */

/* Svetla poluprovidna podloga jer je datum preko fotografije inace necitljiv. */

.e-5d27025f > .holder > .grid > .card > .card-image > .date
{
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: inline-block;
	padding: 5px 9px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	color: #24303a;
}

/* ===== BODY (naslov clanka i kratak opis) ===== */

.e-5d27025f > .holder > .grid > .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px 20px 22px 20px;
}

/* min-height od dva reda drzi opise svih kartica u istoj liniji. */

.e-5d27025f > .holder > .grid > .card > .card-body > .card-name
{
	min-height: calc(1.3em * 2);
	font-family: var(--ot-font-primary);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
	color: #24303a;
}

.e-5d27025f > .holder > .grid > .card > .card-body > .card-text
{
	margin-top: 10px;
	font-family: var(--ot-font-primary);
	font-size: 14.5px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== FOOT (plavo dugme centrirano ispod kartica) ===== */

.e-5d27025f > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-5d27025f > .holder > .foot > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 26px;
	border-radius: 8px;
	background: #2f6feb;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	color: #ffffff;
	transition: background 220ms ease;
}

.e-5d27025f > .holder > .foot > .button:hover
{
	background: #2559c4;
}

/* Varijanta "pill" (config buttonVariant): tamnoplava pilula, ista kao dugme ispod mreze ponuda. */
/* Menja se samo ono po cemu se dve varijante razlikuju; slovo, tranzicija i boja teksta ostaju nasledjeni. */

.e-5d27025f > .holder > .foot > .button.is-pill
{
	min-height: 48px;
	padding: 0 34px;
	border-radius: 100px;
	background: #10286b;
	font-weight: 800;
}

.e-5d27025f > .holder > .foot > .button.is-pill:hover
{
	background: #0b1c4d;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5d27025f > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-5d27025f > .holder > .head > .title
	{
		font-size: 30px;
	}
}

@media (max-width: 640px)
{
	.e-5d27025f > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-5d27025f > .holder > .head > .title
	{
		font-size: 26px;
	}

	.e-5d27025f > .holder > .grid > .card > .card-body > .card-name
	{
		font-size: 18px;
	}

	.e-5d27025f > .holder > .foot > .button.is-pill
	{
		width: 100%;
	}
}

/* ===== END: section-blog-inspiration-1 ===== */
/* ===== BEGIN: section-booking-list-1 ===== */

.e-65f80bcc
{
	display: block;
	width: 100%;
	--bl-red: #e4002b;
	--bl-blue: #2f6feb;
	--bl-blue-hover: #2559c7;
	--bl-navy: #16294d;
	--bl-panel: #eaf3fb;
	--bl-orange: #f5901e;
	--bl-dark: #1f2937;
	--bl-grey: #6b7280;
}

.e-65f80bcc > .holder
{
	width: 100%;
}

/* ===== NASLOV (opcioni) ===== */

.e-65f80bcc > .holder > .head
{
	margin-bottom: 24px;
	text-align: left;
}

.e-65f80bcc > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--bl-dark);
}

/* ===== LISTA (kartice pune sirine, jedna ispod druge) ===== */

.e-65f80bcc > .holder > .list
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-65f80bcc > .holder > .list > .card
{
	display: flex;
	align-items: stretch;
	gap: 18px;
	width: 100%;
	padding: 14px;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
	transition: box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card:hover
{
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(16, 24, 40, 0.14);
}

/* ===== LEVA KOLONA (fotografija + kvadratic za poredjenje) ===== */

.e-65f80bcc > .holder > .list > .card > .media
{
	display: flex;
	flex: 0 0 33%;
	flex-direction: column;
	gap: 10px;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo
{
	position: relative;
	flex: 1;
	min-height: 250px;
	border-radius: 10px;
	overflow: hidden;
	background: #eceae6;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .photo-link
{
	position: absolute;
	inset: 0;
	display: block;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .photo-link > .photo-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card:hover > .media > .photo > .photo-link > .photo-image
{
	transform: scale(1.04);
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .photo-link > .photo-shade
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	height: 58%;
	background: linear-gradient(to bottom, rgba(9, 16, 30, 0) 0%, rgba(9, 16, 30, 0.72) 100%);
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	padding: 6px 13px;
	border-radius: 100px;
	background: var(--bl-red);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: #ffffff;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .weather
{
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.92);
	font-size: 12px;
	font-weight: 800;
	color: var(--bl-dark);
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .weather > i
{
	font-size: 16px;
	color: var(--bl-orange);
}

/* ===== OCENA PREKO DNA FOTOGRAFIJE ===== */

.e-65f80bcc > .holder > .list > .card > .media > .photo > .rating
{
	position: absolute;
	bottom: 14px;
	left: 14px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .rating > .rating-box
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 62px;
	min-height: 38px;
	padding: 0 10px;
	border-radius: 6px;
	background: var(--bl-navy);
	font-size: 16px;
	font-weight: 800;
	color: #ffffff;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .rating > .rating-word
{
	font-size: 14px;
	font-weight: 800;
	color: #ffffff;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .rating > .rating-link
{
	font-size: 12px;
	color: #ffffff;
	text-decoration: underline;
	transition: opacity var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .rating > .rating-link:hover
{
	opacity: 0.8;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .dots
{
	position: absolute;
	right: 14px;
	bottom: 16px;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 7px;
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .dots > .dot
{
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.55);
	cursor: pointer;
	transition: width var(--ot-transition), background var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .media > .photo > .dots > .dot.is-on
{
	width: 20px;
	background: #ffffff;
}

/* ===== KVADRATIC ZA POREDJENJE ===== */

.e-65f80bcc > .holder > .list > .card > .media > .compare
{
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 13px;
	color: var(--bl-grey);
	text-align: left;
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .media > .compare:hover
{
	color: var(--bl-dark);
}

.e-65f80bcc > .holder > .list > .card > .media > .compare > .compare-box
{
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border: 1px solid #c3ccd8;
	border-radius: 4px;
	background: #ffffff;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .media > .compare > .compare-box > i
{
	font-size: 15px;
	color: #ffffff;
	opacity: 0;
	transition: opacity var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .media > .compare.is-picked > .compare-box
{
	border-color: var(--bl-blue);
	background: var(--bl-blue);
}

.e-65f80bcc > .holder > .list > .card > .media > .compare.is-picked > .compare-box > i
{
	opacity: 1;
}

/* ===== SREDNJA KOLONA (informacije o hotelu) ===== */

.e-65f80bcc > .holder > .list > .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
	padding: 6px 0;
}

.e-65f80bcc > .holder > .list > .card > .info > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-bottom: 6px;
}

.e-65f80bcc > .holder > .list > .card > .info > .stars > .star
{
	font-size: 15px;
	line-height: 1;
	color: var(--bl-orange);
}

.e-65f80bcc > .holder > .list > .card > .info > .name
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--bl-dark);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .info > .name:hover
{
	color: var(--bl-blue);
}

.e-65f80bcc > .holder > .list > .card > .info > .location
{
	margin-top: 4px;
	font-size: 14px;
	color: var(--bl-grey);
}

.e-65f80bcc > .holder > .list > .card > .info > .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 14px;
}

.e-65f80bcc > .holder > .list > .card > .info > .features > .feature
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--bl-dark);
}

.e-65f80bcc > .holder > .list > .card > .info > .features > .feature > i
{
	font-size: 17px;
	color: #148f5f;
}

/* ===== DESNA KOLONA (plavi panel sa cenom) ===== */

.e-65f80bcc > .holder > .list > .card > .side
{
	display: flex;
	flex: 0 0 300px;
	flex-direction: column;
	align-items: flex-start;
	padding: 18px;
	border-radius: 10px;
	background: var(--bl-panel);
}

.e-65f80bcc > .holder > .list > .card > .side > .meta
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
}

.e-65f80bcc > .holder > .list > .card > .side > .meta > .meta-row
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-65f80bcc > .holder > .list > .card > .side > .meta > .meta-row > .meta-main
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--bl-navy);
}

.e-65f80bcc > .holder > .list > .card > .side > .meta > .meta-row > .meta-main > i
{
	font-size: 18px;
	color: var(--bl-blue);
}

.e-65f80bcc > .holder > .list > .card > .side > .meta > .meta-row > .meta-note
{
	padding-left: 26px;
	font-size: 12px;
	color: var(--bl-grey);
}

.e-65f80bcc > .holder > .list > .card > .side > .spacer
{
	display: block;
	flex: 1 1 auto;
	min-height: 18px;
}

.e-65f80bcc > .holder > .list > .card > .side > .cost
{
	display: flex;
	align-items: baseline;
	gap: 7px;
}

.e-65f80bcc > .holder > .list > .card > .side > .cost > .cost-value
{
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--bl-red);
}

.e-65f80bcc > .holder > .list > .card > .side > .cost > .cost-unit
{
	font-size: 13px;
	color: var(--bl-grey);
}

.e-65f80bcc > .holder > .list > .card > .side > .cost-note
{
	margin-top: 3px;
	font-size: 12px;
	color: var(--bl-grey);
}

.e-65f80bcc > .holder > .list > .card > .side > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin-top: 14px;
	padding: 0 26px;
	border-radius: 100px;
	background: var(--bl-blue);
	font-size: 15px;
	font-weight: 800;
	color: #ffffff;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-65f80bcc > .holder > .list > .card > .side > .cta:hover
{
	background: var(--bl-blue-hover);
}

/* ===== TABLET ===== */

@media (max-width: 1024px)
{
	.e-65f80bcc > .holder > .head > .title
	{
		font-size: 28px;
	}

	.e-65f80bcc > .holder > .list > .card > .media
	{
		flex: 0 0 30%;
	}

	.e-65f80bcc > .holder > .list > .card
	{
		flex-wrap: wrap;
	}

	.e-65f80bcc > .holder > .list > .card > .info
	{
		flex: 1 1 240px;
	}

	.e-65f80bcc > .holder > .list > .card > .side
	{
		flex: 1 1 100%;
	}

	.e-65f80bcc > .holder > .list > .card > .side > .spacer
	{
		min-height: 14px;
	}

	.e-65f80bcc > .holder > .list > .card > .side > .cta
	{
		width: auto;
		align-self: flex-end;
		min-width: 200px;
		margin-top: 12px;
	}
}

/* ===== MOBILNI ===== */

@media (max-width: 640px)
{
	.e-65f80bcc > .holder > .list > .card
	{
		flex-direction: column;
	}

	.e-65f80bcc > .holder > .list > .card > .media
	{
		flex: 0 0 auto;
	}

	.e-65f80bcc > .holder > .list > .card > .media > .photo
	{
		flex: 0 0 auto;
		height: 230px;
		min-height: 0;
	}

	.e-65f80bcc > .holder > .list > .card > .info
	{
		flex: 0 0 auto;
	}

	.e-65f80bcc > .holder > .list > .card > .info > .name
	{
		font-size: 19px;
	}

	.e-65f80bcc > .holder > .list > .card > .side
	{
		flex: 0 0 auto;
	}

	.e-65f80bcc > .holder > .list > .card > .side > .cta
	{
		width: 100%;
		align-self: stretch;
	}
}

/* ===== END: section-booking-list-1 ===== */
.e-dbedf5f
{
	display: block;
	width: 100%;
}

.e-dbedf5f > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 2), 1fr);
	gap: 22px;
}

/* ===== BOX ===== */

.e-dbedf5f .box
{
	position: relative;
	display: flex;
	align-items: flex-start;
	overflow: hidden;
	min-height: 270px;
	padding: 32px 34px;
	border-radius: var(--ot-radius-l);
	color: white;
	cursor: pointer;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-dbedf5f .box:hover
{
	transform: translateY(-3px);
}

/* ===== TONE (puna boja) ===== */

.e-dbedf5f .tone-brand { background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%); }
.e-dbedf5f .tone-gold  { background: linear-gradient(135deg, rgba(235, 170, 50, 1) 0%, rgba(205, 140, 30, 1) 100%); }
.e-dbedf5f .tone-green { background: linear-gradient(135deg, rgba(120, 175, 50, 1) 0%, rgba(95, 150, 35, 1) 100%); }
.e-dbedf5f .tone-blue  { background: linear-gradient(135deg, rgba(40, 130, 215, 1) 0%, rgba(25, 100, 185, 1) 100%); }
.e-dbedf5f .tone-dark  { background: linear-gradient(135deg, rgba(40, 40, 44, 1) 0%, rgba(20, 20, 22, 1) 100%); }

/* ===== TEKST ===== */

.e-dbedf5f .text
{
	position: relative;
	z-index: 2;
	max-width: 56%;
}

.e-dbedf5f .title
{
	font-family: var(--ot-font-secondary);
	font-size: 30px;
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.08;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-dbedf5f .title em
{
	font-style: italic;
}

.e-dbedf5f .subtitle
{
	font-size: 14px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.9);
	margin: 8px 0 0;
}

/* ===== KRUŽNA SLIKA (desno, izlazi delom) ===== */

/* Krug veći od visine kartice i vertikalno centriran — pokriva ceo desni
   kraj, bez rupa u gornjem i donjem desnom ćošku. */

.e-dbedf5f .circle
{
	position: absolute;
	right: -120px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
	width: 400px;
	height: 400px;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.12);
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-dbedf5f .box:hover .circle
{
	transform: translateY(-50%) scale(1.04);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-dbedf5f > .holder
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}
}

@media (max-width: 600px)
{
	.e-dbedf5f .box
	{
		min-height: 200px;
		padding: 26px 28px;
	}

	.e-dbedf5f .title
	{
		font-size: 25px;
	}

	.e-dbedf5f .text
	{
		max-width: 60%;
	}

	.e-dbedf5f .circle
	{
		width: 260px;
		height: 260px;
		right: -80px;
	}
}
/* ===== BEGIN: section-brand-cards-1 ===== */

.e-145a3ec3
{
	display: block;
	width: 100%;
	--brand-dark: #24303a;
	--brand-grey: #6b7280;
	--brand-dot: #b4b8c0;
	--brand-orange: #f5901e;
	--brand-orange-hover: #dd8016;
}

.e-145a3ec3 > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamni sans naslov) ===== */

.e-145a3ec3 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-145a3ec3 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--brand-dark);
}

/* ===== GRID (tri kartice jednake sirine i visine) ===== */

.e-145a3ec3 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 24px;
}

/* ===== KARTICA (bela, zaobljena, jednake visine) ===== */

.e-145a3ec3 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-145a3ec3 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== MEDIA (slika na vrhu + obojena logo plocica) ===== */

.e-145a3ec3 .card > .card-media
{
	position: relative;
	display: block;
	height: 210px;
	overflow: hidden;
}

.e-145a3ec3 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-145a3ec3 .card:hover .card-image
{
	transform: scale(1.06);
}

.e-145a3ec3 .card-media > .card-plate
{
	position: absolute;
	top: 16px;
	left: 16px;
	display: flex;
	flex-direction: column;
	gap: 1px;
	max-width: calc(100% - 32px);
	padding: 7px 12px;
	border-radius: 4px;
	box-shadow: 0 6px 14px rgba(20, 18, 16, 0.22);
	color: #ffffff;
}

.e-145a3ec3 .card-plate > .plate-top
{
	display: flex;
	align-items: center;
	gap: 5px;
}

.e-145a3ec3 .plate-top > .plate-brand
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-145a3ec3 .plate-top > .plate-icon
{
	font-size: 16px;
	flex-shrink: 0;
}

.e-145a3ec3 .card-plate > .plate-sub
{
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-transform: uppercase;
	opacity: 0.92;
}

/* ===== TELO KARTICE (naslov, opis, prednosti, spacer, dugme na dnu) ===== */

.e-145a3ec3 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 20px;
}

.e-145a3ec3 .card-body > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.28;
	color: var(--brand-dark);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-145a3ec3 .card:hover .card-title
{
	color: var(--brand-orange);
}

.e-145a3ec3 .card-body > .card-desc
{
	margin-top: 10px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.55;
	color: var(--brand-grey);
}

/* ===== PREDNOSTI (sive tackice) ===== */

.e-145a3ec3 .card-body > .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 16px;
	width: 100%;
}

.e-145a3ec3 .features > .feature
{
	position: relative;
	padding-left: 16px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--brand-grey);
}

.e-145a3ec3 .features > .feature::before
{
	content: '';
	position: absolute;
	top: 8px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--brand-dot);
}

/* Prostor iznad dugmeta se rasteze da sva tri dugmeta stoje u istoj liniji. */

.e-145a3ec3 .card-body > .spacer
{
	flex: 1;
	min-height: 20px;
}

.e-145a3ec3 .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 12px 20px;
	border: 1.5px solid var(--brand-orange);
	border-radius: 100px;
	background: transparent;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--brand-orange);
	text-decoration: none;
	transition: background var(--ot-transition), color var(--ot-transition), border-color var(--ot-transition);
}

.e-145a3ec3 .card-body > .card-button:hover
{
	border-color: var(--brand-orange-hover);
	background: var(--brand-orange-hover);
	color: #ffffff;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

@media (max-width: 1024px)
{
	.e-145a3ec3 .head > .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-145a3ec3 .head > .title
	{
		font-size: 24px;
	}

	.e-145a3ec3 .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-145a3ec3 .card > .card-media
	{
		height: 190px;
	}

	.e-145a3ec3 .card-body > .card-title
	{
		font-size: 19px;
	}
}

/* ===== END: section-brand-cards-1 ===== */
/* ===== BEGIN: section-budget-cards-1 ===== */

.e-4166f0c3
{
	display: block;
	width: 100%;
	--budget-navy: #10285c;
	--budget-yellow: #f5c518;
	--budget-yellow-hover: #dcb015;
}

.e-4166f0c3 > .holder
{
	width: 100%;
}

/* ===== HEADER (veliki serif tamno plavi naslov, levo poravnat) ===== */

.e-4166f0c3 > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

.e-4166f0c3 .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 40px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--budget-navy);
}

/* ===== GRID (4 kartice jednake sirine i visine) ===== */

.e-4166f0c3 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: stretch;
	gap: 22px;
}

/* ===== CARD (slika gore spojena sa tamno plavim blokom) ===== */

.e-4166f0c3 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: var(--budget-navy);
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-4166f0c3 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(16, 40, 92, 0.22);
}

.e-4166f0c3 .card-media
{
	display: block;
	width: 100%;
	height: 200px;
	overflow: hidden;
}

.e-4166f0c3 .card-image
{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(16, 40, 92, 0.2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-4166f0c3 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (tamno plavi blok, dugme poravnato na dno desno) ===== */

.e-4166f0c3 .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 10px;
	padding: 22px 22px 22px;
}

.e-4166f0c3 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.25;
	color: #ffffff;
}

.e-4166f0c3 .card-text
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.78);
}

/* Prostor iznad dugmeta se rasteze da kartice budu jednake visine. */

.e-4166f0c3 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 18px;
}

.e-4166f0c3 .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	flex-shrink: 0;
	border-radius: 8px;
	background: var(--budget-yellow);
	color: var(--budget-navy);
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-4166f0c3 .card-button > i
{
	font-size: 24px;
}

.e-4166f0c3 .card:hover .card-button
{
	background: var(--budget-yellow-hover);
	transform: translateX(3px);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 1024px)
{
	.e-4166f0c3 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-4166f0c3 .title
	{
		font-size: 32px;
	}
}

@media (max-width: 640px)
{
	.e-4166f0c3 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-4166f0c3 .title
	{
		font-size: 27px;
	}

	.e-4166f0c3 .card-media
	{
		height: 180px;
	}
}

/* ===== END: section-budget-cards-1 ===== */
/* ===== BEGIN: section-budget-overlay-1 ===== */

.e-5d28ff6a
{
	display: block;
	width: 100%;
	--bo-navy: #16294D;
	--bo-plate: rgba(31, 58, 107, 0.92);
	--bo-yellow: #ffd400;
	--bo-yellow-hover: #e8c000;
	--bo-ratio: 2 / 3;
}

.e-5d28ff6a > .holder
{
	width: 100%;
}

/* ===== HEADER (veliki serifni tamno plavi naslov, levo poravnat) ===== */

.e-5d28ff6a > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

.e-5d28ff6a .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 40px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--bo-navy);
}

/* ===== GRID (4 uspravne kartice jednake sirine i visine) ===== */

.e-5d28ff6a .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: stretch;
	gap: 22px;
}

/* ===== CARD (cela slika, plavi blok lebdi preko dna) ===== */

.e-5d28ff6a .card
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: var(--bo-ratio);
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5d28ff6a .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(22, 41, 77, 0.24);
}

.e-5d28ff6a .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(22, 41, 77, 0.2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-5d28ff6a .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== PLAVI BLOK (poluprovidan, prikovan uz dno kartice) ===== */

.e-5d28ff6a .card-body
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-height: 140px;
	padding: 16px;
	background: var(--bo-plate);
}

.e-5d28ff6a .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

/* Opis je ogranicen na tri reda da svi plavi blokovi ostanu iste visine. */

.e-5d28ff6a .card-text
{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.82);
}

/* Prostor iznad dugmeta se rasteze pa strelica uvek sedi u donjem desnom uglu. */

.e-5d28ff6a .card-foot
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 12px;
}

.e-5d28ff6a .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 6px;
	background: var(--bo-yellow);
	color: var(--bo-navy);
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-5d28ff6a .card-button > i
{
	font-size: 24px;
}

.e-5d28ff6a .card:hover .card-button
{
	background: var(--bo-yellow-hover);
	transform: translateX(3px);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 1024px)
{
	.e-5d28ff6a
	{
		--bo-ratio: 4 / 5;
	}

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

	.e-5d28ff6a .title
	{
		font-size: 32px;
	}
}

@media (max-width: 640px)
{
	.e-5d28ff6a
	{
		--bo-ratio: 3 / 4;
	}

	.e-5d28ff6a .grid
	{
		grid-template-columns: 1fr;
	}

	.e-5d28ff6a .title
	{
		font-size: 27px;
	}
}

/* ===== END: section-budget-overlay-1 ===== */
/* ===== BEGIN: section-budget-tiers-1 ===== */

.e-4ed8ef2b
{
	display: block;
	width: 100%;
	--budget-cream: #f8f4ef;
	--budget-dark: #24303a;
	--budget-coral: #fb5a56;
	--budget-petrol: #3e7c7b;
	--budget-orange: #f6a950;
}

.e-4ed8ef2b > .holder
{
	width: 100%;
	padding: 44px 40px;
	border-radius: 24px;
	background: var(--budget-cream);
}

/* ===== HEADER (levo poravnat krupan tamni sans-serif naslov) ===== */

.e-4ed8ef2b > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Sites app globalno postavlja serif na sve h1-h6, pa se sans-serif mora eksplicitno vratiti. */

.e-4ed8ef2b .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--budget-dark);
}

/* ===== GRID (jedan red: tri kartice jednake sirine) ===== */

.e-4ed8ef2b .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
	align-items: stretch;
}

/* ===== CARD (oznaka gore, cena u sredini, dugme na dnu) ===== */

.e-4ed8ef2b .card
{
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	padding: 34px 28px;
	border-radius: 12px;
	text-align: center;
	text-decoration: none;
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-4ed8ef2b .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(36, 48, 58, 0.18);
}

.e-4ed8ef2b .card-label
{
	font-size: 12px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Cena u sredini upija razliku u visini pa dugmad ostaju u istoj liniji. */

.e-4ed8ef2b .card-price
{
	margin-top: auto;
	margin-bottom: auto;
	padding: 30px 0;
	font-family: var(--ot-font-secondary);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
}

.e-4ed8ef2b .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	border-radius: 999px;
	border-style: solid;
	border-width: 1.5px;
	background: transparent;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	transition: background var(--ot-transition), color var(--ot-transition);
}

/* ===== TONE CORAL (bela tipografija i beo obrub) ===== */

.e-4ed8ef2b .card.tone-coral
{
	background: var(--budget-coral);
	color: #ffffff;
}

.e-4ed8ef2b .card.tone-coral .card-button
{
	border-color: #ffffff;
	color: #ffffff;
}

.e-4ed8ef2b .card.tone-coral:hover .card-button
{
	background: #ffffff;
	color: var(--budget-coral);
}

/* ===== TONE PETROL (bela tipografija i beo obrub) ===== */

.e-4ed8ef2b .card.tone-petrol
{
	background: var(--budget-petrol);
	color: #ffffff;
}

.e-4ed8ef2b .card.tone-petrol .card-button
{
	border-color: #ffffff;
	color: #ffffff;
}

.e-4ed8ef2b .card.tone-petrol:hover .card-button
{
	background: #ffffff;
	color: var(--budget-petrol);
}

/* ===== TONE ORANGE (svetlija pozadina, pa tamna tipografija i taman obrub) ===== */

.e-4ed8ef2b .card.tone-orange
{
	background: var(--budget-orange);
	color: var(--budget-dark);
}

.e-4ed8ef2b .card.tone-orange .card-button
{
	border-color: var(--budget-dark);
	color: var(--budget-dark);
}

.e-4ed8ef2b .card.tone-orange:hover .card-button
{
	background: var(--budget-dark);
	color: var(--budget-orange);
}

/* ===== RESPONSIVE (tablet i mobilni: jedna kolona pune sirine) ===== */

@media (max-width: 1024px)
{
	.e-4ed8ef2b .grid
	{
		grid-template-columns: 1fr;
	}

	.e-4ed8ef2b .title
	{
		font-size: 30px;
	}
}

@media (max-width: 560px)
{
	.e-4ed8ef2b > .holder
	{
		padding: 26px 18px;
	}

	.e-4ed8ef2b .card
	{
		padding: 28px 22px;
	}

	.e-4ed8ef2b .card-price
	{
		padding: 24px 0;
		font-size: 26px;
	}
}

/* ===== END: section-budget-tiers-1 ===== */
/* ===== BEGIN: section-card-deals-1 ===== */

.e-12d22754
{
	display: block;
	width: 100%;
}

.e-12d22754 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (centered title) ===== */

.e-12d22754 > .holder > .head
{
	display: flex;
	justify-content: center;
	text-align: center;
	margin-bottom: 28px;
}

.e-12d22754 .head > .title
{
	margin: 0;
	font-size: 34px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== VIEWPORT + TRACK ===== */

.e-12d22754 .viewport
{
	position: relative;
}

.e-12d22754 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL ===== */

.e-12d22754 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 12px 10px;
	box-sizing: border-box;
}

/* ===== CARD ===== */

.e-12d22754 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.07);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-12d22754 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE ===== */

.e-12d22754 .card > .card-image
{
	position: relative;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== RATING BADGE (top-left) ===== */

.e-12d22754 .card-image > .rating
{
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: stretch;
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.18);
}

.e-12d22754 .rating > .rating-score
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	padding: 6px 8px;
	font-size: 14px;
	font-weight: 800;
	color: white;
}

.e-12d22754 .rating > .rating-label
{
	display: inline-flex;
	align-items: center;
	padding: 6px 10px;
	background: white;
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
}

/* ===== HEART (top-right) ===== */

.e-12d22754 .card-image > .heart
{
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	background: white;
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-3);
	cursor: pointer;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.18);
	transition: color 220ms ease, transform 220ms ease;
}

.e-12d22754 .card-image > .heart:hover
{
	transform: scale(1.08);
}

.e-12d22754 .card-image > .heart > i
{
	font-size: 20px;
}

.e-12d22754 .card-image > .heart.active
{
	color: var(--ot-red);
}

.e-12d22754 .card-image > .heart.active > i
{
	font-variation-settings: 'FILL' 1;
}

/* ===== CARD BODY ===== */

.e-12d22754 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1 1 auto;
	padding: 16px 16px 18px;
}

/* ===== NAME + STARS ===== */

.e-12d22754 .card-body > .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.e-12d22754 .name-row > .hotel-name
{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-12d22754 .name-row > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	flex: 0 0 auto;
	margin-top: 2px;
	color: #f5b301;
}

.e-12d22754 .name-row > .stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

/* ===== LOCATION ===== */

.e-12d22754 .card-body > .location
{
	font-size: 12px;
	line-height: 1.4;
	color: var(--ot-text-3);
}

/* ===== DIVIDER ===== */

.e-12d22754 .card-body > .divider
{
	height: 1px;
	background: var(--ot-bg-3-border);
}

/* ===== TRIP ROW (date + departure) ===== */

.e-12d22754 .card-body > .trip-row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.e-12d22754 .trip-row > .trip-date
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-12d22754 .trip-row > .trip-from
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-12d22754 .trip-row > .trip-from > i
{
	font-size: 16px;
	color: var(--ot-text-3);
}

/* ===== DISCOUNT PILL ===== */

.e-12d22754 .card-body > .discount
{
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	padding: 4px 10px;
	background: #e0218a;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	color: white;
}

/* ===== PRICE ROW (pinned to bottom) ===== */

.e-12d22754 .card-body > .price-row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: auto;
	padding-top: 6px;
}

.e-12d22754 .price-row > .price-main
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-12d22754 .price-main > .price-label
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-12d22754 .price-main > .price-value
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1.05;
	color: var(--ot-red);
}

.e-12d22754 .price-row > .show-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	padding: 10px 20px;
	background: #f5c518;
	border-radius: var(--ot-radius-m);
	font-size: 14px;
	font-weight: 700;
	color: #1a1a1a;
	text-decoration: none;
	transition: background 220ms ease;
}

.e-12d22754 .price-row > .show-button:hover
{
	background: #e0b30f;
}

/* ===== ARROWS ===== */

.e-12d22754 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: var(--ot-brand);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.16);
	transition: background 240ms ease, color 240ms ease;
}

.e-12d22754 .arrow:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-12d22754 .arrow-prev { left: -20px; }
.e-12d22754 .arrow-next { right: -20px; }

/* ===== CTA BUTTON ===== */

.e-12d22754 .cta-wrap
{
	display: flex;
	justify-content: center;
	margin-top: 32px;
}

.e-12d22754 .cta-wrap > .cta-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 34px;
	background: #0a3d7a;
	border-radius: var(--ot-radius-m);
	font-size: 16px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 240ms ease;
}

.e-12d22754 .cta-wrap > .cta-button:hover
{
	background: #072c58;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-12d22754 .head > .title { font-size: 28px; }
	.e-12d22754 .arrow-prev { left: -8px; }
	.e-12d22754 .arrow-next { right: -8px; }
}

@media (max-width: 640px)
{
	.e-12d22754 .head > .title { font-size: 24px; }
	.e-12d22754 .arrow { width: 40px; height: 40px; }
	.e-12d22754 .arrow-prev { left: 4px; }
	.e-12d22754 .arrow-next { right: 4px; }
}

/* ===== END: section-card-deals-1 ===== */
/* ===== BEGIN: section-cards-1 ===== */

.e-2a6c4089
{
	display: block;
	width: 100%;
}

.e-2a6c4089 > .holder
{
	width: 100%;
}

/* ===== TABS (thin top line, minimalist text tabs) ===== */

.e-2a6c4089 > .holder > .tabs
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 28px;
	padding-top: 16px;
	border-top: 1px solid var(--ot-bg-3);
}

.e-2a6c4089 .tabs > .tab
{
	flex: 0 1 auto;
	padding: 6px 4px;
	background: none;
	border: none;
	font-size: 15px;
	font-weight: 500;
	color: var(--ot-text-2);
	white-space: nowrap;
	cursor: pointer;
	transition: color 200ms ease;
}

.e-2a6c4089 .tabs > .tab:hover
{
	color: var(--ot-text-1);
}

.e-2a6c4089 .tabs > .tab.active
{
	font-weight: 700;
	color: var(--ot-text-1);
}

/* ===== GRID (3 columns) ===== */

.e-2a6c4089 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== PROMO BANNER (first cell) ===== */

.e-2a6c4089 .promo
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	text-decoration: none;
}

.e-2a6c4089 .promo > .promo-image
{
	display: block;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l);
}

.e-2a6c4089 .promo > .promo-title
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== OFFER CARD ===== */

.e-2a6c4089 .card
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	text-decoration: none;
}

.e-2a6c4089 .card > .card-image
{
	display: block;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
}

.e-2a6c4089 .card .card-photo
{
	display: block;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-2a6c4089 .card:hover .card-photo
{
	transform: scale(1.05);
}

.e-2a6c4089 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-2a6c4089 .destination
{
	font-size: 18px;
	font-weight: 600;
	color: var(--ot-text-2);
}

/* ===== PRICE ROW (days + već od | price | button) ===== */

.e-2a6c4089 .price-row
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}

.e-2a6c4089 .price-when
{
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.e-2a6c4089 .price-when > .days
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-2);
}

.e-2a6c4089 .price-when > .from
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-brand);
}

.e-2a6c4089 .price
{
	font-size: 22px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.e-2a6c4089 .offer-button
{
	margin-left: auto;
	padding: 9px 16px;
	background: var(--ot-orange);
	border-radius: var(--ot-radius-m);
	font-size: 14px;
	font-weight: 600;
	color: white;
	white-space: nowrap;
	transition: background 200ms ease;
}

.e-2a6c4089 .card:hover .offer-button
{
	background: var(--ot-orange-hover);
}

/* ===== MORE LINK (centered, chevron below) ===== */

.e-2a6c4089 .more-wrap
{
	display: flex;
	justify-content: center;
	margin-top: 32px;
}

.e-2a6c4089 .more
{
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 0;
	background: none;
	border: none;
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-2);
	text-decoration: none;
	cursor: pointer;
	transition: color 200ms ease;
}

.e-2a6c4089 .more:hover
{
	color: var(--ot-text-1);
}

.e-2a6c4089 .more > .more-chevron
{
	font-size: 22px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-2a6c4089 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-2a6c4089 > .holder > .tabs
	{
		justify-content: flex-start;
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.e-2a6c4089 .offer-button
	{
		margin-left: 0;
	}
}

/* ===== END: section-cards-1 ===== */
.e-4f8a6dbe
{
	display: block;
	width: 100%;
}

.e-4f8a6dbe > .wrap
{
	position: relative;
	width: 100%;
}

.e-4f8a6dbe .holder.layout-grid
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	grid-auto-rows: var(--rows, 240px);
	gap: 18px;
}

/* ===== SLIDER (jedan red, listanje levo-desno) ===== */

.e-4f8a6dbe .holder.layout-slider
{
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 3 * 18px) / 4);
	grid-auto-rows: var(--rows, 240px);
	gap: 18px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.e-4f8a6dbe .holder.layout-slider::-webkit-scrollbar
{
	display: none;
}

.e-4f8a6dbe .holder.layout-slider > .tile
{
	scroll-snap-align: start;
	grid-column: auto !important;
	grid-row: auto !important;
}

/* ===== NAV STRELICE ===== */

.e-4f8a6dbe .nav
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms, transform 240ms, opacity 240ms;
}

.e-4f8a6dbe .nav-prev { left: -12px; transform: translateY(-50%); }
.e-4f8a6dbe .nav-next { right: -12px; transform: translateY(-50%); }

.e-4f8a6dbe .nav:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-4f8a6dbe .nav-prev:hover { transform: translateY(-50%) scale(1.04); }
.e-4f8a6dbe .nav-next:hover { transform: translateY(-50%) scale(1.04); }

.e-4f8a6dbe .nav.disabled
{
	opacity: 0;
	pointer-events: none;
}

.e-4f8a6dbe .nav > i
{
	font-size: 20px;
}

/* ===== TILE ===== */

.e-4f8a6dbe .tile
{
	position: relative;
	display: flex;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	background: var(--ot-bg-3);
	color: white;
	cursor: pointer;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
	min-height: var(--rows, 240px);
}

.e-4f8a6dbe .tile:hover
{
	transform: translateY(-3px);
}

/* ===== COVER ===== */

.e-4f8a6dbe .tile > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	overflow: hidden;
}

.e-4f8a6dbe .tile > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1);
	transition: transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-4f8a6dbe .tile:hover > .cover::before
{
	transform: scale(1.05);
}

.e-4f8a6dbe .tile > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-4f8a6dbe .cover-overlay.tone-dark
{
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.05) 0%, rgba(20, 18, 16, 0.35) 55%, rgba(20, 18, 16, 0.85) 100%);
}

.e-4f8a6dbe .cover-overlay.tone-light
{
	background: linear-gradient(180deg, rgba(255, 254, 252, 0.0) 0%, rgba(255, 254, 252, 0.6) 65%, rgba(255, 254, 252, 0.94) 100%);
}

.e-4f8a6dbe .cover-overlay.tone-brand
{
	background: linear-gradient(180deg, color-mix(in srgb, var(--ot-brand) 40%, transparent) 0%, color-mix(in srgb, var(--ot-brand) 85%, transparent) 100%);
}

.e-4f8a6dbe .cover-overlay.tone-gold
{
	background: linear-gradient(180deg, rgba(170, 130, 60, 0.45) 0%, rgba(170, 130, 60, 0.85) 100%);
}

/* Flat background (no image) */

.e-4f8a6dbe .flat-bg
{
	position: absolute;
	inset: 0;
}

.e-4f8a6dbe .flat-bg.tone-dark   { background: var(--ot-text-1); }
.e-4f8a6dbe .flat-bg.tone-light  { background: var(--ot-bg-2); }
.e-4f8a6dbe .flat-bg.tone-brand  { background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%); }
.e-4f8a6dbe .flat-bg.tone-gold   { background: linear-gradient(135deg, rgba(170, 130, 60, 1) 0%, rgba(120, 90, 40, 1) 100%); }

/* ===== CONTENT ===== */

.e-4f8a6dbe .tile > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 24px 26px 26px;
	width: 100%;
	margin-top: auto;
}

.e-4f8a6dbe .content-top
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.e-4f8a6dbe .meta
{
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	background: rgba(255, 254, 252, 0.96);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-4f8a6dbe .eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 254, 252, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.e-4f8a6dbe .tile > .content > .title
{
	font-family: var(--ot-font-secondary);
	font-size: 28px;
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-4f8a6dbe .tile > .content > .title em
{
	font-style: italic;
}

.e-4f8a6dbe .tile > .content > .description
{
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 254, 252, 0.85);
	margin: 0;
	max-width: 360px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-4f8a6dbe .tile > .content > .cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-4f8a6dbe .tile > .content > .cta > i
{
	font-size: 16px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-4f8a6dbe .tile:hover > .content > .cta > i
{
	transform: translateX(4px);
}

/* ===== TONE-LIGHT TILE TEXT ===== */

.e-4f8a6dbe .tile:has(.tone-light) > .content > .title,
.e-4f8a6dbe .tile:has(.tone-light) > .content > .cta
{
	color: var(--ot-text-1);
}

.e-4f8a6dbe .tile:has(.tone-light) > .content > .description
{
	color: var(--ot-text-2);
}

.e-4f8a6dbe .tile:has(.tone-light) > .content > .content-top > .eyebrow
{
	color: var(--ot-brand);
}

/* ===== LARGER TILES (span 2 / wide / tall) ===== */

.e-4f8a6dbe .tile[style*="span 2"] .title,
.e-4f8a6dbe .tile[style*="row: span 2"] .title
{
	font-size: 38px;
	letter-spacing: -0.025em;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-4f8a6dbe .holder.layout-grid
	{
		grid-template-columns: repeat(2, 1fr);
		grid-auto-rows: var(--rows, 220px);
	}

	.e-4f8a6dbe .holder.layout-slider
	{
		grid-auto-columns: calc((100% - 2 * 18px) / 3);
	}
}

@media (max-width: 900px)
{
	.e-4f8a6dbe .holder.layout-slider
	{
		grid-auto-columns: calc((100% - 18px) / 2);
	}

	.e-4f8a6dbe .nav
	{
		display: none;
	}
}

@media (max-width: 600px)
{
	.e-4f8a6dbe .holder.layout-grid
	{
		grid-template-columns: 1fr;
	}

	.e-4f8a6dbe .holder.layout-grid .tile[style*="span 2"]
	{
		grid-column: auto !important;
	}

	.e-4f8a6dbe .holder.layout-grid .tile[style*="row: span 2"]
	{
		grid-row: auto !important;
	}

	.e-4f8a6dbe .holder.layout-slider
	{
		grid-auto-columns: 78%;
	}

	.e-4f8a6dbe .tile > .content > .title
	{
		font-size: 24px;
	}
}
/* ===== BEGIN: section-category-carousel-1 ===== */

.e-2501df8b
{
	display: block;
	width: 100%;
}

.e-2501df8b > .holder
{
	width: 100%;
	outline: none;
}

/* ===== SECTION HEAD (krupan bold tamno ljubičast naslov, gore levo) ===== */

.e-2501df8b .section-head
{
	margin: 0 0 24px;
	padding: 0 8px;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: #3b1f5c;
}

/* ===== STAGE ===== */

.e-2501df8b .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-2501df8b .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
	margin: 0 -8px;
}

.e-2501df8b .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (jednake širine i visine) ===== */

.e-2501df8b .cell
{
	flex: 0 0 calc(100% / var(--per-view, 5.4));
	max-width: calc(100% / var(--per-view, 5.4));
	padding: 0 8px;
	box-sizing: border-box;
}

.e-2501df8b .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	border-radius: 10px;
	overflow: hidden;
	background: #ffffff;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-2501df8b .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(59, 31, 92, 0.16);
}

/* ===== CARD IMAGE (puna širina, zaobljena gornja dva ugla, iste visine) ===== */

.e-2501df8b .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: #e7dff0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 10px 10px 0 0;
}

/* ===== LILA TRAKA (ista visina za naziv u jednom ili dva reda) ===== */

.e-2501df8b .card > .card-strip
{
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 78px;
	padding: 14px 14px 14px 16px;
	background: #f3edf7;
	box-sizing: border-box;
}

.e-2501df8b .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	flex: 1;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -0.005em;
	color: #3b1f5c;
}

.e-2501df8b .card-chev
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	color: #7b1fa2;
	transition: transform 240ms ease;
}

.e-2501df8b .card-chev > i
{
	font-size: 28px;
}

.e-2501df8b .card:hover .card-chev
{
	transform: translateX(3px);
}

/* ===== ARROWS (kružne, lebde preko ivica reda) ===== */

.e-2501df8b .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #ffffff;
	border: 1px solid #e7dff0;
	border-radius: 50%;
	color: #3b1f5c;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 8px 22px rgba(59, 31, 92, 0.16);
	transition: background 240ms ease, transform 240ms ease, color 240ms ease;
}

.e-2501df8b .arrow-prev
{
	left: 12px;
}

.e-2501df8b .arrow-next
{
	right: 12px;
}

.e-2501df8b .arrow:hover
{
	background: #7b1fa2;
	color: #ffffff;
	transform: translateY(-50%) scale(1.06);
}

.e-2501df8b .arrow.is-off
{
	opacity: 0.35;
	cursor: default;
}

.e-2501df8b .arrow.is-off:hover
{
	background: #ffffff;
	color: #3b1f5c;
	transform: translateY(-50%);
}

.e-2501df8b .arrow > i
{
	font-size: 22px;
}

/* ===== TANKA TRAKA (indikator pozicije listanja) ===== */

.e-2501df8b .bar
{
	position: relative;
	width: 100%;
	height: 4px;
	margin: 26px 0 0;
	background: #e7dff0;
	border-radius: 100px;
	overflow: hidden;
}

.e-2501df8b .bar > .bar-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #7b1fa2;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2501df8b .section-head { font-size: 28px; }
	.e-2501df8b .card-name { font-size: 17px; }
	.e-2501df8b .card > .card-strip { min-height: 74px; }
}

@media (max-width: 640px)
{
	.e-2501df8b .section-head { font-size: 24px; }
	.e-2501df8b .viewport { margin: 0 -6px; }
	.e-2501df8b .cell { padding: 0 6px; }
	.e-2501df8b .arrow { width: 40px; height: 40px; }
	.e-2501df8b .arrow-prev { left: 8px; }
	.e-2501df8b .arrow-next { right: 8px; }
}

/* ===== END: section-category-carousel-1 ===== */
/* ===== BEGIN: section-category-slider-1 ===== */

.e-5ab203f6
{
	display: block;
	width: 100%;
}

.e-5ab203f6 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (optional centered serif heading) ===== */

.e-5ab203f6 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-5ab203f6 .head > .title
{
	margin: 0;
	max-width: 680px;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== STAGE + VIEWPORT + TRACK ===== */

.e-5ab203f6 .stage
{
	position: relative;
}

.e-5ab203f6 .viewport
{
	overflow: hidden;
	padding: 30px 8px 24px;
}

.e-5ab203f6 .track
{
	display: flex;
	will-change: transform;
}

/* ===== CELL + CARD (tall portrait, staggered heights) ===== */

.e-5ab203f6 .cell
{
	flex: 0 0 calc(100% / 5.5);
	max-width: calc(100% / 5.5);
	padding: 0 8px;
	box-sizing: border-box;
}

.e-5ab203f6 .cell:nth-child(3n + 1) { margin-top: 0; }
.e-5ab203f6 .cell:nth-child(3n + 2) { margin-top: 28px; }
.e-5ab203f6 .cell:nth-child(3n)     { margin-top: 14px; }

.e-5ab203f6 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.4;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.22);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5ab203f6 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-5ab203f6 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1), filter 320ms ease;
}

.e-5ab203f6 .card:hover > .card-image
{
	transform: scale(1.06);
	filter: brightness(1.06);
}

/* ===== DARK BOTTOM GRADIENT (readability) ===== */

.e-5ab203f6 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(10, 10, 12, 0.78) 0%, rgba(10, 10, 12, 0.30) 32%, rgba(10, 10, 12, 0) 55%);
}

/* ===== CARD BODY (only a serif white name at the bottom) ===== */

.e-5ab203f6 .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	padding: 20px 20px 22px;
}

.e-5ab203f6 .card-title
{
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.15;
	letter-spacing: 0.005em;
	color: white;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}

/* ===== ROUND ARROWS (overlaid on the edges) ===== */

.e-5ab203f6 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: rgba(28, 31, 38, 0.92);
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.28);
	transition: background 240ms ease, transform 240ms ease;
}

.e-5ab203f6 .arrow:hover
{
	background: black;
	transform: translateY(-50%) scale(1.06);
}

.e-5ab203f6 .arrow-prev { left: 10px; }
.e-5ab203f6 .arrow-next { right: 10px; }

.e-5ab203f6 .arrow > i
{
	font-size: 22px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5ab203f6 .head > .title { font-size: 25px; }

	.e-5ab203f6 .cell
	{
		flex: 0 0 calc(100% / 3.4);
		max-width: calc(100% / 3.4);
	}

	.e-5ab203f6 .card-title { font-size: 22px; }
}

@media (max-width: 640px)
{
	.e-5ab203f6 > .holder > .head { margin-bottom: 24px; }
	.e-5ab203f6 .head > .title { font-size: 22px; }
	.e-5ab203f6 .viewport { padding: 16px 6px 18px; }

	.e-5ab203f6 .cell
	{
		flex: 0 0 calc(100% / 1.6);
		max-width: calc(100% / 1.6);
	}

	.e-5ab203f6 .cell:nth-child(3n + 1),
	.e-5ab203f6 .cell:nth-child(3n + 2),
	.e-5ab203f6 .cell:nth-child(3n)
	{
		margin-top: 0;
	}

	.e-5ab203f6 .card-title { font-size: 21px; }
	.e-5ab203f6 .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-category-slider-1 ===== */
/* ===== BEGIN: section-city-break-1 (tamni slajder okruglih slika gradova) ===== */

.e-5319357f
{
	display: block;
	width: 100%;
}

.e-5319357f > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (levo poravnat, beli naslov + svetlo sivi podnaslov) ===== */

.e-5319357f > .holder > .head
{
	margin-bottom: 26px;
}

.e-5319357f .title
{
	margin: 0;
	font-size: 30px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #ffffff;
}

.e-5319357f .subtitle
{
	margin: 8px 0 0;
	font-size: 16px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.62);
}

/* ===== VIEWPORT + TRACK (vertikalni padding daje prostor za hover scale bez sečenja) ===== */

.e-5319357f .viewport
{
	position: relative;
	overflow: hidden;
	padding: 16px 0;
}

.e-5319357f .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (nosi z-index radi preklapanja pri hoveru) ===== */

.e-5319357f .cell
{
	position: relative;
	z-index: 1;
	flex: 0 0 calc(100% / var(--per-view, 7));
	max-width: calc(100% / var(--per-view, 7));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-5319357f .cell:hover
{
	z-index: 3;
}

/* ===== ITEM (link: okrugla slika + naziv + opciona cena, centrirano) ===== */

.e-5319357f .item
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

/* ===== ITEM IMAGE (savršen krug, suptilan tamni obris + senka) ===== */

.e-5319357f .item > .item-image
{
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border: 2px solid rgba(255, 255, 255, 0.10);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.40);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease, border-color 360ms ease;
}

.e-5319357f .item:hover > .item-image
{
	transform: scale(1.06);
	border-color: rgba(255, 255, 255, 0.22);
	box-shadow: 0 22px 46px rgba(0, 0, 0, 0.52);
}

/* ===== CAPTION (naziv grada + opciona cena) ===== */

.e-5319357f .item-caption
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	text-align: center;
}

.e-5319357f .item-name
{
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

.e-5319357f .item-price
{
	display: inline-block;
	padding: 4px 12px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	color: #8fc9f2;
	background: rgba(3, 122, 213, 0.18);
	border-radius: 999px;
}

/* ===== ARROWS (kružne, sa strane, vertikalno centrirane na krugove) ===== */

.e-5319357f .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: white;
	border: 0;
	border-radius: 50%;
	color: #1c1f26;
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.30);
	transition: background 240ms ease, color 240ms ease, transform 240ms ease;
}

.e-5319357f .arrow:hover
{
	background: #037ad5;
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-5319357f .arrow > i
{
	font-size: 22px;
}

.e-5319357f .arrow-prev { left: 4px; }
.e-5319357f .arrow-next { right: 4px; }

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5319357f .title { font-size: 26px; }
	.e-5319357f .item-name { font-size: 16px; }
}

@media (max-width: 640px)
{
	.e-5319357f .title { font-size: 23px; }
	.e-5319357f .subtitle { font-size: 15px; }
	.e-5319357f .arrow { width: 42px; height: 42px; }
}

/* Na dodir (bez hovera) nema uvećanja — krug ostaje miran. */

@media (hover: none)
{
	.e-5319357f .item:hover > .item-image
	{
		transform: none;
		border-color: rgba(255, 255, 255, 0.10);
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.40);
	}
}

/* ===== END: section-city-break-1 ===== */
/* ===== BEGIN: section-city-cards-1 ===== */

.e-6bb5bae3
{
	display: block;
	width: 100%;
}

.e-6bb5bae3 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (centered eyebrow + title + subtitle) ===== */

.e-6bb5bae3 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
	margin-bottom: 36px;
}

.e-6bb5bae3 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-6bb5bae3 .head > .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: var(--ot-brand);
}

.e-6bb5bae3 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	font-size: 44px;
	letter-spacing: -0.025em;
	line-height: 1.04;
	color: var(--ot-text-1);
}

.e-6bb5bae3 .head > .subtitle
{
	margin: 0;
	max-width: 620px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== VIEWPORT + TRACK ===== */

.e-6bb5bae3 .viewport
{
	position: relative;
	overflow: hidden;
}

.e-6bb5bae3 .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD ===== */

.e-6bb5bae3 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 12px 8px;
	box-sizing: border-box;
}

.e-6bb5bae3 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6bb5bae3 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay) ===== */

.e-6bb5bae3 .card > .card-image
{
	display: block;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6bb5bae3 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD BODY (white block) ===== */

.e-6bb5bae3 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 20px 20px;
}

.e-6bb5bae3 .card-tags
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.e-6bb5bae3 .card-pill
{
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: white;
	white-space: nowrap;
}

.e-6bb5bae3 .card-category
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-6bb5bae3 .card-name
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.15;
	color: var(--ot-text-1);
}

.e-6bb5bae3 .card-cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 2px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--ot-brand);
}

.e-6bb5bae3 .card-cta > i
{
	font-size: 16px;
	transition: transform 240ms ease;
}

.e-6bb5bae3 .card:hover .card-cta > i
{
	transform: translateX(4px);
}

/* ===== ARROWS ===== */

.e-6bb5bae3 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.92);
	border: 0;
	border-radius: 50%;
	color: var(--ot-brand);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.16);
	transition: background 240ms, color 240ms;
}

.e-6bb5bae3 .arrow:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-6bb5bae3 .arrow-prev { left: 18px; }
.e-6bb5bae3 .arrow-next { right: 18px; }

/* ===== DOTS ===== */

.e-6bb5bae3 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 22px;
}

.e-6bb5bae3 .dots > .dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	background: var(--ot-bg-3-border);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-6bb5bae3 .dots > .dot.active
{
	width: 28px;
	background: var(--ot-brand);
	border-radius: 100px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-6bb5bae3 .head > .title { font-size: 34px; }
}

@media (max-width: 640px)
{
	.e-6bb5bae3 > .holder > .head { margin-bottom: 26px; }
	.e-6bb5bae3 .head > .title { font-size: 28px; }
	.e-6bb5bae3 .card-name { font-size: 21px; }
	.e-6bb5bae3 .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-city-cards-1 ===== */
.e-6059da07
{
	display: block;
	width: 100%;
}

.e-6059da07 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ===== SECTION HEAD (opciono; ne crta se dok naslov nije zadat) ===== */

.e-6059da07 .section-head
{
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-brand);
}

/* ===== TABS (country buttons) ===== */

.e-6059da07 .tabs
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.e-6059da07 .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 9px;
	height: 44px;
	padding: 0 18px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: all 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6059da07 .tabs > .tab:hover
{
	border-color: var(--ot-brand-border, var(--ot-brand));
	color: var(--ot-text-1);
}

.e-6059da07 .tabs > .tab.active
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-6059da07 .tabs > .tab > .tab-flag
{
	font-size: 17px;
	line-height: 1;
}

/* ===== GRID (cities) ===== */

.e-6059da07 .grid
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	gap: 10px;
}

.e-6059da07 .item
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 16px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-1);
	text-decoration: none;
	transition: border-color 220ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6059da07 .item:hover
{
	border-color: var(--ot-bg-3-border);
	background: var(--ot-bg-2);
	transform: translateY(-1px);
}

.e-6059da07 .item > .pin
{
	flex-shrink: 0;
	font-size: 19px;
	color: var(--ot-brand);
}

.e-6059da07 .item > .label
{
	flex: 1;
	min-width: 0;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-6059da07 .item > .count
{
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
}

.e-6059da07 .item > .arrow
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6059da07 .item:hover > .arrow
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-6059da07 .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px)
{
	.e-6059da07 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-6059da07 .section-head { font-size: 24px; }
}

@media (max-width: 480px)
{
	.e-6059da07 .grid { grid-template-columns: 1fr; }
	.e-6059da07 .section-head { font-size: 21px; }
}
/* ===== BEGIN: section-city-grid-1 (gradovi destinacije — mreža 3x2 sa plavim kružnim dugmetom) ===== */

.e-1e1206b2
{
	display: block;
	width: 100%;
}

.e-1e1206b2 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov i podnaslov levo) ===== */

.e-1e1206b2 > .holder > .head
{
	margin: 0 0 30px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-1e1206b2 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #16294d;
}

.e-1e1206b2 > .holder > .head > .subtitle
{
	max-width: 640px;
	margin: 12px 0 0 0;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== GRID (3 kolone x 2 reda, jednak razmak, jednake visine redova) ===== */

.e-1e1206b2 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (bela kartica, klikabilna, jednake visine) ===== */

.e-1e1206b2 > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-1e1206b2 > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== IMAGE (fiksne proporcije, iste visine u svim karticama) ===== */

.e-1e1206b2 > .holder > .grid > .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-1e1206b2 > .holder > .grid > .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== FOOT (bela traka: naziv levo, plavi krug desno) ===== */

.e-1e1206b2 > .holder > .grid > .card > .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	min-height: 78px;
	padding: 16px 18px;
	background: #ffffff;
}

.e-1e1206b2 > .holder > .grid > .card > .card-foot > .card-name
{
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
	color: #16294d;
}

/* ===== ARROW (pun plavi krug sa belom strelicom, ista vertikalna linija u svim karticama) ===== */

.e-1e1206b2 > .holder > .grid > .card > .card-foot > .card-arrow
{
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin-left: auto;
	border-radius: 999px;
	background: #2f6feb;
	transition: background-color 220ms ease, transform 220ms ease;
}

.e-1e1206b2 > .holder > .grid > .card > .card-foot > .card-arrow > i
{
	font-size: 20px;
	line-height: 1;
	color: #ffffff;
}

.e-1e1206b2 > .holder > .grid > .card:hover > .card-foot > .card-arrow
{
	transform: translateX(3px);
	background: #2559c7;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-1e1206b2 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-1e1206b2 > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-1e1206b2 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-1e1206b2 > .holder > .grid > .card > .card-foot
	{
		min-height: 70px;
		padding: 14px 16px;
	}

	.e-1e1206b2 > .holder > .head > .title { font-size: 26px; }
	.e-1e1206b2 > .holder > .head > .subtitle { font-size: 15px; }
	.e-1e1206b2 > .holder > .grid > .card > .card-foot > .card-name { font-size: 16px; }
}

/* ===== END: section-city-grid-1 ===== */
/* ===== BEGIN: section-citybreak-1 ===== */

.e-185d2da6
{
	display: block;
	width: 100%;
}

.e-185d2da6 > .holder
{
	width: 100%;
}

/* ===== TITLE (centered, bold, dark grey) ===== */

.e-185d2da6 > .holder > .title
{
	margin: 0 0 32px;
	text-align: center;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (3 columns x 2 rows) ===== */

.e-185d2da6 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-185d2da6 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.07);
	overflow: hidden;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-185d2da6 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (clean, full width, top, no overlay) ===== */

.e-185d2da6 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-185d2da6 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (centered name + description) ===== */

.e-185d2da6 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 22px 18px;
}

.e-185d2da6 .card-name
{
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-185d2da6 .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== CARD BUTTON (full width, bottom aligned, light blue) ===== */

.e-185d2da6 .card > .card-button
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: auto;
	width: 100%;
	box-sizing: border-box;
	padding: 14px 18px;
	background: var(--ot-blue);
	border-bottom-left-radius: var(--ot-radius-m);
	border-bottom-right-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	line-height: 1.3;
	color: white;
	transition: background 220ms ease;
}

.e-185d2da6 .card:hover > .card-button
{
	background: var(--ot-blue-hover);
}

.e-185d2da6 .card-button > .card-button-text
{
	flex: 1;
	min-width: 0;
	text-align: left;
	word-break: break-word;
}

.e-185d2da6 .card-button > i
{
	margin-left: auto;
	flex: 0 0 auto;
	font-size: 20px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-185d2da6 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-185d2da6 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-185d2da6 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-citybreak-1 ===== */
/* ===== BEGIN: section-citybreak-2 ===== */

.e-185d2da5
{
	display: block;
	width: 100%;
}

.e-185d2da5 > .holder
{
	width: 100%;
}

/* ===== TITLE (centered, bold, dark grey) ===== */

.e-185d2da5 > .holder > .title
{
	margin: 0 0 32px;
	text-align: center;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (3 columns x 2 rows) ===== */

.e-185d2da5 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-185d2da5 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.07);
	overflow: hidden;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-185d2da5 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (clean, full width, top, no overlay) ===== */

.e-185d2da5 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-185d2da5 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (centered name + description) ===== */

.e-185d2da5 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 22px 18px;
}

.e-185d2da5 .card-name
{
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-185d2da5 .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== CARD BUTTON (full width, bottom aligned, light blue) ===== */

.e-185d2da5 .card > .card-button
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: auto;
	width: 100%;
	box-sizing: border-box;
	padding: 14px 18px;
	background: var(--ot-blue);
	border-bottom-left-radius: var(--ot-radius-m);
	border-bottom-right-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	line-height: 1.3;
	color: white;
	transition: background 220ms ease;
}

.e-185d2da5 .card:hover > .card-button
{
	background: var(--ot-blue-hover);
}

.e-185d2da5 .card-button > .card-button-text
{
	flex: 1;
	min-width: 0;
	text-align: left;
	word-break: break-word;
}

.e-185d2da5 .card-button > i
{
	margin-left: auto;
	flex: 0 0 auto;
	font-size: 20px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-185d2da5 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-185d2da5 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-185d2da5 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-citybreak-2 ===== */
/* ===== BEGIN: section-collection-slider-1 ===== */

.e-2f71822a
{
	display: block;
	width: 100%;
}

.e-2f71822a > .holder
{
	width: 100%;
	outline: none;
}

/* ===== SECTION HEAD (left-aligned bold dark title) ===== */

.e-2f71822a .section-head
{
	margin: 0 0 20px;
	padding: 0 8px;
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== STAGE ===== */

.e-2f71822a .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-2f71822a .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 34px;
}

.e-2f71822a .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (white, bordered, image on top) ===== */

.e-2f71822a .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.3));
	max-width: calc(100% / var(--per-view, 3.3));
	padding: 0 8px;
	box-sizing: border-box;
}

.e-2f71822a .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(20, 18, 16, 0.05);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, border-color 320ms ease;
}

.e-2f71822a .card:hover
{
	transform: translateY(-4px);
	border-color: var(--ot-bg-3);
	box-shadow: 0 16px 36px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (full width top, clean, no overlay) ===== */

.e-2f71822a .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-2f71822a .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD BODY (name, description, link — flex column, equal height) ===== */

.e-2f71822a .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: var(--ot-spacing-m);
}

.e-2f71822a .card-name
{
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.005em;
	color: var(--ot-text-1);
}

.e-2f71822a .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 8px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== CARD FOOT (link pinned bottom-right regardless of description height) ===== */

.e-2f71822a .card > .card-body > .card-foot
{
	display: flex;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 16px;
}

.e-2f71822a .card-link
{
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color 240ms ease;
}

.e-2f71822a .card:hover .card-link
{
	color: var(--ot-brand);
}

/* ===== ARROWS (circular, vertically centered over the edges) ===== */

.e-2f71822a .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-3);
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 8px 22px rgba(20, 18, 16, 0.14);
	transition: background 240ms ease, transform 240ms ease, color 240ms ease;
}

.e-2f71822a .arrow-prev
{
	left: 2px;
}

.e-2f71822a .arrow-next
{
	right: 2px;
}

.e-2f71822a .arrow:hover
{
	background: var(--ot-brand);
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-2f71822a .arrow > i
{
	font-size: 22px;
}

/* ===== PROGRESS BAR (bottom center, brand fill) ===== */

.e-2f71822a .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 24px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-2f71822a .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--ot-brand);
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2f71822a .section-head { font-size: 24px; }
	.e-2f71822a .viewport { padding: 12px 26px; }
}

@media (max-width: 640px)
{
	.e-2f71822a .section-head { font-size: 21px; }
	.e-2f71822a .viewport { padding: 10px 16px; }
	.e-2f71822a .cell { padding: 0 6px; }
	.e-2f71822a .arrow { width: 40px; height: 40px; }
	.e-2f71822a .progress { max-width: 78%; }
}

/* ===== END: section-collection-slider-1 ===== */
.e-357f3986
{
	display: block;
	width: 100%;
}

.e-357f3986 > .holder
{
	width: 100%;
	color: inherit;
}

/* ===== HEAD ===== */

.e-357f3986 .head
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 40px;
	max-width: 760px;
}

.e-357f3986 > .holder.variant-centered .head
{
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	align-items: center;
}

.e-357f3986 .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-357f3986 .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: currentColor;
	opacity: 0.7;
}

.e-357f3986 .title
{
	font-family: var(--ot-font-secondary);
	font-size: 44px;
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.05;
	margin: 0;
	font-variation-settings: 'opsz' 144;
	color: inherit;
}

.e-357f3986 .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-357f3986 .description
{
	font-size: 14.5px;
	line-height: 1.65;
	margin: 0;
	max-width: 560px;
	opacity: 0.85;
}

/* ===== BODY ===== */

.e-357f3986 .body
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	align-items: flex-start;
}

.e-357f3986 > .holder.variant-split .body
{
	grid-template-columns: 1.4fr 1fr;
}

.e-357f3986 > .holder.variant-centered .body
{
	grid-template-columns: 1fr;
	max-width: 720px;
	margin: 0 auto;
}

.e-357f3986 > .holder.variant-compact .body
{
	grid-template-columns: 1fr;
	max-width: 560px;
}

/* ========================================== */
/* ===== FORM =============================== */
/* ========================================== */

.e-357f3986 .form
{
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.e-357f3986 .form-grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px 14px;
}

.e-357f3986 .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.e-357f3986 .field.field-textarea,
.e-357f3986 .field.field-span-2
{
	grid-column: span 2;
}

/* Label */

.e-357f3986 .field-label
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	padding: 0 2px;
}

.e-357f3986 .field-required
{
	color: var(--ot-brand);
	font-size: 12px;
}

/* Control */

.e-357f3986 .field-control
{
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	transition: border-color 200ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms;
}

.e-357f3986 .field-control:focus-within
{
	border-color: var(--ot-brand);
	background: var(--ot-bg-1);
}

.e-357f3986 .field.field-textarea > .field-control
{
	align-items: flex-start;
	padding-top: 14px;
}

/* Icon */

.e-357f3986 .field-icon
{
	font-size: 17px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-357f3986 .field-control:focus-within .field-icon
{
	color: var(--ot-brand);
}

/* Inputs / textarea / select */

.e-357f3986 .field-control input,
.e-357f3986 .field-control textarea,
.e-357f3986 .field-control select
{
	flex: 1;
	width: 100%;
	min-width: 0;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	outline: none;
	resize: none;
}

.e-357f3986 .field-control input::placeholder,
.e-357f3986 .field-control textarea::placeholder
{
	color: var(--ot-text-3);
}

.e-357f3986 .field-control textarea
{
	min-height: 110px;
	line-height: 1.55;
}

.e-357f3986 .field-control select
{
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	padding-right: 24px;
}

.e-357f3986 .field-chevron
{
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 18px;
	color: var(--ot-text-3);
	pointer-events: none;
}

/* ===== FORM FOOT ===== */

.e-357f3986 .form-foot
{
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 6px;
	flex-wrap: wrap;
}

.e-357f3986 .form-cta
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	background: var(--ot-text-1);
	border: 0;
	border-radius: 100px;
	font: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-bg-1);
	letter-spacing: 0.005em;
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), gap 240ms, transform 240ms;
	flex-shrink: 0;
}

.e-357f3986 .form-cta:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 14px;
	transform: translateY(-1px);
}

.e-357f3986 .form-cta > i
{
	font-size: 17px;
}

/* Disclaimer */

.e-357f3986 .form-disclaimer
{
	display: block;
	font-size: 11.5px;
	line-height: 1.55;
	margin: 0;
	max-width: 480px;
	opacity: 0.6;
	flex: 1;
	min-width: 220px;
}

.e-357f3986 .form-disclaimer > span,
.e-357f3986 .form-disclaimer > span > *
{
	display: inline;
}

.e-357f3986 .form-disclaimer a
{
	display: inline;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ========================================== */
/* ===== INFO (side block) ================== */
/* ========================================== */

.e-357f3986 .info
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.e-357f3986 > .holder.variant-split .info
{
	padding-left: 32px;
	border-left: 1px solid var(--ot-bg-2-border);
}

/* Info head */

.e-357f3986 .info-head
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-357f3986 .info-title
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-357f3986 .info-description
{
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
}

/* Info rows */

.e-357f3986 .info-rows
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-357f3986 .info-row
{
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	border-radius: var(--ot-radius-m);
	color: inherit;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms;
}

.e-357f3986 .info-row:hover
{
	background: var(--ot-bg-2);
	transform: translateX(2px);
}

.e-357f3986 .info-row-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	flex-shrink: 0;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms;
}

.e-357f3986 .info-row:hover .info-row-icon
{
	background: var(--ot-brand);
	color: white;
}

.e-357f3986 .info-row-icon > i
{
	font-size: 17px;
}

.e-357f3986 .info-row-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-357f3986 .info-row-label
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-357f3986 .info-row-value
{
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-text-1);
}

/* Info socials */

.e-357f3986 .info-socials
{
	display: inline-flex;
	gap: 6px;
	padding-top: 12px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-357f3986 .info-social
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	color: var(--ot-text-2);
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, border-color 220ms;
}

.e-357f3986 .info-social:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-357f3986 .info-social > i
{
	font-size: 17px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-357f3986 > .holder.variant-split .body
	{
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.e-357f3986 > .holder.variant-split .info
	{
		padding-left: 0;
		border-left: 0;
		padding-top: 28px;
		border-top: 1px solid var(--ot-bg-2-border);
	}
}

@media (max-width: 700px)
{
	.e-357f3986 .title
	{
		font-size: 32px;
	}

	.e-357f3986 .head
	{
		margin-bottom: 28px;
	}

	.e-357f3986 .form-grid
	{
		grid-template-columns: 1fr;
	}

	.e-357f3986 .field.field-span-2,
	.e-357f3986 .field.field-textarea
	{
		grid-column: auto;
	}
}
/* ===== BEGIN: section-contact-banner-1 ===== */

.e-603b0925
{
	display: block;
	width: 100%;
	--cb-navy: #141e5a;
	--cb-blue: #2f6feb;
	--cb-blue-hover: #1d55c4;
	--cb-teal: #1ca7d0;
	--cb-green: #27ae60;
	--cb-yellow: #f5d94e;
}

.e-603b0925 > .holder
{
	width: 100%;
}

/* ===== BANER (beli blok sa zaobljenim uglovima) ===== */

.e-603b0925 > .holder > .banner
{
	position: relative;
	display: flex;
	align-items: stretch;
	overflow: hidden;
	min-height: 230px;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 2px 14px rgba(20, 30, 90, 0.08);
}

/* ===== TEKST (vertikalno centriran u levom delu) ===== */

.e-603b0925 > .holder > .banner > .text
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: center;
	gap: 20px;
	padding: 44px 20px 44px 48px;
}

/* Sites app gura serif na sve naslove, pa se sans-serif ovde postavlja eksplicitno. */

.e-603b0925 > .holder > .banner > .text > .title
{
	margin: 0;
	max-width: 620px;
	font-family: var(--ot-font-primary);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--cb-navy);
}

.e-603b0925 > .holder > .banner > .text > .links
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 36px;
}

.e-603b0925 > .holder > .banner > .text > .links > .link
{
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--cb-blue);
	text-decoration: none;
	transition: color 0.2s ease;
}

.e-603b0925 > .holder > .banner > .text > .links > .link:hover
{
	color: var(--cb-blue-hover);
}

.e-603b0925 > .holder > .banner > .text > .links > .link > .link-ico
{
	font-size: 22px;
	line-height: 1;
}

/* ===== VIZUAL (desna trecina: talasi pa fotografija preko njih) ===== */

.e-603b0925 > .holder > .banner > .visual
{
	position: relative;
	flex: 0 0 34%;
	align-self: stretch;
}

/* Organski talas je isti idiom kao na promo banerima: krug koji viri van ivice. */

.e-603b0925 > .holder > .banner > .visual > .wave
{
	position: absolute;
	z-index: 1;
	display: block;
	border-radius: 50%;
}

.e-603b0925 > .holder > .banner > .visual > .wave-blue
{
	top: -46px;
	right: -70px;
	width: 216px;
	height: 216px;
	background: var(--cb-blue);
	opacity: 0.9;
}

.e-603b0925 > .holder > .banner > .visual > .wave-teal
{
	right: -104px;
	bottom: -56px;
	width: 186px;
	height: 186px;
	background: var(--cb-teal);
	opacity: 0.85;
}

.e-603b0925 > .holder > .banner > .visual > .wave-green
{
	right: 30px;
	bottom: -66px;
	width: 124px;
	height: 124px;
	background: var(--cb-green);
	opacity: 0.75;
}

.e-603b0925 > .holder > .banner > .visual > .wave-yellow
{
	top: 44%;
	right: -30px;
	width: 92px;
	height: 92px;
	background: var(--cb-yellow);
	opacity: 0.9;
}

/* Maska gasi levu ivicu fotografije prema beloj pozadini a desnu prema talasima, tako da se oni vide iza nje i nigde nema tvrdog reza. */

.e-603b0925 > .holder > .banner > .visual > .photo
{
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	bottom: 0;
	display: block;
	width: 84%;
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 62%, rgba(0, 0, 0, 0) 100%);
	mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 62%, rgba(0, 0, 0, 0) 100%);
}

/* ===== TABLET (uza slika, vise mesta naslovu) ===== */

@media (max-width: 1024px)
{
	.e-603b0925 > .holder > .banner
	{
		min-height: 200px;
	}

	.e-603b0925 > .holder > .banner > .text
	{
		gap: 16px;
		padding: 34px 16px 34px 34px;
	}

	.e-603b0925 > .holder > .banner > .text > .title
	{
		font-size: 25px;
	}

	.e-603b0925 > .holder > .banner > .text > .links
	{
		gap: 10px 26px;
	}

	.e-603b0925 > .holder > .banner > .text > .links > .link
	{
		font-size: 16px;
	}

	.e-603b0925 > .holder > .banner > .visual
	{
		flex: 0 0 26%;
	}

	.e-603b0925 > .holder > .banner > .visual > .wave-blue
	{
		top: -40px;
		right: -60px;
		width: 168px;
		height: 168px;
	}

	.e-603b0925 > .holder > .banner > .visual > .wave-teal
	{
		right: -84px;
		bottom: -48px;
		width: 146px;
		height: 146px;
	}

	.e-603b0925 > .holder > .banner > .visual > .wave-green
	{
		right: 86px;
		bottom: -54px;
		width: 96px;
		height: 96px;
	}

	.e-603b0925 > .holder > .banner > .visual > .wave-yellow
	{
		right: -24px;
		width: 72px;
		height: 72px;
	}
}

/* ===== MOBILNI (slika kao uska traka iznad teksta, tekst pune sirine) ===== */

@media (max-width: 768px)
{
	.e-603b0925 > .holder > .banner
	{
		flex-direction: column;
		min-height: 0;
	}

	.e-603b0925 > .holder > .banner > .text
	{
		padding: 24px 22px 30px;
	}

	.e-603b0925 > .holder > .banner > .text > .title
	{
		max-width: none;
		font-size: 22px;
	}

	.e-603b0925 > .holder > .banner > .text > .links
	{
		gap: 12px 24px;
	}

	/* Traka drzi talas u sebi jer on ovde vise ne ide preko banera nego preko teksta. */

	.e-603b0925 > .holder > .banner > .visual
	{
		order: -1;
		overflow: hidden;
		flex: 0 0 auto;
		height: 132px;
	}

	/* Na uskom ekranu ostaje samo jedan dekorativni talas, ostali se gase. */

	.e-603b0925 > .holder > .banner > .visual > .wave-teal,
	.e-603b0925 > .holder > .banner > .visual > .wave-green,
	.e-603b0925 > .holder > .banner > .visual > .wave-yellow
	{
		display: none;
	}

	/* Talas sedi u donjem desnom uglu trake, tamo gde je fotografija vec prozirna. */

	.e-603b0925 > .holder > .banner > .visual > .wave-blue
	{
		top: auto;
		right: -46px;
		bottom: -62px;
		width: 150px;
		height: 150px;
	}

	.e-603b0925 > .holder > .banner > .visual > .photo
	{
		left: 0;
		width: auto;
		background-position: center 50%;
		-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 44%, rgba(0, 0, 0, 0) 100%);
		mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 44%, rgba(0, 0, 0, 0) 100%);
	}
}

/* ===== END: section-contact-banner-1 ===== */
.e-35bc979f
{
	display: block;
	width: 100%;
}

/* ===== HOLDER ===== */

.e-35bc979f > .holder
{
	width: 100%;
	margin: 0 auto;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	line-height: 1.75;
	color: var(--ot-text-1);
	letter-spacing: 0;
}

.e-35bc979f > .holder.width-narrow  { max-width: 720px; }
.e-35bc979f > .holder.width-medium  { max-width: 880px; }
.e-35bc979f > .holder.width-wide    { max-width: 1100px; }
.e-35bc979f > .holder.width-full    { max-width: 1440px; }

.e-35bc979f > .holder.align-center
{
	text-align: center;
}

.e-35bc979f > .holder.align-center img,
.e-35bc979f > .holder.align-center figure
{
	margin-left: auto;
	margin-right: auto;
}

/* Reset margin on first/last child */

.e-35bc979f > .holder > *:first-child
{
	margin-top: 0;
}

.e-35bc979f > .holder > *:last-child
{
	margin-bottom: 0;
}

/* ===== HEADINGS ===== */

.e-35bc979f > .holder h1,
.e-35bc979f > .holder h2,
.e-35bc979f > .holder h3,
.e-35bc979f > .holder h4
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.02em;
	color: var(--ot-text-1);
	margin: 56px 0 16px;
	font-variation-settings: 'opsz' 144;
	line-height: 1.1;
}

.e-35bc979f > .holder h1
{
	font-size: 56px;
	letter-spacing: -0.03em;
	line-height: 1.0;
	margin: 0 0 24px;
}

.e-35bc979f > .holder h2
{
	font-size: 36px;
	letter-spacing: -0.025em;
	margin-top: 64px;
	padding-top: 32px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-35bc979f > .holder h2:first-child
{
	border-top: 0;
	padding-top: 0;
	margin-top: 0;
}

.e-35bc979f > .holder h3
{
	font-size: 26px;
	letter-spacing: -0.018em;
	margin-top: 44px;
}

.e-35bc979f > .holder h4
{
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.012em;
	margin-top: 32px;
}

.e-35bc979f > .holder h1 em,
.e-35bc979f > .holder h2 em,
.e-35bc979f > .holder h3 em,
.e-35bc979f > .holder h4 em
{
	font-style: italic;
	color: var(--ot-brand);
}

/* ===== PARAGRAPH ===== */

.e-35bc979f > .holder p
{
	margin: 0 0 18px;
	color: inherit;
}

.e-35bc979f > .holder p.lead,
.e-35bc979f > .holder .lead
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.55;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0 0 32px;
	font-variation-settings: 'opsz' 144;
}

/* ===== INLINE ===== */

.e-35bc979f > .holder strong,
.e-35bc979f > .holder b
{
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-35bc979f > .holder em,
.e-35bc979f > .holder i
{
	font-style: italic;
}

.e-35bc979f > .holder a
{
	color: var(--ot-brand);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-35bc979f > .holder a:hover
{
	color: var(--ot-brand-hover);
	text-decoration-thickness: 2px;
}

.e-35bc979f > .holder mark
{
	background: var(--ot-brand-opacity);
	color: var(--ot-text-1);
	padding: 1px 4px;
	border-radius: 3px;
}

.e-35bc979f > .holder small
{
	font-size: 0.85em;
	color: var(--ot-text-3);
}

.e-35bc979f > .holder code
{
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.92em;
	padding: 2px 7px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 4px;
	color: var(--ot-text-1);
}

/* ===== LISTS ===== */

.e-35bc979f > .holder ul,
.e-35bc979f > .holder ol
{
	margin: 0 0 22px;
	padding-left: 22px;
}

.e-35bc979f > .holder ul { list-style: none; padding-left: 0; }
.e-35bc979f > .holder ol { list-style: decimal; padding-left: 24px; }

.e-35bc979f > .holder ul > li,
.e-35bc979f > .holder ol > li
{
	margin: 8px 0;
	line-height: 1.7;
}

.e-35bc979f > .holder ul > li
{
	position: relative;
	padding-left: 24px;
}

.e-35bc979f > .holder ul > li::before
{
	content: '';
	position: absolute;
	left: 4px;
	top: 14px;
	width: 8px;
	height: 1px;
	background: var(--ot-brand);
}

.e-35bc979f > .holder ol > li::marker
{
	color: var(--ot-brand);
	font-family: var(--ot-font-secondary);
	font-weight: 500;
	font-variation-settings: 'opsz' 144;
}

.e-35bc979f > .holder li > ul,
.e-35bc979f > .holder li > ol
{
	margin: 8px 0;
}

/* ===== BLOCKQUOTE ===== */

.e-35bc979f > .holder blockquote
{
	margin: 32px 0;
	padding: 8px 28px;
	border-left: 3px solid var(--ot-brand);
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-35bc979f > .holder blockquote p
{
	margin: 8px 0;
}

.e-35bc979f > .holder blockquote cite
{
	display: block;
	margin-top: 12px;
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 600;
	font-style: normal;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

/* ===== IMAGES & FIGURES ===== */

.e-35bc979f > .holder img
{
	display: block;
	max-width: 100%;
	height: auto;
	margin: 32px 0;
	border-radius: var(--ot-radius-l);
}

.e-35bc979f > .holder figure
{
	margin: 36px 0;
}

.e-35bc979f > .holder figure > img
{
	margin: 0;
}

.e-35bc979f > .holder figure > figcaption
{
	margin-top: 12px;
	font-size: 12.5px;
	color: var(--ot-text-3);
	text-align: center;
	letter-spacing: 0.005em;
}

/* ===== HR ===== */

.e-35bc979f > .holder hr
{
	margin: 48px 0;
	border: 0;
	border-top: 1px solid var(--ot-bg-2-border);
}

/* ===== TABLES ===== */

.e-35bc979f > .holder table
{
	width: 100%;
	margin: 32px 0;
	border-collapse: collapse;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	font-size: 14px;
}

.e-35bc979f > .holder thead
{
	background: var(--ot-bg-2);
}

.e-35bc979f > .holder th
{
	text-align: left;
	padding: 14px 18px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-35bc979f > .holder td
{
	padding: 14px 18px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
	vertical-align: top;
}

.e-35bc979f > .holder tr:last-child td
{
	border-bottom: 0;
}

.e-35bc979f > .holder tbody tr:hover
{
	background: var(--ot-bg-2);
}

/* ===== CODE BLOCKS ===== */

.e-35bc979f > .holder pre
{
	margin: 32px 0;
	padding: 22px 24px;
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-radius: var(--ot-radius-m);
	overflow-x: auto;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 13px;
	line-height: 1.65;
}

.e-35bc979f > .holder pre > code
{
	background: transparent;
	border: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
}

/* ===== KBD ===== */

.e-35bc979f > .holder kbd
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 4px;
	font-family: var(--ot-font-secondary);
	font-size: 0.85em;
	font-weight: 500;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

/* ===== DETAILS / SUMMARY ===== */

.e-35bc979f > .holder details
{
	margin: 24px 0;
	padding: 18px 22px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

.e-35bc979f > .holder details > summary
{
	cursor: pointer;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	list-style: none;
}

.e-35bc979f > .holder details > summary::-webkit-details-marker
{
	display: none;
}

.e-35bc979f > .holder details > summary::after
{
	content: '+';
	float: right;
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	line-height: 1;
	color: var(--ot-brand);
	font-variation-settings: 'opsz' 144;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-35bc979f > .holder details[open] > summary::after
{
	content: '−';
}

.e-35bc979f > .holder details > p:first-of-type
{
	margin-top: 14px;
}

.e-35bc979f > .holder details > *:last-child
{
	margin-bottom: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-35bc979f > .holder
	{
		font-size: 15.5px;
	}

	.e-35bc979f > .holder h1
	{
		font-size: 40px;
	}

	.e-35bc979f > .holder h2
	{
		font-size: 28px;
		margin-top: 48px;
		padding-top: 24px;
	}

	.e-35bc979f > .holder h3
	{
		font-size: 22px;
		margin-top: 32px;
	}

	.e-35bc979f > .holder blockquote
	{
		font-size: 19px;
		padding: 4px 22px;
	}

	.e-35bc979f > .holder .lead,
	.e-35bc979f > .holder p.lead
	{
		font-size: 18px;
	}

	.e-35bc979f > .holder pre
	{
		padding: 18px 20px;
		font-size: 12.5px;
	}
}
/* ===== BEGIN: section-country-bento-1 ===== */

.e-3aab2375
{
	--cb-dark: #14181f;
	--cb-blue: #2f6feb;
	--cb-pink: #e6197d;
	--cb-grey: #6b7280;
	--cb-gap: 16px;
	--cb-radius: 8px;

	display: block;
	background-color: transparent;
}

.e-3aab2375 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Zaglavlje: naslov u dva stila levo, plavo pill dugme desno. */

.e-3aab2375 > .holder > .top
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.e-3aab2375 > .holder > .top > .title
{
	margin: 0;
	padding: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	line-height: 1.15;
	font-weight: 800;
	color: var(--cb-dark);
}

.e-3aab2375 > .holder > .top > .title > .lead
{
	white-space: pre-wrap;
}

.e-3aab2375 > .holder > .top > .title > .script
{
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 38px;
	font-style: italic;
	font-weight: 400;
	color: var(--cb-pink);
}

.e-3aab2375 > .holder > .top > .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 12px 22px;
	border-radius: 999px;
	background-color: var(--cb-blue);
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	text-decoration: none;
	transition: background-color 200ms ease, transform 200ms ease;
}

.e-3aab2375 > .holder > .top > .cta:hover
{
	background-color: #2358c4;
	transform: translateY(-1px);
}

.e-3aab2375 > .holder > .top > .cta > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 19px;
	font-weight: 400;
	line-height: 1;
}

/* Tabovi zemalja sa zastavicama. */

.e-3aab2375 > .holder > .tabs
{
	display: flex;
	align-items: stretch;
	gap: 26px;
	border-bottom: 1px solid #e6e8ec;
}

.e-3aab2375 > .holder > .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	margin: 0;
	padding: 0 0 12px;
	border: 0;
	border-bottom: 3px solid transparent;
	background: none;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 600;
	color: var(--cb-grey);
	cursor: pointer;
	transition: color 200ms ease, border-color 200ms ease;
}

.e-3aab2375 > .holder > .tabs > .tab:hover
{
	color: var(--cb-dark);
}

.e-3aab2375 > .holder > .tabs > .tab.active
{
	border-bottom-color: var(--cb-blue);
	font-weight: 800;
	color: var(--cb-dark);
}

.e-3aab2375 > .holder > .tabs > .tab > .flag
{
	display: block;
	width: 20px;
	height: 14px;
	flex: 0 0 auto;
	border-radius: 2px;
	background-color: #eef0f3;
	background-size: cover;
	background-position: center;
}

.e-3aab2375 > .holder > .tabs > .tab > .tab-label
{
	white-space: nowrap;
}

/* Bento: velika kartica levo, mreža 3x2 desno. */

.e-3aab2375 > .holder > .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	gap: var(--cb-gap);
}

.e-3aab2375 > .holder > .bento > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	gap: var(--cb-gap);
}

.e-3aab2375 .card
{
	position: relative;
	display: flex;
	overflow: hidden;
	height: 100%;
	border-radius: var(--cb-radius);
	background-color: #dfe3e8;
	background-size: cover;
	background-position: center;
	text-decoration: none;
}

.e-3aab2375 .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-3aab2375 .card:hover::before
{
	transform: scale(1.07);
}

.e-3aab2375 .card > .shade
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-3aab2375 .card > .shade-big
{
	background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.48) 100%);
}

.e-3aab2375 .card > .shade-small
{
	background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0.12) 62%, rgba(0, 0, 0, 0.28) 100%);
}

/* Velika kartica: centriran beli tekst i belo pill dugme sa plavim tekstom. */

.e-3aab2375 .card-big
{
	min-height: 420px;
}

.e-3aab2375 .card-big > .big-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 30px 24px;
	text-align: center;
	z-index: 2;
}

.e-3aab2375 .card-big > .big-body > .big-name
{
	display: block;
	font-family: var(--ot-font-primary);
	font-size: 42px;
	line-height: 1.1;
	font-weight: 800;
	color: #ffffff;
}

.e-3aab2375 .card-big > .big-body > .big-count
{
	display: block;
	font-size: 16px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.9);
}

.e-3aab2375 .card-big > .big-body > .big-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 12px;
	padding: 11px 30px;
	border-radius: 999px;
	background-color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	color: var(--cb-blue);
	transition: background-color 200ms ease;
}

.e-3aab2375 .card-big:hover > .big-body > .big-btn
{
	background-color: #eaf0ff;
}

/* Male kartice: ime i broj ponuda gore-levo. */

.e-3aab2375 .card-small
{
	min-height: 150px;
}

.e-3aab2375 .card-small > .small-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-self: flex-start;
	gap: 3px;
	width: 100%;
	padding: 16px 18px;
	z-index: 2;
}

.e-3aab2375 .card-small > .small-body > .small-name
{
	display: block;
	font-family: var(--ot-font-primary);
	font-size: 19px;
	line-height: 1.2;
	font-weight: 800;
	color: #ffffff;
}

.e-3aab2375 .card-small > .small-body > .small-count
{
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.88);
}

@media (max-width: 1024px)
{
	.e-3aab2375 > .holder > .top > .title
	{
		font-size: 28px;
	}

	.e-3aab2375 > .holder > .top > .title > .script
	{
		font-size: 31px;
	}

	.e-3aab2375 > .holder > .tabs
	{
		gap: 20px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.e-3aab2375 > .holder > .bento
	{
		grid-template-columns: 1fr;
	}

	.e-3aab2375 .card-big
	{
		min-height: 300px;
	}
}

@media (max-width: 640px)
{
	.e-3aab2375 > .holder > .top > .title
	{
		font-size: 24px;
	}

	.e-3aab2375 > .holder > .top > .title > .script
	{
		font-size: 27px;
	}

	.e-3aab2375 > .holder > .bento > .grid
	{
		grid-template-columns: 1fr;
	}

	.e-3aab2375 .card-big
	{
		min-height: 260px;
	}

	.e-3aab2375 .card-big > .big-body > .big-name
	{
		font-size: 32px;
	}

	.e-3aab2375 .card-small
	{
		min-height: 170px;
	}
}

/* ===== END: section-country-bento-1 ===== */
/* ===== BEGIN: section-country-cities-1 ===== */

.e-5fd1f102
{
	display: block;
	width: 100%;
	--cc-accent: #f5821e;
	--cc-dark: #24303a;
}

.e-5fd1f102 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-5fd1f102 .head
{
	margin-bottom: 22px;
	text-align: left;
}

.e-5fd1f102 .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--cc-dark);
}

.e-5fd1f102 .subtitle
{
	margin: 10px 0 0;
	max-width: 640px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== TABOVI ZEMALJA ===== */

.e-5fd1f102 .tabs
{
	display: flex;
	align-items: stretch;
	gap: 26px;
	margin-bottom: 24px;
	border-bottom: 1px solid #e6e8ec;
}

.e-5fd1f102 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 0 0 12px;
	border: 0;
	border-bottom: 3px solid transparent;
	background: none;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: color var(--ot-transition), border-color var(--ot-transition);
}

.e-5fd1f102 .tab:hover
{
	color: var(--cc-dark);
}

.e-5fd1f102 .tab.active
{
	border-bottom-color: var(--cc-accent);
	font-weight: 800;
	color: var(--cc-dark);
}

.e-5fd1f102 .flag
{
	display: block;
	width: 20px;
	height: 14px;
	flex-shrink: 0;
	border-radius: 2px;
	background-color: #eef0f3;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-5fd1f102 .tab-label
{
	white-space: nowrap;
}

/* ===== MREZA GRADOVA (6 po redu) ===== */

.e-5fd1f102 .grid
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 14px;
}

.e-5fd1f102 .card
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 58px;
	padding: 14px 16px;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5fd1f102 .card:hover
{
	transform: translateY(-2px);
	box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12);
}

.e-5fd1f102 .name
{
	overflow: hidden;
	font-size: 16px;
	font-weight: 700;
	color: var(--cc-dark);
	white-space: nowrap;
	text-overflow: ellipsis;
}

.e-5fd1f102 .chevron
{
	flex-shrink: 0;
	font-size: 20px;
	color: var(--ot-text-3);
	transition: transform var(--ot-transition);
}

.e-5fd1f102 .card:hover .chevron
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE (6 / 4 / 3 / 2 / 1) ===== */

@media (max-width: 1280px)
{
	.e-5fd1f102 .grid
	{
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 1024px)
{
	.e-5fd1f102 .tabs
	{
		gap: 20px;
		overflow-x: auto;
	}

	.e-5fd1f102 .title
	{
		font-size: 28px;
	}

	.e-5fd1f102 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 780px)
{
	.e-5fd1f102 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 520px)
{
	.e-5fd1f102 .grid
	{
		grid-template-columns: 1fr;
	}
}

/* ===== END: section-country-cities-1 ===== */
/* ===== BEGIN: section-country-offers-1 ===== */

.e-7868f430
{
	display: block;
	width: 100%;
	--co-orange: #f5821e;
	--co-orange-hover: #dc6f0f;
	--co-navy: #16294d;
	--co-blue: #dceefb;
	--co-grey: #6b7280;
}

.e-7868f430 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-7868f430 .head
{
	margin-bottom: 22px;
	text-align: left;
}

.e-7868f430 .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--co-navy);
}

.e-7868f430 .subtitle
{
	margin: 10px 0 0;
	max-width: 680px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.55;
	color: var(--co-grey);
}

/* ===== TABOVI ZEMALJA ===== */

.e-7868f430 .tabs
{
	display: flex;
	align-items: stretch;
	gap: 26px;
	margin-bottom: 26px;
	border-bottom: 1px solid #e6e8ec;
}

.e-7868f430 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 0 0 12px;
	border: 0;
	border-bottom: 3px solid transparent;
	background: none;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--co-grey);
	cursor: pointer;
	transition: color var(--ot-transition), border-color var(--ot-transition);
}

.e-7868f430 .tab:hover
{
	color: var(--co-navy);
}

.e-7868f430 .tab.active
{
	border-bottom-color: var(--co-orange);
	font-weight: 800;
	color: var(--co-navy);
}

.e-7868f430 .flag
{
	display: block;
	width: 20px;
	height: 14px;
	flex-shrink: 0;
	border-radius: 2px;
	background-color: #eef0f3;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-7868f430 .tab-label
{
	white-space: nowrap;
}

/* ===== MREZA KARTICA ===== */

.e-7868f430 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: 1fr;
	gap: 22px;
}

.e-7868f430 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 12px;
	background: #ffffff;
	overflow: hidden;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-7868f430 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
}

/* ===== GALERIJA ===== */

.e-7868f430 .gallery
{
	position: relative;
	flex: 0 0 190px;
	height: 190px;
	overflow: hidden;
}

.e-7868f430 .shot
{
	display: block;
	width: 100%;
	height: 100%;
	background-color: #eef0f3;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-7868f430 .g-arrow
{
	position: absolute;
	top: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin-top: -16px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--co-navy);
	cursor: pointer;
	opacity: 0;
	transition: opacity var(--ot-transition), background var(--ot-transition);
}

.e-7868f430 .card:hover .g-arrow
{
	opacity: 1;
}

.e-7868f430 .g-arrow:hover
{
	background: #ffffff;
}

.e-7868f430 .g-arrow i
{
	font-size: 20px;
}

.e-7868f430 .g-prev
{
	left: 10px;
}

.e-7868f430 .g-next
{
	right: 10px;
}

/* ===== PILULE I PECAT ===== */

.e-7868f430 .pills
{
	position: absolute;
	top: 12px;
	left: 12px;
	right: 62px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-7868f430 .pill
{
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--co-orange);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
}

.e-7868f430 .seal
{
	position: absolute;
	top: 12px;
	right: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #ffffff;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.18);
}

.e-7868f430 .seal.is-text
{
	font-size: 10px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--co-navy);
	text-align: center;
	overflow: hidden;
}

/* ===== INFO DEO ===== */

.e-7868f430 .info
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex: 1 1 auto;
	gap: 8px;
	padding: 16px 16px 18px;
}

.e-7868f430 .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
}

.e-7868f430 .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--co-navy);
	text-decoration: none;
}

.e-7868f430 .heart
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	background: #ffffff;
	color: var(--co-grey);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: color var(--ot-transition), border-color var(--ot-transition);
}

.e-7868f430 .heart.is-liked
{
	border-color: var(--co-orange);
	color: var(--co-orange);
}

.e-7868f430 .location
{
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	font-weight: 400;
	color: var(--co-grey);
}

.e-7868f430 .location i
{
	font-size: 16px;
}

.e-7868f430 .stars
{
	display: flex;
	align-items: center;
	gap: 2px;
}

.e-7868f430 .star
{
	font-size: 14px;
	line-height: 1;
	color: var(--co-orange);
}

.e-7868f430 .services
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
}

.e-7868f430 .service
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 500;
	color: var(--co-grey);
}

.e-7868f430 .service i
{
	font-size: 16px;
}

/* ===== CENOVNI BLOK ===== */

.e-7868f430 .money
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px 16px 14px;
	background: var(--co-blue);
}

.e-7868f430 .price-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--co-grey);
}

.e-7868f430 .price-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.e-7868f430 .price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--co-navy);
}

.e-7868f430 .note
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--co-navy);
}

.e-7868f430 .go
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--co-orange);
	color: #ffffff;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-7868f430 .card:hover .go
{
	background: var(--co-orange-hover);
}

.e-7868f430 .go i
{
	font-size: 22px;
}

/* ===== CTA ISPOD MREZE ===== */

.e-7868f430 .cta-row
{
	display: flex;
	justify-content: center;
	margin-top: 34px;
}

.e-7868f430 .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 50px;
	padding: 0 30px;
	border-radius: 999px;
	background: var(--co-orange);
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-7868f430 .cta:hover
{
	background: var(--co-orange-hover);
}

.e-7868f430 .cta i
{
	font-size: 20px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1200px)
{
	.e-7868f430 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 1024px)
{
	.e-7868f430 .tabs
	{
		gap: 20px;
		overflow-x: auto;
	}

	.e-7868f430 .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-7868f430 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-7868f430 .g-arrow
	{
		opacity: 1;
	}

	.e-7868f430 .cta
	{
		width: 100%;
		padding: 0 18px;
		text-align: center;
	}
}

/* ===== END: section-country-offers-1 ===== */
/* ===== BEGIN: section-country-places-1 ===== */

.e-24334945
{
	display: block;
	width: 100%;
	--cp-blue: #037ad5;
	--cp-blue-dark: #0265b1;
	--cp-navy: #16294d;
	--cp-tile: #f2f8fd;
}

.e-24334945 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-24334945 .head
{
	margin-bottom: 22px;
	text-align: left;
}

.e-24334945 .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--cp-navy);
}

.e-24334945 .subtitle
{
	margin: 10px 0 0;
	max-width: 640px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== TABOVI ZEMALJA (pune plave pilule, bez donje linije) ===== */

.e-24334945 .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 24px;
}

.e-24334945 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 9px 18px;
	border: 1px solid #dce6f0;
	border-radius: 100px;
	background: #ffffff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition);
}

.e-24334945 .tab:hover
{
	border-color: var(--cp-blue);
	color: var(--cp-blue);
}

.e-24334945 .tab.active
{
	border-color: var(--cp-blue);
	background: var(--cp-blue);
	font-weight: 800;
	color: #ffffff;
}

.e-24334945 .flag
{
	display: block;
	width: 20px;
	height: 14px;
	flex-shrink: 0;
	border-radius: 2px;
	background-color: #eef0f3;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-24334945 .tab-label
{
	white-space: nowrap;
}

/* ===== MREZA MESTA (6 po redu, svetloplave plocice sa plavom levom ivicom) ===== */

.e-24334945 .grid
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 14px;
}

.e-24334945 .card
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 58px;
	padding: 14px 16px;
	border-radius: 8px;
	border-left: 3px solid var(--cp-blue);
	background: var(--cp-tile);
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-24334945 .card:hover
{
	transform: translateY(-2px);
	background: #e4f1fc;
}

.e-24334945 .name
{
	overflow: hidden;
	font-size: 16px;
	font-weight: 700;
	color: var(--cp-navy);
	white-space: nowrap;
	text-overflow: ellipsis;
}

.e-24334945 .chevron
{
	flex-shrink: 0;
	font-size: 20px;
	color: var(--cp-blue);
	transition: transform var(--ot-transition), color var(--ot-transition);
}

.e-24334945 .card:hover .chevron
{
	transform: translateX(3px);
	color: var(--cp-blue-dark);
}

/* ===== RESPONSIVE (6 / 4 / 3 / 2 / 1) ===== */

@media (max-width: 1280px)
{
	.e-24334945 .grid
	{
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 1024px)
{
	.e-24334945 .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
	}

	.e-24334945 .title
	{
		font-size: 28px;
	}

	.e-24334945 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

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

@media (max-width: 520px)
{
	.e-24334945 .grid
	{
		grid-template-columns: 1fr;
	}
}

/* ===== END: section-country-places-1 ===== */
.e-31a00c76
{
	display: block;
	width: 100%;
}

.e-31a00c76 > .holder
{
	position: relative;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	padding: 64px 64px;
}

/* ===== VARIANTS ===== */

.e-31a00c76 > .holder.variant-dark
{
	background: var(--ot-text-1);
	color: white;
}

.e-31a00c76 > .holder.variant-light
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
	border: 1px solid var(--ot-bg-2-border);
}

.e-31a00c76 > .holder.variant-brand
{
	background: linear-gradient(135deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%);
	color: white;
}

.e-31a00c76 > .holder.variant-image
{
	background: var(--ot-bg-3);
	color: white;
}

/* Image cover */

.e-31a00c76 > .holder > .cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}

.e-31a00c76 > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(20, 18, 16, 0.78) 0%, rgba(20, 18, 16, 0.55) 100%);
}

/* ===== CONTENT ===== */

.e-31a00c76 > .holder > .content
{
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 64px;
}

.e-31a00c76 > .holder.align-center > .content
{
	grid-template-columns: 1fr;
	justify-items: center;
	text-align: center;
}

/* Text */

.e-31a00c76 .text
{
	display: flex;
	flex-direction: column;
	gap: 18px;
	max-width: 640px;
}

.e-31a00c76 > .holder.align-center .text
{
	align-items: center;
}

/* Eyebrow */

.e-31a00c76 .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-31a00c76 > .holder.variant-dark .eyebrow,
.e-31a00c76 > .holder.variant-image .eyebrow
{
	color: rgba(255, 254, 252, 0.85);
}

.e-31a00c76 > .holder.variant-light .eyebrow
{
	color: var(--ot-brand);
}

.e-31a00c76 > .holder.variant-brand .eyebrow
{
	color: rgba(255, 254, 252, 0.85);
}

.e-31a00c76 .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: currentColor;
	opacity: 0.7;
}

/* Title */

.e-31a00c76 .title
{
	font-family: var(--ot-font-secondary);
	font-size: 56px;
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1.0;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-31a00c76 > .holder.variant-dark .title,
.e-31a00c76 > .holder.variant-image .title,
.e-31a00c76 > .holder.variant-brand .title
{
	color: white;
}

.e-31a00c76 > .holder.variant-light .title
{
	color: var(--ot-text-1);
}

.e-31a00c76 .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-31a00c76 > .holder.variant-brand .title em
{
	color: white;
	opacity: 0.85;
}

.e-31a00c76 > .holder.variant-image .title em
{
	color: white;
	font-style: italic;
}

/* Description */

.e-31a00c76 .description
{
	font-size: 16px;
	line-height: 1.65;
	margin: 0;
	max-width: 540px;
}

.e-31a00c76 > .holder.variant-dark .description,
.e-31a00c76 > .holder.variant-image .description,
.e-31a00c76 > .holder.variant-brand .description
{
	color: rgba(255, 254, 252, 0.85);
}

.e-31a00c76 > .holder.variant-light .description
{
	color: var(--ot-text-2);
}

/* Actions */

.e-31a00c76 .actions
{
	display: inline-flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 8px;
}

.e-31a00c76 .cta
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 28px;
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.005em;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, gap 240ms, transform 240ms;
}

/* Primary CTA */

.e-31a00c76 > .holder.variant-dark .cta.primary,
.e-31a00c76 > .holder.variant-image .cta.primary
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-31a00c76 > .holder.variant-dark .cta.primary:hover,
.e-31a00c76 > .holder.variant-image .cta.primary:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 14px;
	transform: translateX(2px);
}

.e-31a00c76 > .holder.variant-light .cta.primary
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-31a00c76 > .holder.variant-light .cta.primary:hover
{
	background: var(--ot-brand);
	color: white;
	gap: 14px;
	transform: translateX(2px);
}

.e-31a00c76 > .holder.variant-brand .cta.primary
{
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
}

.e-31a00c76 > .holder.variant-brand .cta.primary:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	gap: 14px;
	transform: translateX(2px);
}

/* Secondary CTA (ghost) */

.e-31a00c76 .cta.secondary
{
	background: transparent;
	border: 1px solid currentColor;
	opacity: 0.85;
}

.e-31a00c76 .cta.secondary:hover
{
	opacity: 1;
	gap: 14px;
}

.e-31a00c76 .cta > i
{
	font-size: 18px;
}

/* ===== CONTACTS ===== */

.e-31a00c76 .contacts
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex-shrink: 0;
}

.e-31a00c76 .contact
{
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	border-radius: var(--ot-radius-m);
	color: inherit;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms;
}

.e-31a00c76 > .holder.variant-dark .contact:hover,
.e-31a00c76 > .holder.variant-image .contact:hover
{
	background: rgba(255, 255, 255, 0.06);
	transform: translateX(3px);
}

.e-31a00c76 > .holder.variant-light .contact:hover
{
	background: var(--ot-bg-1);
	transform: translateX(3px);
}

.e-31a00c76 > .holder.variant-brand .contact:hover
{
	background: rgba(255, 255, 255, 0.12);
	transform: translateX(3px);
}

.e-31a00c76 .contact-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	flex-shrink: 0;
}

.e-31a00c76 > .holder.variant-dark .contact-icon,
.e-31a00c76 > .holder.variant-image .contact-icon
{
	background: rgba(255, 255, 255, 0.1);
}

.e-31a00c76 > .holder.variant-light .contact-icon
{
	background: var(--ot-bg-3);
}

.e-31a00c76 > .holder.variant-brand .contact-icon
{
	background: rgba(255, 255, 255, 0.16);
}

.e-31a00c76 .contact-icon > i
{
	font-size: 18px;
}

.e-31a00c76 .contact-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-31a00c76 .contact-label
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	opacity: 0.7;
}

.e-31a00c76 .contact-value
{
	font-size: 14.5px;
	font-weight: 600;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-31a00c76 > .holder
	{
		padding: 48px 44px;
	}

	.e-31a00c76 .title
	{
		font-size: 44px;
	}

	.e-31a00c76 > .holder > .content
	{
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

@media (max-width: 600px)
{
	.e-31a00c76 > .holder
	{
		padding: 36px 28px;
	}

	.e-31a00c76 .title
	{
		font-size: 32px;
	}
}
/* ===== BEGIN: section-current-offer-1 ===== */

.e-1a274eee
{
	display: block;
	width: 100%;
}

.e-1a274eee > .holder
{
	width: 100%;
}

/* ===== HEADER (left aligned, dark blue, no subtitle) ===== */

.e-1a274eee > .holder > .title
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #10285c;
}

/* ===== GRID (4 columns x 2 rows = 8 equal, equal-height cards) ===== */

.e-1a274eee .grid
{
	display: grid;
	grid-template-columns: var(--cols, repeat(4, 1fr));
	gap: 24px;
	margin-top: 32px;
}

/* ===== CARD (landscape, full-cover image, clickable, straps spill past edges) ===== */

.e-1a274eee .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	overflow: visible;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 10px 28px rgba(16, 40, 92, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-1a274eee .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 42px rgba(16, 40, 92, 0.22);
}

/* ===== CARD IMAGE (clean full-cover, own clip, gentle zoom on hover) ===== */

.e-1a274eee .card > .card-image
{
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-1a274eee .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== STRAPS (decorative overlay layer, whole card stays clickable) ===== */

.e-1a274eee .card > .straps
{
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

/* Shared strap look — skewed parallelogram, sharp edges, right aligned */

.e-1a274eee .straps > .strap
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: 0;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(16, 40, 92, 0.24);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-1a274eee .straps .strap-text
{
	display: block;
	transform: skewX(14deg);
	text-align: center;
	color: white;
}

/* Upper strap — dark blue, shorter, shifted right, on top */

.e-1a274eee .straps > .strap-name
{
	right: -14px;
	bottom: 40px;
	z-index: 3;
	padding: 8px 22px;
	background: #10285c;
	transform: skewX(-14deg);
}

.e-1a274eee .strap-name > .strap-text
{
	font-weight: 800;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Lower strap — orange, wider, shifted left, overlaps the upper one */

.e-1a274eee .straps > .strap-tags
{
	right: 6px;
	bottom: 16px;
	z-index: 2;
	padding: 6px 30px;
	background: var(--ot-orange);
	transform: skewX(-14deg);
}

.e-1a274eee .strap-tags > .strap-text
{
	font-weight: 700;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Hover — straps slide slightly for a dynamic feel */

.e-1a274eee .card:hover .strap-name
{
	transform: skewX(-14deg) translateX(-6px);
}

.e-1a274eee .card:hover .strap-tags
{
	transform: skewX(-14deg) translateX(-10px);
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-1a274eee > .holder > .title
	{
		font-size: 28px;
	}

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

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-1a274eee > .holder > .title
	{
		font-size: 24px;
	}

	.e-1a274eee .grid
	{
		grid-template-columns: 1fr;
		gap: 20px;
		margin-top: 24px;
	}
}

/* ===== END: section-current-offer-1 ===== */
.e-6539f1ad
{
	display: block;
	width: 100%;
}

.e-6539f1ad > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 3), 1fr);
	gap: 24px;
}

/* ===== COLUMN ===== */

.e-6539f1ad .column
{
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	transition: border-color 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6539f1ad .column:hover
{
	border-color: var(--ot-bg-3-border);
}

/* ===== HEAD ===== */

.e-6539f1ad .column-head
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 26px 20px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	position: relative;
}

.e-6539f1ad .column-head::before
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 56px;
	height: 2px;
	background: var(--ot-brand);
}

.e-6539f1ad .column.accent-dark   .column-head::before { background: var(--ot-text-1); }
.e-6539f1ad .column.accent-green  .column-head::before { background: rgba(20, 144, 95, 1); }
.e-6539f1ad .column.accent-gold   .column-head::before { background: rgba(170, 130, 60, 1); }

.e-6539f1ad .column-head-row
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-6539f1ad .column-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: var(--ot-brand-opacity);
	flex-shrink: 0;
}

.e-6539f1ad .column-icon > i
{
	font-size: 19px;
	color: var(--ot-brand);
}

.e-6539f1ad .column.accent-dark   .column-icon { background: rgba(20, 18, 16, 0.06); }
.e-6539f1ad .column.accent-dark   .column-icon > i { color: var(--ot-text-1); }
.e-6539f1ad .column.accent-green  .column-icon { background: rgba(20, 144, 95, 0.12); }
.e-6539f1ad .column.accent-green  .column-icon > i { color: rgba(20, 144, 95, 1); }
.e-6539f1ad .column.accent-gold   .column-icon { background: rgba(170, 130, 60, 0.12); }
.e-6539f1ad .column.accent-gold   .column-icon > i { color: rgba(170, 130, 60, 1); }

.e-6539f1ad .column-head-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.e-6539f1ad .column-eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-6539f1ad .column-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	letter-spacing: -0.018em;
	line-height: 1.15;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-6539f1ad .column-subtitle
{
	font-size: 12.5px;
	line-height: 1.55;
	color: var(--ot-text-2);
	margin: 0;
}

/* ===== ITEMS ===== */

.e-6539f1ad .items
{
	list-style: none;
	margin: 0;
	padding: 4px 0;
	flex: 1;
}

.e-6539f1ad .item
{
	display: block;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-6539f1ad .item:last-child
{
	border-bottom: 0;
}

.e-6539f1ad .item-link
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 14px 26px;
	color: inherit;
	transition: background 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6539f1ad .item-link:hover
{
	background: var(--ot-bg-2);
}

.e-6539f1ad .item-left
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	flex: 1;
}

.e-6539f1ad .item-flag
{
	font-size: 18px;
	line-height: 1;
	flex-shrink: 0;
}

.e-6539f1ad .item-pin
{
	font-size: 17px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 200ms;
}

.e-6539f1ad .item-link:hover .item-pin
{
	color: var(--ot-brand);
}

.e-6539f1ad .item-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	line-height: 1.3;
}

.e-6539f1ad .item-location
{
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-6539f1ad .item-region
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-6539f1ad .item-badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	flex-shrink: 0;
	margin-left: 4px;
}

/* Price */

.e-6539f1ad .item-price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0;
	flex-shrink: 0;
	line-height: 1.0;
}

.e-6539f1ad .item-price-old
{
	font-size: 10.5px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-decoration: line-through;
	margin-bottom: 2px;
}

.e-6539f1ad .item-price-row
{
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
}

.e-6539f1ad .item-price-from
{
	font-size: 9.5px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.e-6539f1ad .item-price-value
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 500;
	color: var(--ot-brand);
	letter-spacing: -0.01em;
	font-variation-settings: 'opsz' 144;
}

.e-6539f1ad .column.accent-dark   .item-price-value { color: var(--ot-text-1); }
.e-6539f1ad .column.accent-green  .item-price-value { color: rgba(20, 144, 95, 1); }
.e-6539f1ad .column.accent-gold   .item-price-value { color: rgba(170, 130, 60, 1); }

/* ===== CTA ===== */

.e-6539f1ad .column-cta
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 16px 26px;
	background: var(--ot-bg-2);
	border-top: 1px solid var(--ot-bg-2-border);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms, gap 240ms;
}

.e-6539f1ad .column-cta:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	gap: 12px;
}

.e-6539f1ad .column-cta > i
{
	font-size: 16px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-6539f1ad > .holder
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 700px)
{
	.e-6539f1ad > .holder
	{
		grid-template-columns: 1fr;
	}
}
/* ===== BEGIN: section-departure-cities-1 (izbor polaznog grada — mreža pločica) ===== */

.e-2f119e1c
{
	display: block;
	width: 100%;
}

.e-2f119e1c > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo + sivlji podnaslov) ===== */

.e-2f119e1c > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-2f119e1c > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

.e-2f119e1c > .holder > .head > .subtitle
{
	margin: 8px 0 0 0;
	max-width: 640px;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== GRID (3 kolone, popunjava se s leva; poslednji red ostaje levo poravnat) ===== */

.e-2f119e1c > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	justify-items: stretch;
	gap: 18px;
}

/* ===== CARD (horizontalna bela pločica, klikabilna, jednake visine) ===== */

.e-2f119e1c > .holder > .grid > .card
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 64px;
	padding: 18px 20px;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-2f119e1c > .holder > .grid > .card:hover
{
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
}

/* ===== NAME (naziv grada, bold taman, levo) ===== */

.e-2f119e1c > .holder > .grid > .card > .name
{
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
	color: #24303a;
}

/* ===== CHEVRON (siv, prikačen uz desnu ivicu u svim karticama) ===== */

.e-2f119e1c > .holder > .grid > .card > .chevron
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 220ms ease;
}

.e-2f119e1c > .holder > .grid > .card:hover > .chevron
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2f119e1c > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-2f119e1c > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-2f119e1c > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.e-2f119e1c > .holder > .grid > .card
	{
		padding: 16px 18px;
	}

	.e-2f119e1c > .holder > .head > .title { font-size: 26px; }
	.e-2f119e1c > .holder > .head > .subtitle { font-size: 15px; }
	.e-2f119e1c > .holder > .grid > .card > .name { font-size: 17px; }
}

/* ===== END: section-departure-cities-1 ===== */
/* ===== BEGIN: section-destination-cards-1 ===== */

.e-45a6d936
{
	display: block;
	width: 100%;
}

.e-45a6d936 > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned, serif, bold, dark navy) ===== */

.e-45a6d936 > .holder > .title
{
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: #12294d;
}

/* ===== GRID (3 columns x 2 rows, bigger vertical gap) ===== */

.e-45a6d936 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 48px;
}

/* ===== CARD (single clickable unit, equal height, panel floats over image) ===== */

.e-45a6d936 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45a6d936 .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (rounded, own overflow so hover zoom clips) ===== */

.e-45a6d936 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45a6d936 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD PANEL (white block overlapping image bottom) ===== */

.e-45a6d936 .card > .card-panel
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	margin: -46px auto 0;
	box-sizing: border-box;
	padding: 20px 20px 18px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.12);
	transition: box-shadow 320ms ease;
}

.e-45a6d936 .card:hover > .card-panel
{
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.18);
}

/* ===== PILL (turquoise, white uppercase) ===== */

.e-45a6d936 .pill
{
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background: #12b3ad;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.2;
	color: white;
}

/* ===== TRIP NAME (sans-serif, bold, dark navy) ===== */

.e-45a6d936 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.25;
	color: #12294d;
}

/* ===== META ROW (two facts split by a thin vertical divider) ===== */

.e-45a6d936 .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 14px;
}

.e-45a6d936 .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 0 0 auto;
}

.e-45a6d936 .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-45a6d936 .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-45a6d936 .meta-divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	background: var(--ot-bg-3-border);
}

.e-45a6d936 .meta-right
{
	flex: 1;
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== BUTTON (full width, bottom aligned, outline, strongly rounded) ===== */

.e-45a6d936 .card > .card-panel > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-45a6d936 .card:hover > .card-panel > .card-button
{
	border-color: #12294d;
	color: #12294d;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-45a6d936 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-45a6d936 .grid
	{
		grid-template-columns: 1fr;
		row-gap: 36px;
	}

	.e-45a6d936 > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-45a6d936 .card > .card-panel
	{
		margin-top: -32px;
	}
}

/* ===== END: section-destination-cards-1 ===== */
/* ===== BEGIN: section-destination-cards-2 ===== */

.e-45a6d935
{
	display: block;
	width: 100%;
}

.e-45a6d935 > .holder
{
	width: 100%;
}

/* ===== HEAD (left-aligned bold dark title + grey single-line subtitle) ===== */

.e-45a6d935 > .holder > .head
{
	margin: 0 0 40px;
	text-align: left;
}

.e-45a6d935 .head > .title
{
	margin: 0;
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var(--ot-text-1);
}

.e-45a6d935 .head > .subtitle
{
	margin: 12px 0 0;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== GRID (3 columns x 3 rows, equal, equal spacing) ===== */

.e-45a6d935 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, white, rounded, soft shadow, no border) ===== */

.e-45a6d935 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.10);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45a6d935 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 16px 38px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE (landscape, full width, own overflow for zoom) ===== */

.e-45a6d935 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45a6d935 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD FOOT (white row: name left, circular arrow right) ===== */

.e-45a6d935 .card > .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	background: white;
}

.e-45a6d935 .card-foot > .card-name
{
	min-width: 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD ARROW (circular thin light border, grey chevron) ===== */

.e-45a6d935 .card-foot > .card-arrow
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	background: transparent;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease, background 220ms ease;
}

.e-45a6d935 .card-arrow > i
{
	font-size: 22px;
	line-height: 1;
	transition: transform 220ms ease;
}

.e-45a6d935 .card:hover .card-arrow
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

.e-45a6d935 .card:hover .card-arrow > i
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-45a6d935 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-45a6d935 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-45a6d935 .head > .title
	{
		font-size: 26px;
	}

	.e-45a6d935 > .holder > .head
	{
		margin-bottom: 28px;
	}
}

/* ===== END: section-destination-cards-2 ===== */
/* ===== BEGIN: section-destination-grid-1 ===== */

.e-2ec9f487
{
	display: block;
	width: 100%;
}

.e-2ec9f487 > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, bold) ===== */

.e-2ec9f487 > .holder > .title
{
	margin: 0 0 40px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

/* ===== GRID (3 columns x 2 rows, equal, equal-height, larger row gap) ===== */

.e-2ec9f487 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 56px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-2ec9f487 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-2ec9f487 .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (rounded, own overflow for zoom, bottom covered by body) ===== */

.e-2ec9f487 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-2ec9f487 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block that overlaps the image, narrower + centered) ===== */

.e-2ec9f487 .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-2ec9f487 .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-2ec9f487 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-2ec9f487 .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-2ec9f487 .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-2ec9f487 .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-2ec9f487 .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-2ec9f487 .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD BUTTON (full width, bottom aligned, outline, strongly rounded) ===== */

.e-2ec9f487 .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-2ec9f487 .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2ec9f487 .grid
	{
		grid-template-columns: repeat(2, 1fr);
		row-gap: 48px;
	}
}

@media (max-width: 640px)
{
	.e-2ec9f487 .grid
	{
		grid-template-columns: 1fr;
		row-gap: 40px;
	}

	.e-2ec9f487 > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-2ec9f487 .card > .card-body
	{
		margin-top: -28px;
	}
}

/* ===== END: section-destination-grid-1 ===== */
/* ===== BEGIN: section-destination-mozaik-1 ===== */

.e-6e587414
{
	display: block;
	width: 100%;
}

.e-6e587414 > .holder
{
	width: 100%;
}

/* ===== WIDEN — trazena mera se odseca na slobodan prostor pored kolone (100vw - 100%) umanjen za 24px zastite, pa siroki ekran dobije ceo zahtev a uzak samo ono sto stane, bez horizontalnog skrola ===== */

.e-6e587414 > .holder.is-wide
{
	--dm-grow: min(var(--dm-widen, 0px), max(0px, calc(100vw - 100% - 24px)));

	width: calc(100% + var(--dm-grow));
	margin-left: calc(-0.5 * var(--dm-grow));
}

/* ===== TITLE (left aligned, serif, bold, dark navy — kao destination-cards) ===== */

.e-6e587414 > .holder > .title
{
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: #12294d;
}

/* ===== GRID (uniform 3-column, 2-row mosaic) ===== */

.e-6e587414 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

/* ===== STAGE (opcioni slajder — strelice stoje SA STRANE reda, pa je pozornica uvucena) ===== */

.e-6e587414 > .holder > .stage
{
	position: relative;
	padding: 0 60px;
}

.e-6e587414 > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-6e587414 > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	margin: 0 -9px;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-6e587414 > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.4));
	max-width: calc(100% / var(--per-view, 3.4));
	padding: 0 9px;
	box-sizing: border-box;
}

.e-6e587414 > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 50%;
	background: white;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.14);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6e587414 > .holder > .stage > .arrow > i
{
	font-size: 24px;
	color: var(--ot-text-1);
}

.e-6e587414 > .holder > .stage > .arrow:hover
{
	background: #f1f4f8;
	transform: translateY(-50%) scale(1.06);
}

.e-6e587414 > .holder > .stage > .arrow.is-off
{
	opacity: 0.5;
	cursor: default;
}

.e-6e587414 > .holder > .stage > .arrow.is-off:hover
{
	background: white;
	transform: translateY(-50%);
}

.e-6e587414 > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-6e587414 > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== CARD (full-cover image, clickable, panel floats over bottom) ===== */

.e-6e587414 .card
{
	position: relative;
	display: flex;
	align-items: flex-end;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.12);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6e587414 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.18);
}

/* ===== CARD IMAGE (full-cover, hover zoom) ===== */

.e-6e587414 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6e587414 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== CARD PANEL (white block anchored across the bottom, floats over image) ===== */

.e-6e587414 .card > .card-panel
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	width: calc(100% - 24px);
	margin: 0 12px 12px;
	box-sizing: border-box;
	padding: 14px 16px 14px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.16);
}

/* ===== PILL (turquoise, white uppercase) ===== */

.e-6e587414 .pill
{
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background: #12b3ad;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.2;
	color: white;
}

/* ===== TRIP NAME (sans-serif, bold, dark navy) ===== */

.e-6e587414 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 10px;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.25;
	color: #12294d;
}

/* ===== CARD DESCRIPTION (opcioni kratak slogan ispod naziva) ===== */

.e-6e587414 .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 6px;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== META ROW (two facts split by a thin vertical divider) ===== */

.e-6e587414 .meta
{
	display: flex;
	align-items: stretch;
	gap: 14px;
	margin-top: 12px;
}

.e-6e587414 .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 0 0 auto;
}

.e-6e587414 .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-6e587414 .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-6e587414 .meta-divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	background: var(--ot-bg-3-border);
}

.e-6e587414 .meta-right
{
	flex: 1;
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE — 2 equal columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-6e587414 > .holder > .title
	{
		font-size: 30px;
	}

	.e-6e587414 .grid
	{
		grid-template-columns: 1fr 1fr;
	}

	.e-6e587414 > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-6e587414 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2.4));
		max-width: calc(100% / var(--per-view, 2.4));
	}
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-6e587414 > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-6e587414 .grid
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.e-6e587414 > .holder > .stage
	{
		padding: 0;
	}

	.e-6e587414 > .holder > .stage > .viewport > .track
	{
		margin: 0 -6px;
	}

	.e-6e587414 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1.4));
		max-width: calc(100% / var(--per-view, 1.4));
		padding: 0 6px;
	}

	.e-6e587414 > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-6e587414 > .holder > .stage > .arrow-prev { left: 4px; }
	.e-6e587414 > .holder > .stage > .arrow-next { right: 4px; }
}

/* ===== END: section-destination-mozaik-1 ===== */
/* ===== BEGIN: section-destination-offers-1 ===== */

.e-636d7758
{
	display: block;
	width: 100%;
	--do-dark: #24303a;
	--do-grey: #6b7280;
	--do-dot: #b4b8c0;
	--do-orange: #f5901e;
	--do-orange-hover: #dd8016;
	--do-coral: #e5484d;
	--do-beige: #e7dcc8;
	--do-line: #e6e1d8;
}

.e-636d7758 > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamni sans naslov) ===== */

.e-636d7758 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-636d7758 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--do-dark);
}

/* ===== GRID (tri kartice jednake sirine i visine) ===== */

.e-636d7758 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 24px;
}

/* ===== KARTICA (bela, zaobljena, traka se secka na gornje uglove) ===== */

.e-636d7758 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	min-width: 0;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-636d7758 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== TRAKA BRENDA (obojena, puna sirina kartice) ===== */

.e-636d7758 .card > .strip
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	background: var(--do-orange);
	color: #ffffff;
}

.e-636d7758 .strip > .strip-brand
{
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-636d7758 .strip > .strip-icon
{
	flex-shrink: 0;
	font-size: 18px;
	line-height: 1;
}

.e-636d7758 .strip > .strip-text
{
	min-width: 0;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== SLIKA (puna sirina, blagi zum na hover kartice) ===== */

.e-636d7758 .card > .card-media
{
	position: relative;
	display: block;
	height: 190px;
	overflow: hidden;
}

.e-636d7758 .card-media > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-636d7758 .card:hover .media-image
{
	transform: scale(1.06);
}

/* ===== TELO (razmak se rasteze da dno ostane poravnato) ===== */

.e-636d7758 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	min-width: 0;
	padding: 16px 18px 18px;
}

.e-636d7758 .card-body > .spacer
{
	flex: 1 1 auto;
	min-height: 14px;
}

.e-636d7758 .card-body > .tag
{
	display: inline-block;
	padding: 4px 11px;
	border-radius: 100px;
	background: #55606b;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #ffffff;
}

.e-636d7758 .card-body > .name
{
	font-size: 21px;
	font-weight: 800;
	line-height: 1.25;
	text-decoration: none;
	color: var(--do-dark);
}

.e-636d7758 .card-body > .name:hover
{
	text-decoration: underline;
}

.e-636d7758 .card-body > .location
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--do-grey);
}

/* ===== OCENE (narandzasta sunca + znak plus) ===== */

.e-636d7758 .card-body > .ratings
{
	display: flex;
	align-items: center;
	gap: 2px;
	color: var(--do-orange);
}

.e-636d7758 .ratings > i
{
	font-size: 18px;
	line-height: 1;
}

.e-636d7758 .ratings > .rating-plus
{
	margin-left: 3px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
}

/* ===== LISTA (siva tacka + tekst, prelama se u dva reda) ===== */

.e-636d7758 .card-body > .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
	margin-top: 4px;
}

.e-636d7758 .features > .feature
{
	position: relative;
	padding-left: 16px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--do-grey);
}

.e-636d7758 .features > .feature::before
{
	position: absolute;
	top: 8px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--do-dot);
	content: '';
}

/* ===== DONJI RED (separator, cena levo, dugme desno) ===== */

.e-636d7758 .card-body > .card-foot
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding-top: 14px;
	border-top: 1px solid var(--do-line);
}

.e-636d7758 .card-foot > .price
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-636d7758 .price > .price-promo
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--do-grey);
}

.e-636d7758 .price > .price-new
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--do-coral);
}

.e-636d7758 .price > .price-note
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--do-grey);
}

.e-636d7758 .card-foot > .price-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	min-height: 42px;
	padding: 0 22px;
	border-radius: 100px;
	background: var(--do-orange);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: #ffffff;
	transition: background var(--ot-transition);
}

.e-636d7758 .card-foot > .price-button:hover
{
	background: var(--do-orange-hover);
}

/* ===== VELIKO BEZ DUGME (puna sirina, centriran serifni tekst, sevron desno) ===== */

.e-636d7758 > .holder > .cta
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 76px;
	margin-top: 22px;
	padding: 20px 56px;
	border-radius: 10px;
	background: var(--do-beige);
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-636d7758 > .holder > .cta:hover
{
	background: #ddd0b7;
}

.e-636d7758 .cta > .cta-text
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: var(--do-dark);
}

.e-636d7758 .cta > .cta-chev
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	font-size: 28px;
	line-height: 1;
	color: var(--do-dark);
	transition: right var(--ot-transition);
}

.e-636d7758 > .holder > .cta:hover > .cta-chev
{
	right: 17px;
}

/* ===== RESPONSIVE (tri kartice, pa dve, pa jedna; bez dugme uvek puna sirina) ===== */

@media (max-width: 1024px)
{
	.e-636d7758 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-636d7758 .head > .title
	{
		font-size: 28px;
	}

	.e-636d7758 .cta > .cta-text
	{
		font-size: 22px;
	}
}

@media (max-width: 768px)
{
	.e-636d7758 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-636d7758 > .holder > .cta
	{
		min-height: 68px;
		padding: 18px 48px;
	}

	.e-636d7758 .cta > .cta-text
	{
		font-size: 19px;
	}
}

@media (max-width: 560px)
{
	.e-636d7758 .head > .title
	{
		font-size: 24px;
	}

	.e-636d7758 .card-body > .card-foot
	{
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	.e-636d7758 .card-foot > .price-button
	{
		width: 100%;
	}

	.e-636d7758 > .holder > .cta
	{
		padding: 16px 40px;
	}

	.e-636d7758 .cta > .cta-text
	{
		font-size: 17px;
	}

	.e-636d7758 .cta > .cta-chev
	{
		right: 14px;
		font-size: 24px;
	}
}

/* ===== END: section-destination-offers-1 ===== */
/* ===== BEGIN: section-destination-picks-1 (popularne destinacije — mreža 3x2 + bež CTA traka) ===== */

.e-76e0bc19
{
	--dp-dark: #24303a;
	--dp-sand: #e0c9a6;
	--dp-sand-hover: #d6bb92;

	display: block;
	width: 100%;
}

.e-76e0bc19 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif) ===== */

.e-76e0bc19 > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-76e0bc19 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--dp-dark);
}

/* ===== GRID (3 kolone po redu, jednak razmak, svi redovi iste visine) ===== */

.e-76e0bc19 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (bela kartica, klikabilna, jednake visine u SVIM redovima) ===== */

.e-76e0bc19 > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-76e0bc19 > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== IMAGE (fiksne proporcije, iste visine u svim karticama) ===== */

.e-76e0bc19 > .holder > .grid > .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-76e0bc19 > .holder > .grid > .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== FOOT (bela traka: naziv i cena levo, strelica desno) ===== */

.e-76e0bc19 > .holder > .grid > .card > .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	min-height: 76px;
	padding: 16px 18px;
	background: #ffffff;
}

.e-76e0bc19 > .holder > .grid > .card > .card-foot > .card-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.e-76e0bc19 > .holder > .grid > .card > .card-foot > .card-text > .card-name
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--dp-dark);
}

.e-76e0bc19 > .holder > .grid > .card > .card-foot > .card-text > .card-price
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--ot-text-2);
}

/* ===== ARROW (siva strelica, ista vertikalna linija u svim karticama) ===== */

.e-76e0bc19 > .holder > .grid > .card > .card-foot > .card-arrow
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 220ms ease;
}

.e-76e0bc19 > .holder > .grid > .card:hover > .card-foot > .card-arrow
{
	transform: translateX(3px);
}

/* ===== CTA (bež traka pune širine: serifni natpis centriran, strelica uz desnu ivicu) ===== */

.e-76e0bc19 > .holder > .cta
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 76px;
	margin-top: 22px;
	padding: 20px 56px;
	border-radius: 10px;
	background: var(--dp-sand);
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-76e0bc19 > .holder > .cta:hover
{
	background: var(--dp-sand-hover);
}

.e-76e0bc19 > .holder > .cta > .cta-text
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: var(--dp-dark);
}

.e-76e0bc19 > .holder > .cta > .cta-chev
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	font-size: 28px;
	line-height: 1;
	color: var(--dp-dark);
	transition: right var(--ot-transition);
}

.e-76e0bc19 > .holder > .cta:hover > .cta-chev
{
	right: 17px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-76e0bc19 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-76e0bc19 > .holder > .head > .title { font-size: 30px; }
	.e-76e0bc19 > .holder > .cta > .cta-text { font-size: 22px; }
}

@media (max-width: 640px)
{
	.e-76e0bc19 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-76e0bc19 > .holder > .grid > .card > .card-foot
	{
		min-height: 72px;
		padding: 14px 16px;
	}

	.e-76e0bc19 > .holder > .cta
	{
		min-height: 68px;
		padding: 18px 48px;
	}

	.e-76e0bc19 > .holder > .head > .title { font-size: 26px; }
	.e-76e0bc19 > .holder > .grid > .card > .card-foot > .card-text > .card-name { font-size: 16px; }
}

/* ===== END: section-destination-picks-1 ===== */
/* ===== BEGIN: section-destination-showcase-1 ===== */

.e-7c40a4ae
{
	display: block;
	width: 100%;
}

.e-7c40a4ae > .holder
{
	width: 100%;
}

/* Naslov mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-7c40a4ae > .holder > .title
{
	margin: 0 0 32px;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: center;
	color: #24303a;
}

/* ===== LAYOUT: galerija levo (siroko) + opis desno (uzko) ===== */

.e-7c40a4ae .layout
{
	display: grid;
	grid-template-columns: 1fr minmax(280px, 360px);
	gap: 40px;
	align-items: start;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-7c40a4ae .stage
{
	position: relative;
	outline: none;
}

.e-7c40a4ae .viewport
{
	position: relative;
	overflow: hidden;
	margin: 0 -10px;
}

.e-7c40a4ae .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (uspravne portret slike) ===== */

.e-7c40a4ae .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	max-width: calc(100% / var(--per-view, 3));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-7c40a4ae .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	text-decoration: none;
	background-color: var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(15, 40, 70, 0.10);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-7c40a4ae .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(15, 40, 70, 0.18);
}

.e-7c40a4ae .card > .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-7c40a4ae .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== NARANDZASTA OKRUGLA NALEPNICA (gore-levo) ===== */

.e-7c40a4ae .card > .badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #f5821e;
	box-shadow: 0 4px 12px rgba(15, 40, 70, 0.20);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: white;
}

/* ===== CONTROLS (ispod galerije, desno poravnate) ===== */

.e-7c40a4ae .controls
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 14px;
	margin-top: 22px;
}

.e-7c40a4ae .controls > .counter
{
	font-size: 15px;
	font-weight: 700;
	color: #24303a;
	min-width: 48px;
	text-align: center;
}

.e-7c40a4ae .controls > .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 0;
	cursor: pointer;
	background: var(--ot-bg-3);
	color: #24303a;
	transition: background 240ms, color 240ms, transform 240ms, opacity 240ms;
}

.e-7c40a4ae .controls > .arrow > i
{
	font-size: 24px;
	line-height: 1;
}

.e-7c40a4ae .controls > .arrow:hover
{
	background: #f5821e;
	color: white;
}

.e-7c40a4ae .controls > .arrow.is-off
{
	opacity: 0.4;
	cursor: default;
}

.e-7c40a4ae .controls > .arrow.is-off:hover
{
	background: var(--ot-bg-3);
	color: #24303a;
}

/* ===== INFO (desna kolona) ===== */

.e-7c40a4ae .info
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.e-7c40a4ae .info > .country
{
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--ot-text-2);
}

.e-7c40a4ae .info > .name
{
	margin: 6px 0 0;
	font-family: var(--ot-font-primary);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

.e-7c40a4ae .info > .price
{
	margin-top: 8px;
	font-size: 16px;
	font-weight: 700;
	color: #f5821e;
}

.e-7c40a4ae .info > .description
{
	margin: 16px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== OCENE (red po oceni, tanka linija pune sirine ispod) ===== */

.e-7c40a4ae .info > .ratings
{
	width: 100%;
	margin-top: 22px;
}

.e-7c40a4ae .rating
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-7c40a4ae .rating > .rating-label
{
	font-size: 15px;
	font-weight: 700;
	color: #24303a;
}

.e-7c40a4ae .rating > .rating-value
{
	font-size: 15px;
	color: var(--ot-text-2);
}

/* ===== NARANDZASTO PILL DUGME ===== */

.e-7c40a4ae .info > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 26px;
	padding: 13px 28px;
	border-radius: 999px;
	background: #f5821e;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	color: white;
	transition: background 240ms;
}

.e-7c40a4ae .info > .cta:hover
{
	background: #dd6f0f;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-7c40a4ae .layout
	{
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.e-7c40a4ae > .holder > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-7c40a4ae > .holder > .title { font-size: 26px; }
	.e-7c40a4ae .cell { padding: 0 8px; }
	.e-7c40a4ae .viewport { margin: 0 -8px; }
	.e-7c40a4ae .info > .name { font-size: 26px; }

	.e-7c40a4ae .info > .cta
	{
		width: 100%;
		box-sizing: border-box;
	}
}

/* ===== END: section-destination-showcase-1 ===== */
/* ===== BEGIN: section-destination-slider-1 ===== */

.e-45621422
{
	display: block;
	width: 100%;
}

.e-45621422 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== VIEWPORT + TRACK (vertikalni padding daje prostor za hover scale bez sečenja) ===== */

.e-45621422 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 18px 0;
}

.e-45621422 .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (nosi z-index radi preklapanja pri hoveru) ===== */

.e-45621422 .cell
{
	position: relative;
	z-index: 1;
	flex: 0 0 calc(100% / var(--per-view, 4.2));
	max-width: calc(100% / var(--per-view, 4.2));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-45621422 .cell:hover
{
	z-index: 3;
}

/* ===== CARD (full-cover slika, zaobljeni uglovi, senka) ===== */

.e-45621422 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.20);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-45621422 .card:hover
{
	transform: scale(1.05);
	box-shadow: 0 26px 54px rgba(20, 18, 16, 0.34);
}

.e-45621422 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45621422 .card:hover > .card-image
{
	transform: scale(1.08);
}

/* ===== DARK BOTTOM GRADIENT (readability) ===== */

.e-45621422 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(12, 12, 14, 0.82) 0%, rgba(12, 12, 14, 0.40) 32%, rgba(12, 12, 14, 0) 60%);
}

/* ===== OPEN ARROW (gornji desni ugao, dijagonalno gore-desno) ===== */

.e-45621422 .card > .card-open
{
	position: absolute;
	top: 14px;
	right: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: rgba(255, 255, 255, 0.16);
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 50%;
	backdrop-filter: blur(4px);
	transition: background 240ms ease, transform 240ms ease;
}

.e-45621422 .card:hover > .card-open
{
	background: rgba(255, 255, 255, 0.28);
	transform: translate(2px, -2px);
}

.e-45621422 .card-open > i
{
	font-size: 20px;
	color: white;
	transform: rotate(-45deg);
}

/* ===== CARD BODY (kategorija + naziv, dole levo) ===== */

.e-45621422 .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding: 20px 20px 22px;
}

.e-45621422 .card-category
{
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.82);
}

.e-45621422 .card-name
{
	font-weight: 800;
	font-size: 26px;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: white;
}

/* ===== ARROWS (kružne, sa strane, vertikalno centrirane) ===== */

.e-45621422 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: white;
	border: 0;
	border-radius: 50%;
	color: #1c1f26;
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.18);
	transition: background 240ms ease, color 240ms ease, transform 240ms ease;
}

.e-45621422 .arrow:hover
{
	background: #1c1f26;
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-45621422 .arrow > i
{
	font-size: 22px;
}

.e-45621422 .arrow-prev { left: 4px; }
.e-45621422 .arrow-next { right: 4px; }

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-45621422 .card-name { font-size: 23px; }
}

@media (max-width: 640px)
{
	.e-45621422 .card-name { font-size: 21px; }
	.e-45621422 .arrow { width: 42px; height: 42px; }
}

/* Na dodir (bez hovera) nema uvećanja — kartica ostaje ravna. */

@media (hover: none)
{
	.e-45621422 .card:hover
	{
		transform: none;
		box-shadow: 0 12px 30px rgba(20, 18, 16, 0.20);
	}

	.e-45621422 .card:hover > .card-image
	{
		transform: none;
	}
}

/* ===== END: section-destination-slider-1 ===== */
/* ===== BEGIN: section-destination-tiles-1 ===== */

.e-4af5c26c
{
	display: block;
	width: 100%;
}

.e-4af5c26c > .holder
{
	width: 100%;
}

/* ===== RED OD 4 KARTICE ===== */

.e-4af5c26c .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
}

/* ===== KARTICA (uspravna, full-cover slika, klikabilna) ===== */

.e-4af5c26c .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(15, 40, 80, 0.14);
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-4af5c26c .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 40, 80, 0.22);
}

.e-4af5c26c .card > .card-image
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-4af5c26c .card:hover > .card-image
{
	transform: scale(1.06);
}

.e-4af5c26c .card > .card-shade
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 68%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0));
	transition: opacity var(--ot-transition);
}

.e-4af5c26c .card:hover > .card-shade
{
	opacity: 0.92;
}

/* ===== DONJI BLOK (levo poravnat naziv + opis, belim) ===== */

.e-4af5c26c .card > .card-bottom
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 18px;
}

.e-4af5c26c .card-bottom > .card-name
{
	color: #ffffff;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.2;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.e-4af5c26c .card-bottom > .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: #ffffff;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.4;
	opacity: 0.9;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 1024px)
{
	.e-4af5c26c .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-4af5c26c .grid
	{
		grid-template-columns: repeat(1, 1fr);
	}
}

/* ===== END: section-destination-tiles-1 ===== */
/* ===== BEGIN: section-destinations-1 (novi slajder destinacija) ===== */

.e-60c2bff9
{
	display: block;
	width: 100%;
}

.e-60c2bff9 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== VIEWPORT + TRACK ===== */

.e-60c2bff9 .viewport
{
	position: relative;
	overflow: hidden;
}

.e-60c2bff9 .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CARD ===== */

.e-60c2bff9 .card
{
	position: relative;
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	aspect-ratio: 3 / 4;
	padding: 0 8px;
	box-sizing: border-box;
	text-decoration: none;
	background-clip: content-box;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-60c2bff9 .card > .card-overlay
{
	position: absolute;
	inset: 0 8px;
	border-radius: var(--ot-radius-l);
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.05) 30%, rgba(20, 18, 16, 0.72) 100%);
	transition: background 320ms ease;
}

.e-60c2bff9 .card:hover > .card-overlay
{
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.15) 20%, rgba(20, 18, 16, 0.82) 100%);
}

.e-60c2bff9 .card > .card-country
{
	position: absolute;
	left: 24px;
	bottom: 22px;
	z-index: 1;
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.1;
	color: white;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}

.e-60c2bff9 .card > .card-badge
{
	position: absolute;
	top: 22px;
	right: 24px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	padding: 7px 13px;
	background: rgba(255, 255, 255, 0.92);
	backdrop-filter: blur(10px) saturate(160%);
	-webkit-backdrop-filter: blur(10px) saturate(160%);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
}

/* ===== ARROWS ===== */

.e-60c2bff9 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.92);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.16);
	transition: background 240ms, color 240ms;
}

.e-60c2bff9 .arrow:hover
{
	background: var(--ot-text-1);
	color: white;
}

.e-60c2bff9 .arrow-prev { left: 18px; }
.e-60c2bff9 .arrow-next { right: 18px; }

/* ===== DOTS ===== */

.e-60c2bff9 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 22px;
}

.e-60c2bff9 .dots > .dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	background: var(--ot-bg-3-border);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-60c2bff9 .dots > .dot.active
{
	width: 28px;
	background: var(--ot-brand);
	border-radius: 100px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 640px)
{
	.e-60c2bff9 .card > .card-country { font-size: 20px; left: 20px; bottom: 18px; }
	.e-60c2bff9 .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-destinations-1 ===== */
/* ===== BEGIN: section-destinations-carousel-1 ===== */

.e-2437bfee
{
	--dc-navy: #16294d;
	--dc-arrow: #1f7a66;

	display: block;
}

.e-2437bfee > .holder
{
	outline: none;
}

/* Zaglavlje — naslov i pill dugme jedno uz drugo, ne razvuceni do ivica. */

.e-2437bfee > .holder > .top
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	margin-bottom: 26px;
}

.e-2437bfee > .holder > .top > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--dc-navy);
}

.e-2437bfee > .holder > .top > .all
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 42px;
	padding: 0 20px;
	border: 1.5px solid var(--dc-navy);
	border-radius: 100px;
	background: #ffffff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--dc-navy);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-2437bfee > .holder > .top > .all:hover
{
	background: var(--dc-navy);
	color: #ffffff;
}

.e-2437bfee > .holder > .top > .all > i
{
	font-size: 18px;
	transition: transform var(--ot-transition);
}

.e-2437bfee > .holder > .top > .all:hover > i
{
	transform: translateX(3px);
}

/* Karusel — red kartica ide do ivica kontejnera, poslednja vidljiva ostaje odsecena. */

.e-2437bfee > .holder > .stage
{
	position: relative;
}

/* Negativna margina ponistava spoljni padding celija pa se ivice kartica poklapaju sa naslovom. */

.e-2437bfee > .holder > .stage > .viewport
{
	overflow: hidden;
	margin: -6px;
}

.e-2437bfee > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	gap: 0;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 6.5));
	max-width: calc(100% / var(--per-view, 6.5));
	padding: 6px;
	box-sizing: border-box;
}

/* Kartica — cela je jedna uspravna fotografija, sve iste sirine i visine. */

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 23, 42, 0.18);
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card > .shade
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 45%, rgba(6, 10, 20, 0.72) 100%);
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card > .name
{
	position: absolute;
	left: 14px;
	right: 58px;
	bottom: 16px;
	z-index: 2;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card > .open
{
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
	transition: transform 260ms ease;
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card > .open > i
{
	font-size: 19px;
	color: var(--dc-arrow);
}

.e-2437bfee > .holder > .stage > .viewport > .track > .cell > .card:hover > .open
{
	transform: scale(1.1);
}

/* Strelice za listanje — ISPOD karusela, poravnate LEVO, obican tok a ne apsolutno pozicioniranje. */

.e-2437bfee > .holder > .nav
{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	margin-top: 22px;
}

.e-2437bfee > .holder > .nav > .arrow
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	background: #ffffff;
	cursor: pointer;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-2437bfee > .holder > .nav > .arrow > i
{
	font-size: 20px;
	color: var(--dc-navy);
}

.e-2437bfee > .holder > .nav > .arrow:hover
{
	background: var(--ot-bg-2);
	border-color: var(--dc-navy);
}

.e-2437bfee > .holder > .nav > .arrow.is-off
{
	opacity: 0.35;
	cursor: default;
}

.e-2437bfee > .holder > .nav > .arrow.is-off:hover
{
	background: #ffffff;
	border-color: var(--ot-bg-3-border);
}

@media (max-width: 1024px)
{
	.e-2437bfee > .holder > .top > .title
	{
		font-size: 28px;
	}

	.e-2437bfee > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 3.4));
		max-width: calc(100% / var(--per-view, 3.4));
	}
}

@media (max-width: 640px)
{
	.e-2437bfee > .holder > .top
	{
		gap: 12px;
		margin-bottom: 20px;
	}

	.e-2437bfee > .holder > .top > .title
	{
		font-size: 24px;
	}

	.e-2437bfee > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1.4));
		max-width: calc(100% / var(--per-view, 1.4));
	}
}

/* ===== END: section-destinations-carousel-1 ===== */
/* ===== BEGIN: section-destinations-overview-1 ===== */

.e-1ab1a9c7
{
	display: block;
	width: 100%;
	--do-dark: #24303a;
	--do-teal: #4e9a96;
	--do-orange: #f57c00;
}

/* Pozadina sekcije (krem) dolazi iz section style.background full-bleed omotaca, ne odavde. */

.e-1ab1a9c7 > .holder
{
	width: 100%;
}

/* ===== HEADER (levo poravnat krupan tamni sans-serif naslov) ===== */

.e-1ab1a9c7 > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Sites app globalno postavlja serif na sve h1-h6, pa se sans-serif mora eksplicitno vratiti. */

.e-1ab1a9c7 .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--do-dark);
}

/* ===== GRID (jedan red: tri kartice jednake sirine i visine) ===== */

.e-1ab1a9c7 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (vizual gore, tekst ispod, dugme prikaceno za dno) ===== */

.e-1ab1a9c7 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(36, 48, 58, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-1ab1a9c7 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(36, 48, 58, 0.16);
}

/* Ista pravila vaze i za mapu i za fotografije, pa su gornji vizuali identicne visine. */

.e-1ab1a9c7 .card-media
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.e-1ab1a9c7 .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-1ab1a9c7 .card:hover .card-image
{
	transform: scale(1.04);
}

/* ===== MAPA (jednobojna tirkizna povrsina + linije iz gradijenata + beli pin) ===== */

.e-1ab1a9c7 .card-media.is-map
{
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--do-teal);
}

.e-1ab1a9c7 .map-lines
{
	position: absolute;
	inset: 0;
	display: block;
	opacity: 0.35;
	background-image:
		repeating-linear-gradient(115deg, rgba(255, 255, 255, 0) 0 46px, rgba(255, 255, 255, 0.5) 46px 48px),
		repeating-linear-gradient(28deg, rgba(255, 255, 255, 0) 0 62px, rgba(255, 255, 255, 0.35) 62px 64px),
		repeating-linear-gradient(0deg, rgba(255, 255, 255, 0) 0 84px, rgba(255, 255, 255, 0.22) 84px 85px);
}

.e-1ab1a9c7 .map-pin
{
	position: relative;
	font-size: 72px;
	line-height: 1;
	color: #ffffff;
	text-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
}

/* ===== CARD BODY (naziv, opis, prazan prostor, link, dugme na dnu) ===== */

.e-1ab1a9c7 .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px 20px 20px;
}

.e-1ab1a9c7 .card-body > .card-name
{
	font-family: var(--ot-font-primary);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--do-dark);
}

.e-1ab1a9c7 .card-body > .card-desc
{
	margin-top: 8px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-3);
}

/* Prazan prostor upija razliku u duzini opisa pa sva dugmad ostaju u istoj liniji. */

.e-1ab1a9c7 .card-body > .spacer
{
	flex: 1;
	min-height: 14px;
}

/* Mapa kartica nema "X hotela" link, ali prazan span drzi isti prostor da bi dugmad ostala poravnata. */

.e-1ab1a9c7 .card-body > .card-link
{
	display: block;
	min-height: 20px;
	margin-bottom: 14px;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
	text-decoration: none;
	color: var(--do-orange);
	transition: color var(--ot-transition);
}

.e-1ab1a9c7 .card-body > .card-link.is-empty
{
	pointer-events: none;
}

.e-1ab1a9c7 .card-body > .card-link:hover
{
	color: #d96a00;
	text-decoration: underline;
}

.e-1ab1a9c7 .card-body > .card-button
{
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	justify-content: center;
	padding: 11px 22px;
	border-radius: 999px;
	background: var(--do-teal);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: #ffffff;
	transition: background var(--ot-transition);
}

.e-1ab1a9c7 .card-body > .card-button:hover
{
	background: #427f7c;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

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

	.e-1ab1a9c7 .title
	{
		font-size: 30px;
	}
}

@media (max-width: 720px)
{
	.e-1ab1a9c7 .grid
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px)
{
	.e-1ab1a9c7 .card-body
	{
		padding: 16px 16px 18px;
	}

	.e-1ab1a9c7 .card-body > .card-name
	{
		font-size: 18px;
	}

	.e-1ab1a9c7 .map-pin
	{
		font-size: 60px;
	}
}

/* ===== END: section-destinations-overview-1 ===== */
/* ===== BEGIN: section-early-booking-1 ===== */

.e-6730beb
{
	display: block;
	width: 100%;
}

.e-6730beb > .holder
{
	width: 100%;
}

/* ===== GRID (tri jednake kolone, jednake visine kartica) ===== */

.e-6730beb > .holder > .grid
{
	display: grid;
	align-items: stretch;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (bela kartica, sadrzaj u koloni da cena moze na dno) ===== */

.e-6730beb > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-6730beb > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== VISUAL (velika fotografija, iste proporcije na sve tri kartice) ===== */

.e-6730beb > .holder > .grid > .card > .visual
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 11;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-6730beb > .holder > .grid > .card:hover > .visual
{
	transform: scale(1.03);
}

/* Blagi tamni preliv samo u gornjem levom uglu da beli naslov ostane citljiv. */

.e-6730beb > .holder > .grid > .card > .visual::before
{
	position: absolute;
	content: '';
	inset: 0;
	background: linear-gradient(to bottom right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0) 62%);
}

.e-6730beb > .holder > .grid > .card > .visual > .visual-title
{
	position: absolute;
	top: 18px;
	left: 18px;
	max-width: 62%;
	font-family: var(--ot-font-primary);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: #ffffff;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
}

/* ===== INSET (umetnuta mala slika u belom okviru, dole desno) ===== */

.e-6730beb > .holder > .grid > .card > .visual > .inset
{
	position: absolute;
	right: 14px;
	bottom: 14px;
	display: block;
	width: 132px;
	padding: 6px 6px 7px 6px;
	border-radius: 6px;
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

.e-6730beb > .holder > .grid > .card > .visual > .inset > .inset-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 4px;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.e-6730beb > .holder > .grid > .card > .visual > .inset > .inset-note
{
	display: block;
	margin-top: 5px;
	font-family: var(--ot-font-primary);
	font-size: 10.5px;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	color: #24303a;
}

/* ===== BODY (naslov, uslovi i cena) ===== */

.e-6730beb > .holder > .grid > .card > .body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px 20px 20px 20px;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-6730beb > .holder > .grid > .card > .body > .card-name
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
	color: #24303a;
}

/* ===== BULLETS (siva tacka + tekst, delovi naglaseni) ===== */

.e-6730beb > .holder > .grid > .card > .body > .bullets
{
	display: flex;
	flex-direction: column;
	margin: 14px 0 0 0;
	padding: 0;
	gap: 10px;
	list-style: none;
}

.e-6730beb > .holder > .grid > .card > .body > .bullets > .bullet
{
	position: relative;
	padding-left: 16px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.55;
	color: var(--ot-text-2);
}

.e-6730beb > .holder > .grid > .card > .body > .bullets > .bullet::before
{
	position: absolute;
	top: 0.62em;
	left: 0;
	width: 5px;
	height: 5px;
	content: '';
	border-radius: 50%;
	background: var(--ot-text-3);
}

.e-6730beb > .holder > .grid > .card > .body > .bullets > .bullet > .is-lead
{
	font-weight: 700;
	color: #24303a;
}

/* Razmak ispred crvenog naglaska da se fragmenti citaju kao jedna recenica. */

.e-6730beb > .holder > .grid > .card > .body > .bullets > .bullet > .is-accent
{
	margin-left: 4px;
	font-weight: 700;
	color: #d8342b;
}

/* ===== PRICE (dole desno; margin-top auto drzi sve cene u istoj liniji) ===== */

.e-6730beb > .holder > .grid > .card > .body > .price
{
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	margin-top: auto;
	padding-top: 16px;
	gap: 6px;
}

.e-6730beb > .holder > .grid > .card > .body > .price > .price-pre,
.e-6730beb > .holder > .grid > .card > .body > .price > .price-unit
{
	font-family: var(--ot-font-primary);
	font-size: 12.5px;
	font-weight: 500;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-6730beb > .holder > .grid > .card > .body > .price > .price-value
{
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	color: #24303a;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6730beb > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-6730beb > .holder > .grid > .card > .visual > .visual-title
	{
		font-size: 20px;
	}
}

@media (max-width: 640px)
{
	.e-6730beb > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-6730beb > .holder > .grid > .card > .visual > .visual-title
	{
		font-size: 18px;
	}

	.e-6730beb > .holder > .grid > .card > .visual > .inset
	{
		width: 112px;
	}

	.e-6730beb > .holder > .grid > .card > .body > .price > .price-value
	{
		font-size: 22px;
	}
}

/* ===== END: section-early-booking-1 ===== */
/* ===== BEGIN: section-experience-slider-1 ===== */

.e-1c7cc776
{
	display: block;
	width: 100%;
}

.e-1c7cc776 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEAD (tabs left + outline button right) ===== */

.e-1c7cc776 .head
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 20px;
	padding: 0 8px;
}

.e-1c7cc776 .tabs
{
	display: flex;
	align-items: flex-end;
	gap: 26px;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
}

.e-1c7cc776 .tabs::-webkit-scrollbar
{
	display: none;
}

.e-1c7cc776 .tab
{
	position: relative;
	flex: 0 0 auto;
	padding: 0 0 12px;
	background: transparent;
	border: 0;
	cursor: pointer;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.2;
	white-space: nowrap;
	color: var(--ot-text-3);
	transition: color 200ms ease;
}

.e-1c7cc776 .tab:hover
{
	color: var(--ot-text-2);
}

.e-1c7cc776 .tab > .tab-text
{
	position: relative;
	display: inline-block;
	padding-bottom: 12px;
}

.e-1c7cc776 .tab.active
{
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-1c7cc776 .tab.active > .tab-text::after
{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	border-radius: 100px;
	background: var(--ot-red);
}

.e-1c7cc776 .head-button
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	padding: 11px 22px;
	background: transparent;
	border: 1px solid var(--ot-text-1);
	border-radius: 100px;
	text-decoration: none;
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-1);
	transition: background 200ms ease, color 200ms ease;
}

.e-1c7cc776 .head-button:hover
{
	background: var(--ot-text-1);
	color: white;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-1c7cc776 .stage
{
	position: relative;
}

.e-1c7cc776 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 34px;
}

.e-1c7cc776 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (white, image on top, equal height) ===== */

.e-1c7cc776 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4.2));
	max-width: calc(100% / var(--per-view, 4.2));
	display: flex;
	padding: 6px 8px;
	box-sizing: border-box;
}

.e-1c7cc776 .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	background: white;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.12);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-1c7cc776 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.20);
}

/* ===== CARD IMAGE (top, title centered over upper half) ===== */

.e-1c7cc776 .card > .card-image
{
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
}

.e-1c7cc776 .card > .card-image > .card-shade
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to bottom, rgba(10, 11, 14, 0.62) 0%, rgba(10, 11, 14, 0.22) 40%, rgba(10, 11, 14, 0) 70%),
		linear-gradient(to top, rgba(10, 11, 14, 0.34) 0%, rgba(10, 11, 14, 0) 40%);
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-1c7cc776 .card:hover > .card-image
{
	background-size: 108%;
}

.e-1c7cc776 .card-title
{
	position: relative;
	z-index: 1;
	margin: 26px 22px 0;
	text-align: center;
	font-size: 19px;
	font-weight: 800;
	line-height: 1.24;
	letter-spacing: 0.005em;
	color: white;
	text-shadow: 0 2px 10px rgba(10, 11, 14, 0.35);
}

/* ===== CARD BODY (meta, name, spacer, divider, price — bottom pinned) ===== */

.e-1c7cc776 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 16px 18px 18px;
}

.e-1c7cc776 .card-meta
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.e-1c7cc776 .card-duration
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-1c7cc776 .card-badge
{
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 100px;
	background: var(--ot-text-1);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	color: white;
}

.e-1c7cc776 .card-name
{
	font-size: 17px;
	font-weight: 600;
	line-height: 1.28;
	letter-spacing: 0.005em;
	color: var(--ot-text-1);
}

.e-1c7cc776 .card-spacer
{
	flex: 1 1 auto;
	min-height: 10px;
}

.e-1c7cc776 .card-divider
{
	height: 1px;
	background: var(--ot-bg-3);
}

.e-1c7cc776 .card-price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 3px;
	margin-top: 4px;
	text-align: right;
}

.e-1c7cc776 .price-row
{
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-end;
	gap: 6px;
}

.e-1c7cc776 .price-label
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-1c7cc776 .price-old
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-1c7cc776 .price-new
{
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

.e-1c7cc776 .price-note
{
	font-size: 11px;
	color: var(--ot-text-3);
}

/* ===== ARROWS (circular, over the edges) ===== */

.e-1c7cc776 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: rgba(28, 31, 38, 0.92);
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 10px 26px rgba(20, 18, 16, 0.24);
	transition: background 240ms ease, transform 240ms ease;
}

.e-1c7cc776 .arrow-prev
{
	left: 0;
}

.e-1c7cc776 .arrow-next
{
	right: 0;
}

.e-1c7cc776 .arrow:hover
{
	background: black;
	transform: translateY(-50%) scale(1.06);
}

.e-1c7cc776 .arrow > i
{
	font-size: 21px;
}

/* ===== PROGRESS BAR ===== */

.e-1c7cc776 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 24px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-1c7cc776 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #f5c518;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-1c7cc776 .viewport { padding: 12px 26px; }
	.e-1c7cc776 .tab { font-size: 16px; }
	.e-1c7cc776 .card-title { font-size: 18px; }
}

@media (max-width: 640px)
{
	.e-1c7cc776 .head { flex-wrap: wrap; align-items: stretch; }
	.e-1c7cc776 .tabs { gap: 18px; }
	.e-1c7cc776 .head-button { width: 100%; justify-content: center; }
	.e-1c7cc776 .viewport { padding: 10px 16px; }
	.e-1c7cc776 .cell { padding: 6px; }
	.e-1c7cc776 .arrow { width: 40px; height: 40px; }
	.e-1c7cc776 .progress { max-width: 78%; }
}

/* ===== END: section-experience-slider-1 ===== */
/* ===== BEGIN: section-explore-concepts-1 ===== */

.e-3faa9419
{
	display: block;
	width: 100%;
	--exc-navy: #16294d;
	--exc-grey: #6b7280;
	--exc-blue: #2f6feb;
}

.e-3faa9419 > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamnoplavi sans naslov) ===== */

.e-3faa9419 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-3faa9419 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--exc-navy);
}

/* ===== MREZA (tri kartice po redu, sve iste visine u oba reda) ===== */

.e-3faa9419 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 20px;
}

/* ===== KARTICA (plocica levo, tekst desno, oboje vertikalno centrirano) ===== */

.e-3faa9419 .card
{
	display: flex;
	align-items: center;
	gap: 16px;
	height: 100%;
	padding: 18px 20px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 4px 14px rgba(16, 24, 40, 0.06);
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-3faa9419 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 12px 26px rgba(16, 24, 40, 0.14);
}

/* ===== PLOCICA (kvadrat sa tekstualnim logom ili glifom) ===== */

.e-3faa9419 .card > .card-tile
{
	display: flex;
	flex: 0 0 68px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 68px;
	height: 68px;
	padding: 0 4px;
	border-radius: 8px;
	font-family: var(--ot-font-primary);
	text-align: center;
	overflow: hidden;
}

.e-3faa9419 .card-tile > .tile-icon
{
	font-size: 30px;
	line-height: 1;
}

/* 12px drzi kratak brend u JEDNOM redu unutar kvadrata od 68px (izmereno: najduzi je 55px na 60px prostora). */

.e-3faa9419 .card-tile > .tile-logo
{
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.05em;
	line-height: 1.15;
	text-transform: uppercase;
}

.e-3faa9419 .card-tile > .tile-sub
{
	margin-top: 2px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.03em;
	line-height: 1.15;
}

/* ===== TEKST (naziv + kratak sivi opis) ===== */

.e-3faa9419 .card > .card-body
{
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.e-3faa9419 .card-body > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--exc-navy);
	transition: color var(--ot-transition);
}

.e-3faa9419 .card:hover .card-title
{
	color: var(--exc-blue);
}

.e-3faa9419 .card-body > .card-desc
{
	margin-top: 6px;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--exc-grey);
}

/* ===== DUGME (jedno, centrirano ispod cele mreze) ===== */

.e-3faa9419 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-3faa9419 .foot > .all
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 30px;
	border: 1.5px solid var(--exc-blue);
	border-radius: 100px;
	background: transparent;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--exc-blue);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-3faa9419 .foot > .all:hover
{
	background: var(--exc-blue);
	color: #ffffff;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

@media (max-width: 1024px)
{
	.e-3faa9419 .head > .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-3faa9419 .head > .title
	{
		font-size: 24px;
	}

	.e-3faa9419 .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-3faa9419 .card > .card-tile
	{
		flex: 0 0 60px;
		width: 60px;
		height: 60px;
	}

	.e-3faa9419 .card-tile > .tile-logo
	{
		font-size: 11px;
	}

	.e-3faa9419 .foot > .all
	{
		width: 100%;
	}
}

/* ===== END: section-explore-concepts-1 ===== */
/* ===== BEGIN: section-family-hotels-1 ===== */

.e-fc41dae
{
	display: block;
	width: 100%;
	--fh-dark: #24303a;
	--fh-coral: #fb5a56;
	--fh-orange: #f6a950;
	--fh-green: #2f7d4f;
}

/* Pozadina sekcije (krem) dolazi iz section style.background full-bleed omotaca, ne odavde. */

.e-fc41dae > .holder
{
	width: 100%;
}

/* ===== HEADER (levo poravnat krupan tamni sans-serif naslov) ===== */

.e-fc41dae > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Sites app globalno postavlja serif na sve h1-h6, pa se sans-serif mora eksplicitno vratiti. */

.e-fc41dae .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--fh-dark);
}

/* ===== GRID (jedan red: tri kartice jednake sirine i visine) ===== */

.e-fc41dae .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (slika gore, detalji ispod, dugme prikaceno za dno) ===== */

.e-fc41dae .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(36, 48, 58, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-fc41dae .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(36, 48, 58, 0.16);
}

.e-fc41dae .card-media
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

.e-fc41dae .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-fc41dae .card:hover .card-image
{
	transform: scale(1.04);
}

/* Nalepnica pod blagim uglom preko gornjeg levog ugla slike. */

.e-fc41dae .card-sticker
{
	position: absolute;
	top: 16px;
	left: 14px;
	padding: 6px 12px;
	border-radius: 4px;
	background: var(--fh-coral);
	transform: rotate(-5deg);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #ffffff;
}

/* Traka brenda preko celog vrha slike (alternativa nalepnici). */

.e-fc41dae .card-strip
{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 8px 12px;
	background: var(--fh-green);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	color: #ffffff;
}

/* ===== CARD BODY (naziv, lokacija, ocene, bullet lista, separator, dugme) ===== */

.e-fc41dae .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px 20px 20px;
}

.e-fc41dae .card-name
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--fh-dark);
}

.e-fc41dae .card-location
{
	margin-top: 4px;
	font-size: 13px;
	line-height: 1.4;
	color: var(--ot-text-3);
}

.e-fc41dae .card-rating
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;
}

.e-fc41dae .sun
{
	font-size: 18px;
	line-height: 1;
	color: var(--fh-orange);
}

.e-fc41dae .sun + .sun
{
	margin-left: -6px;
}

.e-fc41dae .score
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	color: var(--fh-dark);
}

.e-fc41dae .score i
{
	font-size: 16px;
	line-height: 1;
	color: var(--ot-text-3);
}

/* ===== BULLET LISTA (siva tacka + tekst koji sme da se prelomi) ===== */

.e-fc41dae .card-list
{
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-fc41dae .card-list li
{
	position: relative;
	padding-left: 16px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-fc41dae .card-list li::before
{
	content: '';
	position: absolute;
	top: 0.55em;
	left: 2px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--ot-text-3);
}

/* Prazan prostor upija razliku u broju bullet-a pa separator i dugme ostaju u istoj liniji. */

.e-fc41dae .spacer
{
	flex: 1;
	min-height: 16px;
}

.e-fc41dae .card-line
{
	display: block;
	height: 1px;
	margin: 16px 0 14px;
	background: var(--ot-bg-2-border);
}

.e-fc41dae .card-button
{
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	justify-content: center;
	padding: 11px 22px;
	border-radius: 999px;
	background: var(--fh-orange);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: #ffffff;
	transition: background var(--ot-transition);
}

.e-fc41dae .card-button:hover
{
	background: #e2933b;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

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

	.e-fc41dae .title
	{
		font-size: 30px;
	}
}

@media (max-width: 720px)
{
	.e-fc41dae .grid
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px)
{
	.e-fc41dae .card-body
	{
		padding: 16px 16px 18px;
	}

	.e-fc41dae .card-name
	{
		font-size: 18px;
	}
}

/* ===== END: section-family-hotels-1 ===== */
/* ===== BEGIN: section-faq-1 ===== */

.e-31c1ebfc
{
	display: block;
	width: 100%;
}

.e-31c1ebfc > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold dark-blue title) ===== */

.e-31c1ebfc > .holder > .head
{
	margin-bottom: 28px;
}

.e-31c1ebfc .head > .title
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-brand);
}

/* ===== GRID (two columns, independent heights) ===== */

.e-31c1ebfc .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: start;
	gap: 16px;
}

/* ===== BAR (rounded, very light grey/blue, subtle hover) ===== */

.e-31c1ebfc .bar
{
	border-radius: var(--ot-radius-l);
	background: #f4f6fb;
	transition: background 240ms ease, box-shadow 240ms ease;
}

.e-31c1ebfc .bar:hover
{
	background: #eaeef8;
}

/* ===== QUESTION (bold dark question left, grey chevron right) ===== */

.e-31c1ebfc .q
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	margin: 0;
	padding: 18px 20px;
	border: none;
	background: transparent;
	text-align: left;
	cursor: pointer;
	font: inherit;
}

.e-31c1ebfc .q > .q-text
{
	font-weight: 700;
	font-size: 16px;
	line-height: 1.35;
	color: var(--ot-text-1);
}

.e-31c1ebfc .q > .chev
{
	flex: none;
	font-size: 24px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-31c1ebfc .bar.open .q > .chev
{
	transform: rotate(180deg);
}

/* ===== ANSWER (smooth expand via grid-template-rows) ===== */

.e-31c1ebfc .answer-wrap
{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 300ms ease;
}

.e-31c1ebfc .bar.open .answer-wrap
{
	grid-template-rows: 1fr;
}

.e-31c1ebfc .answer
{
	overflow: hidden;
}

.e-31c1ebfc .answer-text
{
	margin: 0;
	padding: 0 20px 20px;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE (single column on mobile) ===== */

@media (max-width: 768px)
{
	.e-31c1ebfc .grid
	{
		grid-template-columns: 1fr;
	}

	.e-31c1ebfc .head > .title
	{
		font-size: 24px;
	}
}

/* ===== END: section-faq-1 ===== */
/* ===== BEGIN: section-faq-2 ===== */

.e-31c1ebfd
{
	display: block;
	width: 100%;
}

.e-31c1ebfd > .holder
{
	width: 100%;
	max-width: 820px;
	margin: 0 auto;
}

/* ===== HEADER (centered bold dark-blue title) ===== */

.e-31c1ebfd > .holder > .head
{
	margin-bottom: 28px;
}

.e-31c1ebfd .head > .title
{
	margin: 0;
	text-align: center;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-brand);
}

/* ===== LIST (single full-width column) ===== */

.e-31c1ebfd .list
{
	display: block;
	width: 100%;
}

/* ===== GROUP SUBTITLE (left-aligned bold dark-blue) ===== */

.e-31c1ebfd .group
{
	margin: 32px 0 4px;
	text-align: left;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: -0.01em;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== ROW (borderless, only a thin light divider line) ===== */

.e-31c1ebfd .row
{
	border-bottom: 1px solid #e6ebf5;
}

/* ===== QUESTION (blue medium-weight left, lighter-blue chevron right) ===== */

.e-31c1ebfd .q
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	margin: 0;
	padding: 18px 2px;
	border: none;
	background: transparent;
	text-align: left;
	cursor: pointer;
	font: inherit;
}

.e-31c1ebfd .q > .q-text
{
	font-weight: 500;
	font-size: 16px;
	line-height: 1.4;
	color: var(--ot-brand);
	transition: opacity 200ms ease;
}

.e-31c1ebfd .q:hover > .q-text
{
	opacity: 0.7;
}

.e-31c1ebfd .q > .chev
{
	flex: none;
	font-size: 24px;
	line-height: 1;
	color: var(--ot-brand);
	opacity: 0.45;
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-31c1ebfd .row.open .q > .chev
{
	transform: rotate(180deg);
}

/* ===== ANSWER (smooth expand via grid-template-rows) ===== */

.e-31c1ebfd .answer-wrap
{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 300ms ease;
}

.e-31c1ebfd .row.open .answer-wrap
{
	grid-template-rows: 1fr;
}

.e-31c1ebfd .answer
{
	overflow: hidden;
}

.e-31c1ebfd .answer-text
{
	margin: 0;
	padding: 0 2px 20px;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE (stays one column, smaller title on mobile) ===== */

@media (max-width: 768px)
{
	.e-31c1ebfd .head > .title
	{
		font-size: 26px;
	}

	.e-31c1ebfd .group
	{
		font-size: 18px;
	}
}

/* ===== END: section-faq-2 ===== */
/* ===== BEGIN: section-faq-3 ===== */

.e-31c1ebfe
{
	display: block;
	width: 100%;
}

.e-31c1ebfe > .holder
{
	width: 100%;
}

/* ===== HEADING (left-aligned, bold, dark, larger) ===== */

.e-31c1ebfe > .holder > .title
{
	margin: 0 0 28px;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== GRID (3 equal cards per row, 3x3) ===== */

.e-31c1ebfe .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height, clean look) ===== */

.e-31c1ebfe .card
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	height: 100%;
	padding: 36px 20px;
	text-align: center;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	box-shadow: none;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, border-color 320ms ease;
}

.e-31c1ebfe .card:hover
{
	transform: translateY(-4px);
	border-color: var(--ot-brand);
	box-shadow: 0 12px 28px rgba(20, 18, 16, 0.10);
}

/* ===== CARD ICON (large outline glyph, colored per item) ===== */

.e-31c1ebfe .card > .card-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.e-31c1ebfe .card-icon > i
{
	font-size: 46px;
	line-height: 1;
	font-variation-settings: 'FILL' 0, 'wght' 300;
}

/* ===== CARD NAME (bold, dark, smaller, centered) ===== */

.e-31c1ebfe .card > .card-name
{
	font-weight: 700;
	font-size: 15px;
	line-height: 1.4;
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE (2 columns on tablet and mobile, equal height) ===== */

@media (max-width: 1024px)
{
	.e-31c1ebfe .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-31c1ebfe > .holder > .title
	{
		font-size: 26px;
	}

	.e-31c1ebfe .grid
	{
		gap: 16px;
	}

	.e-31c1ebfe .card
	{
		padding: 28px 16px;
	}
}

/* ===== END: section-faq-3 ===== */
/* ===== BEGIN: section-favorite-hotels-1 ===== */

.e-3370a5f6
{
	display: block;
	width: 100%;

	--fh-purple: #3b1f5c;
	--fh-blue: #2f6feb;
	--fh-red: #e4002b;
	--fh-violet: #7b1fa2;
	--fh-violet-hover: #6a1a8d;
	--fh-orange: #f5901e;
	--fh-grey: #6b7280;
	--fh-dark: #24303a;
}

/* ===== NASLOV ===== */

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-3370a5f6 .head
{
	margin: 0 0 24px;
}

.e-3370a5f6 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--fh-purple);
}

/* ===== MREZA ===== */

.e-3370a5f6 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 24px;
}

.e-3370a5f6 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-3370a5f6 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== FOTOGRAFIJA SA OPCIONIM CRVENIM BADZOM ===== */

.e-3370a5f6 .card > .card-media
{
	position: relative;
	display: block;
	height: 200px;
	overflow: hidden;
}

.e-3370a5f6 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-3370a5f6 .card:hover .card-image
{
	transform: scale(1.06);
}

.e-3370a5f6 .card-media > .card-badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	display: flex;
	align-items: center;
	gap: 6px;
	max-width: calc(100% - 28px);
	padding: 6px 12px;
	border-radius: 100px;
	background: var(--fh-red);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

.e-3370a5f6 .card-badge > .badge-icon
{
	flex: 0 0 auto;
	font-family: 'Material Symbols Rounded';
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
}

/* ===== TELO KARTICE ===== */

.e-3370a5f6 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: stretch;
	padding: 18px 20px 20px;
}

.e-3370a5f6 .card-body > .card-info
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-3370a5f6 .card-info > .card-name-row
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
}

.e-3370a5f6 .card-name-row > .card-name
{
	font-size: 19px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--fh-blue);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-3370a5f6 .card-name-row > .card-name:hover
{
	color: var(--fh-purple);
	text-decoration: underline;
}

.e-3370a5f6 .card-name-row > .card-stars
{
	font-size: 14px;
	line-height: 1;
	letter-spacing: 1px;
	color: var(--fh-orange);
	white-space: nowrap;
}

.e-3370a5f6 .card-info > .card-location
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--fh-grey);
}

/* Prostor iznad cene se rasteze da sva tri dugmeta stoje u istoj liniji bez obzira na badz i liniju ustede. */

.e-3370a5f6 .card-body > .spacer
{
	flex: 1;
	min-height: 18px;
}

/* ===== CENA (desno poravnata, iznad dugmeta) ===== */

.e-3370a5f6 .card-body > .card-price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	text-align: right;
}

.e-3370a5f6 .card-price > .price-nights
{
	display: flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--fh-grey);
}

.e-3370a5f6 .price-nights > .nights-icon
{
	font-family: 'Material Symbols Rounded';
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
}

.e-3370a5f6 .card-price > .price-prefix
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--fh-grey);
}

.e-3370a5f6 .card-price > .price-value
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--fh-dark);
}

.e-3370a5f6 .card-price > .price-value.is-promo
{
	color: var(--fh-red);
}

.e-3370a5f6 .card-price > .price-unit
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--fh-grey);
}

.e-3370a5f6 .card-price > .price-note
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
	margin-top: 6px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--fh-red);
}

.e-3370a5f6 .price-note > .note-icon
{
	flex: 0 0 auto;
	font-family: 'Material Symbols Rounded';
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 1;
}

/* ===== DUGME (puna sirina, prikovano na dno) ===== */

.e-3370a5f6 .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin-top: 16px;
	padding: 13px 20px;
	border-radius: 8px;
	background: var(--fh-violet);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-3370a5f6 .card-body > .card-button:hover
{
	background: var(--fh-violet-hover);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-3370a5f6 .head > .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-3370a5f6 .head > .title
	{
		font-size: 24px;
	}

	.e-3370a5f6 .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-3370a5f6 .card > .card-media
	{
		height: 190px;
	}

	.e-3370a5f6 .card-name-row > .card-name
	{
		font-size: 18px;
	}
}

/* ===== END: section-favorite-hotels-1 ===== */
/* ===== BEGIN: section-feature-slider-1 ===== */

.e-6f62513a
{
	display: block;
	width: 100%;
}

.e-6f62513a > .holder
{
	width: 100%;
}

/* ===== LAYOUT: tekst levo (uzi) + slika-slajder desno (siri), vertikalno centrirani ===== */

.e-6f62513a .layout
{
	display: grid;
	grid-template-columns: minmax(300px, 460px) 1fr;
	gap: 48px;
	align-items: center;
}

/* ===== INTRO (leva zona) ===== */

.e-6f62513a .intro > .title
{
	margin: 0;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 40px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

.e-6f62513a .intro > .desc
{
	margin: 22px 0 0;
	font-size: 16px;
	line-height: 1.75;
	color: var(--ot-text-2);
}

.e-6f62513a .intro > .desc-second
{
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.75;
	color: var(--ot-text-2);
}

.e-6f62513a .intro b,
.e-6f62513a .intro strong
{
	font-weight: 700;
	color: var(--ot-text-1);
}

/* ===== OUTLINE PILL DUGME (providno, tanak narandzasti okvir) ===== */

.e-6f62513a .intro > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 26px;
	padding: 12px 24px;
	background: transparent;
	border: 1.5px solid var(--ot-orange);
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-text-1);
	text-decoration: none;
	transition: background 240ms ease, color 240ms ease, border-color 240ms ease;
}

.e-6f62513a .intro > .button:hover
{
	background: var(--ot-orange);
	border-color: var(--ot-orange);
	color: white;
}

/* ===== STAGE / VIEWPORT / TRACK (desna zona) ===== */

.e-6f62513a .stage
{
	position: relative;
	outline: none;
}

.e-6f62513a .viewport
{
	position: relative;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 30px rgba(15, 40, 70, 0.12);
}

.e-6f62513a .track
{
	display: flex;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (tacno jedna slika u kadru) ===== */

.e-6f62513a .cell
{
	position: relative;
	flex: 0 0 100%;
	max-width: 100%;
	aspect-ratio: 16 / 11;
	box-sizing: border-box;
}

.e-6f62513a .cell > .slide-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== TAMNA PILL OZNAKA (donji levi ugao slike) ===== */

.e-6f62513a .cell > .slide-label
{
	position: absolute;
	left: 18px;
	bottom: 18px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	padding: 7px 14px;
	background: rgba(20, 14, 8, 0.92);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	color: white;
}

/* ===== KRUZNE STRELICE PREKO SLIKE (vertikalno centrirane, levo i desno) ===== */

.e-6f62513a .stage > .nav
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: blur(6px);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(15, 40, 70, 0.18);
	transition: background 240ms ease, transform 240ms ease;
}

.e-6f62513a .stage > .nav > i
{
	font-size: 24px;
	line-height: 1;
}

.e-6f62513a .stage > .nav:hover
{
	background: white;
}

.e-6f62513a .stage > .nav-prev
{
	left: 14px;
}

.e-6f62513a .stage > .nav-next
{
	right: 14px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6f62513a .layout
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-6f62513a .intro > .title { font-size: 32px; }
}

@media (max-width: 640px)
{
	.e-6f62513a .intro > .title { font-size: 27px; }
	.e-6f62513a .intro > .desc { font-size: 15px; }
	.e-6f62513a .intro > .desc-second { font-size: 15px; }

	.e-6f62513a .stage > .nav
	{
		width: 38px;
		height: 38px;
	}

	.e-6f62513a .stage > .nav > i { font-size: 20px; }
	.e-6f62513a .stage > .nav-prev { left: 10px; }
	.e-6f62513a .stage > .nav-next { right: 10px; }

	.e-6f62513a .cell > .slide-label
	{
		left: 12px;
		bottom: 12px;
		font-size: 12px;
	}
}

/* ===== END: section-feature-slider-1 ===== */
/* ===== BEGIN: section-featured-1 ===== */

.e-6916f6d0
{
	display: block;
	width: 100%;
}

.e-6916f6d0 > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned, bold, dark) ===== */

.e-6916f6d0 > .holder > .title
{
	margin: 0 0 20px;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== TABS (left aligned, active = light-blue pill with downward triangle) ===== */

.e-6916f6d0 > .holder > .tabs
{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 32px;
}

.e-6916f6d0 .tabs > .tab
{
	position: relative;
	flex: 0 0 auto;
	padding: 10px 18px;
	background: none;
	border: none;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease;
}

.e-6916f6d0 .tabs > .tab:hover
{
	background: var(--ot-bg-2);
}

.e-6916f6d0 .tabs > .tab.active
{
	background: var(--ot-brand);
	color: white;
}

.e-6916f6d0 .tabs > .tab.active:hover
{
	background: var(--ot-brand);
}

.e-6916f6d0 .tabs > .tab.active::after
{
	content: "";
	position: absolute;
	left: 50%;
	bottom: -7px;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid var(--ot-brand);
}

/* ===== GRID (3 columns x 2 rows, equal gap) ===== */

.e-6916f6d0 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-6916f6d0 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6916f6d0 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE + HEART ===== */

.e-6916f6d0 .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-6916f6d0 .card-image > .fav
{
	position: absolute;
	top: 12px;
	right: 12px;
	font-size: 26px;
	line-height: 1;
	color: white;
	cursor: pointer;
	font-variation-settings: 'FILL' 0, 'wght' 400;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.45));
	transition: transform 180ms ease;
}

.e-6916f6d0 .card-image > .fav:hover
{
	transform: scale(1.12);
}

.e-6916f6d0 .card-image > .fav.on
{
	font-variation-settings: 'FILL' 1, 'wght' 400;
}

/* ===== CARD BODY (flex column, footer pinned to bottom) ===== */

.e-6916f6d0 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	padding: 16px;
}

/* ===== TRIP NAME (bold, dark, 1-2 lines) ===== */

.e-6916f6d0 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== DURATION ROW (grey label + dark value) ===== */

.e-6916f6d0 .card-body > .row-duration
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.3;
}

.e-6916f6d0 .card-body > .row-duration > .row-value
{
	font-weight: 700;
	color: var(--ot-text-1);
}

/* ===== DATES ROW (grey label + blue-bordered pills) ===== */

.e-6916f6d0 .card-body > .row-dates
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 12px;
}

.e-6916f6d0 .card-body > .row-dates > .pills
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-6916f6d0 .pills > .pill
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 3px 9px;
	background: white;
	border: 1px solid var(--ot-brand);
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	color: var(--ot-brand);
}

/* ===== SHARED LABEL (grey small) ===== */

.e-6916f6d0 .row-label
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

/* ===== SPACER (grows to equalize card heights, pins footer to bottom) ===== */

.e-6916f6d0 .card-body > .spacer
{
	flex: 1;
	min-height: 12px;
}

/* ===== DIVIDER (thin light line) ===== */

.e-6916f6d0 .card-body > .divider
{
	height: 1px;
	margin-bottom: 14px;
	background: var(--ot-bg-3-border);
}

/* ===== FOOTER (transport left, price right, bottom aligned) ===== */

.e-6916f6d0 .card-body > .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
}

.e-6916f6d0 .footer > .transport
{
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.e-6916f6d0 .transport > .transport-circle
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	background: var(--ot-brand);
	border-radius: 999px;
}

.e-6916f6d0 .transport-circle > i
{
	font-size: 20px;
	line-height: 1;
	color: white;
}

.e-6916f6d0 .transport > .transport-text
{
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.2;
}

.e-6916f6d0 .transport-text > .transport-top
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-6916f6d0 .transport-text > .transport-type
{
	font-size: 13px;
	color: var(--ot-text-2);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-6916f6d0 .footer > .price-box
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	min-width: 0;
	text-align: right;
	line-height: 1.15;
}

.e-6916f6d0 .price-box > .price-label
{
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-6916f6d0 .price-box > .price
{
	font-size: 24px;
	font-weight: 800;
	color: var(--ot-orange);
}

/* ===== CTA BUTTON (left aligned, solid orange) ===== */

.e-6916f6d0 > .holder > .cta-wrap
{
	display: flex;
	justify-content: flex-start;
	margin-top: 32px;
}

.e-6916f6d0 .cta-wrap > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 26px;
	background: var(--ot-orange);
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-6916f6d0 .cta-wrap > .cta:hover
{
	background: var(--ot-orange-hover);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6916f6d0 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-6916f6d0 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-6916f6d0 > .holder > .title
	{
		font-size: 28px;
	}

	.e-6916f6d0 > .holder > .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* ===== END: section-featured-1 ===== */
/* ===== BEGIN: section-featured-trips (karusel tura sa mapa-karticom na kremastoj traci) ===== */

.e-66a3298f > .holder
{
	display: block;
	outline: none;
}

/* Kremasta traka ide od ivice do ivice; talasaste ivice su maska sa polukrugovima, bez SVG-a. */

.e-66a3298f > .holder > .band
{
	position: relative;
	background: #f5efe2;
	padding: 74px 0 66px;
	-webkit-mask-image: radial-gradient(74px 13px at 50% 0, rgba(0, 0, 0, 0) 99%, #000000 100%), radial-gradient(74px 13px at 50% 100%, rgba(0, 0, 0, 0) 99%, #000000 100%), linear-gradient(#000000, #000000);
	-webkit-mask-size: 148px 13px, 148px 13px, 100% calc(100% - 26px);
	-webkit-mask-position: top left, bottom left, center;
	-webkit-mask-repeat: repeat-x, repeat-x, no-repeat;
	mask-image: radial-gradient(74px 13px at 50% 0, rgba(0, 0, 0, 0) 99%, #000000 100%), radial-gradient(74px 13px at 50% 100%, rgba(0, 0, 0, 0) 99%, #000000 100%), linear-gradient(#000000, #000000);
	mask-size: 148px 13px, 148px 13px, 100% calc(100% - 26px);
	mask-position: top left, bottom left, center;
	mask-repeat: repeat-x, repeat-x, no-repeat;
}

.e-66a3298f > .holder > .band > .inner
{
	position: relative;
	z-index: 1;
	width: min(100% - 48px, 1360px);
	margin: 0 auto;
}

/* Naslov i pill link stoje jedan uz drugi u istom redu. */

.e-66a3298f > .holder > .band > .inner > .head
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 34px;
}

.e-66a3298f > .holder > .band > .inner > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	line-height: 1.18;
	font-weight: 800;
	letter-spacing: -0.4px;
	color: #16294d;
}

.e-66a3298f > .holder > .band > .inner > .head > .head-link
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 22px;
	border: 1px solid #16294d;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	color: #16294d;
	text-decoration: none;
	background: transparent;
	transition: background 0.18s ease, color 0.18s ease;
}

.e-66a3298f > .holder > .band > .inner > .head > .head-link:hover
{
	background: #16294d;
	color: #ffffff;
}

.e-66a3298f > .holder > .band > .inner > .head > .head-link > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	line-height: 1;
	font-style: normal;
}

/* Karusel. */

.e-66a3298f > .holder > .band > .inner > .stage
{
	position: relative;
}

.e-66a3298f > .holder > .band > .inner > .stage > .viewport
{
	overflow: hidden;
	margin: -8px;
	padding: 8px;
}

.e-66a3298f > .holder > .band > .inner > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.45s ease;
}

.e-66a3298f > .holder > .band > .inner > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 0 10px;
	box-sizing: border-box;
	display: flex;
}

/* Prva ćelija je stilizovana mapa; visina prati kartice jer je ceo lanac rastegnut. */

.e-66a3298f .map-face
{
	position: relative;
	flex: 1;
	border-radius: 10px;
	background-color: #dbe8f7;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.e-66a3298f .map-line
{
	position: absolute;
	height: 3px;
	border-radius: 3px;
	background: rgba(31, 122, 102, 0.35);
}

.e-66a3298f .map-line-1
{
	top: 22%;
	left: 8%;
	width: 54%;
	transform: rotate(14deg);
}

.e-66a3298f .map-line-2
{
	top: 52%;
	left: 26%;
	width: 62%;
	transform: rotate(-9deg);
}

.e-66a3298f .map-line-3
{
	top: 74%;
	left: 12%;
	width: 46%;
	transform: rotate(6deg);
}

.e-66a3298f .map-dot
{
	position: absolute;
	width: 14px;
	height: 14px;
	border-radius: 50% 50% 50% 0;
	background: #1f7a66;
	transform: rotate(-45deg);
	box-shadow: 0 2px 6px rgba(22, 41, 77, 0.25);
}

.e-66a3298f .map-dot-1
{
	top: 18%;
	left: 22%;
}

.e-66a3298f .map-dot-2
{
	top: 34%;
	left: 74%;
}

.e-66a3298f .map-dot-3
{
	top: 72%;
	left: 38%;
}

.e-66a3298f .map-button
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 13px 26px;
	border-radius: 999px;
	background: #1f7a66;
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(22, 41, 77, 0.18);
	transition: background 0.18s ease;
}

.e-66a3298f .map-button:hover
{
	background: #17614f;
}

/* Kartica ture. */

.e-66a3298f .card
{
	display: flex;
	flex-direction: column;
	flex: 1;
	background: #ffffff;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(22, 41, 77, 0.08);
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.e-66a3298f .card:hover
{
	box-shadow: 0 10px 26px rgba(22, 41, 77, 0.16);
	transform: translateY(-3px);
}

.e-66a3298f .card-media
{
	display: block;
	position: relative;
	width: 100%;
	padding-top: 62%;
	overflow: hidden;
	background: #e6eef7;
}

.e-66a3298f .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-size: cover;
	background-position: center;
	transition: transform 0.4s ease;
}

.e-66a3298f .card:hover .card-image
{
	transform: scale(1.06);
}

.e-66a3298f .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 20px 20px 22px;
}

.e-66a3298f .card-name
{
	display: block;
	font-size: 19px;
	line-height: 1.28;
	font-weight: 800;
	color: #16294d;
}

.e-66a3298f .card-meta
{
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: 13px;
	color: #6d7683;
}

.e-66a3298f .card-meta > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 17px;
	line-height: 1;
	font-style: normal;
	color: #8a939f;
}

.e-66a3298f .card-meta-text
{
	display: block;
	margin-left: 4px;
}

.e-66a3298f .card-list
{
	display: block;
	margin-top: 16px;
}

.e-66a3298f .card-list-item
{
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 13.5px;
	line-height: 1.45;
	color: #3f4855;
}

.e-66a3298f .card-list-item > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 17px;
	line-height: 1.3;
	font-style: normal;
	color: #1f7a66;
	flex: 0 0 auto;
}

.e-66a3298f .card-list-text
{
	display: block;
}

/* Spacer gura dugme na dno, pa sva dugmad sede u istoj liniji. */

.e-66a3298f .spacer
{
	display: block;
	flex: 1 1 auto;
}

.e-66a3298f .card-cta
{
	display: block;
	margin-top: 18px;
	padding: 13px 20px;
	border-radius: 999px;
	background: #1f7a66;
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
	text-align: center;
	transition: background 0.18s ease;
}

.e-66a3298f .card:hover .card-cta
{
	background: #17614f;
}

/* Strelice stoje ispod reda, uz levu ivicu. */

.e-66a3298f > .holder > .band > .inner > .stage > .controls
{
	display: flex;
	gap: 12px;
	margin-top: 28px;
	padding-left: 10px;
}

.e-66a3298f .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid #16294d;
	border-radius: 50%;
	background: transparent;
	color: #16294d;
	cursor: pointer;
	padding: 0;
	transition: background 0.18s ease, color 0.18s ease, opacity 0.18s ease;
}

.e-66a3298f .arrow > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	line-height: 1;
	font-style: normal;
}

.e-66a3298f .arrow:hover
{
	background: #16294d;
	color: #ffffff;
}

.e-66a3298f .arrow.is-off
{
	opacity: 0.35;
	cursor: default;
}

.e-66a3298f .arrow.is-off:hover
{
	background: transparent;
	color: #16294d;
}

@media (max-width: 1024px)
{
	.e-66a3298f > .holder > .band
	{
		padding: 56px 0 50px;
	}

	.e-66a3298f > .holder > .band > .inner > .head > .title
	{
		font-size: 28px;
	}
}

@media (max-width: 640px)
{
	.e-66a3298f > .holder > .band
	{
		padding: 44px 0 40px;
	}

	.e-66a3298f > .holder > .band > .inner
	{
		width: min(100% - 32px, 1360px);
	}

	.e-66a3298f > .holder > .band > .inner > .head
	{
		gap: 14px;
		margin-bottom: 26px;
	}

	.e-66a3298f > .holder > .band > .inner > .head > .title
	{
		font-size: 24px;
	}

	.e-66a3298f .card-name
	{
		font-size: 17px;
	}
}

/* ===== END: section-featured-trips ===== */
/* ===== BEGIN: section-firstminute-hero-1 ===== */

.e-7c3ad3b
{
	display: block;
	width: 100%;
}

.e-7c3ad3b > .holder
{
	width: 100%;
	padding: 10px 0 26px 0;
}

/* ===== DEO 1: TANKA TRAKA POVERENJA NA ZUTOJ POZADINI ===== */

.e-7c3ad3b .trustbar
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px 26px;
	width: 100%;
	padding: 4px 0 10px 0;
}

.e-7c3ad3b .trust-items
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 26px;
	min-width: 0;
}

.e-7c3ad3b .trust-item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #141e5a;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

.e-7c3ad3b .trust-item > i
{
	font-size: 17px;
	color: #141e5a;
}

.e-7c3ad3b .trust-rating
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
}

.e-7c3ad3b .rating-logo
{
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding: 0 9px;
	border-radius: 4px;
	background: #ffffff;
	color: #141e5a;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.03em;
}

.e-7c3ad3b .rating-logo > img
{
	display: block;
	height: 16px;
	width: auto;
}

.e-7c3ad3b .rating-stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.e-7c3ad3b .rating-star
{
	color: #00b67a;
	font-size: 15px;
	line-height: 1;
}

.e-7c3ad3b .rating-score
{
	color: #141e5a;
	font-size: 13px;
	font-weight: 800;
}

/* ===== DEO 2: HEADER NA ZUTOJ POZADINI ===== */

.e-7c3ad3b .bar
{
	display: flex;
	align-items: center;
	gap: 22px;
	width: 100%;
	padding: 6px 0 14px 0;
}

.e-7c3ad3b .bar-logo
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	color: #141e5a;
	font-size: 24px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-decoration: none;
}

.e-7c3ad3b .bar-logo > img
{
	display: block;
	height: 34px;
	width: auto;
}

.e-7c3ad3b .bar-search
{
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1 1 auto;
	max-width: 420px;
	min-width: 0;
	height: 44px;
	padding: 0 18px;
	border-radius: 999px;
	background: #ffffff;
}

.e-7c3ad3b .bar-search-icon
{
	font-size: 20px;
	color: #7a7f8c;
	flex: 0 0 auto;
}

.e-7c3ad3b .bar-input
{
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	border: 0;
	outline: 0;
	background: transparent;
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	font-size: 14px;
}

.e-7c3ad3b .bar-input::placeholder
{
	color: #9aa0ac;
}

.e-7c3ad3b .bar-actions
{
	display: flex;
	align-items: center;
	gap: 20px;
	flex: 0 0 auto;
	margin-left: auto;
}

.e-7c3ad3b .bar-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #141e5a;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-7c3ad3b .bar-link.is-accent
{
	color: #e4002b;
}

.e-7c3ad3b .bar-link:hover
{
	color: #e4002b;
}

.e-7c3ad3b .bar-link > i
{
	font-size: 19px;
}

.e-7c3ad3b .bar-wish
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: #e6197d;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.e-7c3ad3b .bar-wish > i
{
	font-size: 21px;
}

.e-7c3ad3b .bar-account
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: #141e5a;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-7c3ad3b .bar-account:hover
{
	color: #e4002b;
}

.e-7c3ad3b .bar-account > i
{
	font-size: 21px;
}

.e-7c3ad3b .bar-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: #ffffff;
	color: #141e5a;
	cursor: pointer;
}

.e-7c3ad3b .bar-burger > i
{
	font-size: 22px;
}

/* ===== DEO 3: HERO BANER ===== */

.e-7c3ad3b .hero-wrap
{
	position: relative;
	width: 100%;
}

.e-7c3ad3b .hero
{
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 460px;
	padding: 46px 56px 190px 56px;
	border-radius: 16px;
	background-color: #cfd8dc;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
}

.e-7c3ad3b .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.28) 46%, rgba(0, 0, 0, 0) 78%);
}

.e-7c3ad3b .hero-content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	max-width: 620px;
}

.e-7c3ad3b .hero-title
{
	margin: 0;
	color: #ffffff;
	font-family: var(--ot-font-primary);
	font-size: 56px;
	font-weight: 800;
	line-height: 1.06;
	letter-spacing: -0.01em;
}

.e-7c3ad3b .hero-cta
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 50px;
	padding: 0 16px 0 26px;
	border-radius: 999px;
	background: #ffffff;
	color: #2f6feb;
	font-size: 16px;
	font-weight: 800;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-7c3ad3b .hero-cta:hover
{
	background: #eef3ff;
}

.e-7c3ad3b .hero-cta > i
{
	font-size: 24px;
}

/* Ukrasna kampanjska oznaka desno preko fotografije. */

.e-7c3ad3b .badge
{
	position: absolute;
	z-index: 2;
	top: 56px;
	right: 60px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	width: 210px;
}

.e-7c3ad3b .badge-disc
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 150px;
	border-radius: 999px;
	background: #ffd400;
}

.e-7c3ad3b .badge-disc > i
{
	font-size: 76px;
	color: #e6197d;
}

.e-7c3ad3b .badge-text
{
	color: #ffffff;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: 0.04em;
	text-align: center;
	text-transform: uppercase;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

/* ===== DEO 4: ZUTI PANEL PRETRAGE KOJI LEBDI PREKO DNA FOTOGRAFIJE ===== */

.e-7c3ad3b .panel
{
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: calc(100% - 64px);
	margin: -152px auto 0 auto;
	padding: 18px;
	border-radius: 16px;
	background: #ffd400;
	box-shadow: 0 14px 34px rgba(20, 30, 90, 0.18);
}

.e-7c3ad3b .panel-fields
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 12px;
}

.e-7c3ad3b .field
{
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	padding: 12px 16px;
	border: 0;
	border-radius: 12px;
	background: #ffffff;
	font-family: var(--ot-font-primary);
	text-align: left;
	cursor: pointer;
	transition: box-shadow var(--ot-transition);
}

.e-7c3ad3b .field:hover
{
	box-shadow: 0 0 0 2px #141e5a inset;
}

.e-7c3ad3b .field-icon
{
	flex: 0 0 auto;
	font-size: 22px;
	color: #141e5a;
}

.e-7c3ad3b .field-body
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-7c3ad3b .field-label
{
	color: #8a8f9b;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
}

.e-7c3ad3b .field-value
{
	color: #141e5a;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-7c3ad3b .panel-bottom
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
}

.e-7c3ad3b .filters
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.e-7c3ad3b .filter
{
	flex: 0 0 auto;
	height: 38px;
	padding: 0 18px;
	border: 0;
	border-radius: 999px;
	background: #ffffff;
	color: #141e5a;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-7c3ad3b .filter:hover
{
	background: #fff6cc;
}

.e-7c3ad3b .filter.is-active
{
	background: #141e5a;
	color: #ffffff;
}

.e-7c3ad3b .panel-search
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex: 0 0 auto;
	height: 54px;
	padding: 0 30px;
	border: 0;
	border-radius: 12px;
	background: #e6197d;
	color: #ffffff;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 800;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition);
}

.e-7c3ad3b .panel-search:hover
{
	background: #c9146a;
}

.e-7c3ad3b .panel-search > i
{
	font-size: 22px;
}

/* ===== RESPONSIVE: TABLET ===== */

@media (max-width: 1024px)
{
	.e-7c3ad3b .bar
	{
		gap: 14px;
	}

	.e-7c3ad3b .bar-search
	{
		max-width: 260px;
	}

	.e-7c3ad3b .bar-actions
	{
		gap: 14px;
	}

	.e-7c3ad3b .bar-link
	{
		font-size: 13px;
	}

	.e-7c3ad3b .bar-account > span
	{
		display: none;
	}

	.e-7c3ad3b .hero
	{
		min-height: 480px;
		padding: 36px 34px 230px 34px;
	}

	.e-7c3ad3b .hero-title
	{
		font-size: 42px;
	}

	.e-7c3ad3b .badge
	{
		top: 34px;
		right: 30px;
		width: 160px;
		gap: 10px;
	}

	.e-7c3ad3b .badge-disc
	{
		width: 112px;
		height: 112px;
	}

	.e-7c3ad3b .badge-disc > i
	{
		font-size: 56px;
	}

	.e-7c3ad3b .badge-text
	{
		font-size: 16px;
	}

	.e-7c3ad3b .panel
	{
		width: calc(100% - 40px);
		margin-top: -190px;
	}

	.e-7c3ad3b .panel-fields
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

/* ===== RESPONSIVE: MOBILNI ===== */

@media (max-width: 640px)
{
	.e-7c3ad3b .trustbar
	{
		gap: 10px;
	}

	.e-7c3ad3b .trust-items
	{
		gap: 6px 14px;
	}

	.e-7c3ad3b .trust-item
	{
		font-size: 12px;
	}

	.e-7c3ad3b .bar
	{
		flex-wrap: wrap;
	}

	.e-7c3ad3b .bar-search
	{
		order: 3;
		max-width: none;
		width: 100%;
		flex: 1 1 100%;
	}

	.e-7c3ad3b .bar-link
	{
		display: none;
	}

	.e-7c3ad3b .bar-account > i
	{
		font-size: 22px;
	}

	.e-7c3ad3b .bar-burger
	{
		display: inline-flex;
	}

	.e-7c3ad3b .hero
	{
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		gap: 20px;
		min-height: 360px;
		padding: 26px 22px 26px 22px;
	}

	.e-7c3ad3b .scrim
	{
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0.5) 100%);
	}

	.e-7c3ad3b .hero-content
	{
		gap: 18px;
	}

	.e-7c3ad3b .hero-title
	{
		font-size: 30px;
	}

	.e-7c3ad3b .badge
	{
		position: relative;
		top: auto;
		right: auto;
		flex-direction: row;
		align-items: center;
		width: auto;
		gap: 12px;
	}

	.e-7c3ad3b .badge-disc
	{
		width: 84px;
		height: 84px;
	}

	.e-7c3ad3b .badge-disc > i
	{
		font-size: 42px;
	}

	.e-7c3ad3b .badge-text
	{
		font-size: 13px;
	}

	.e-7c3ad3b .panel
	{
		width: 100%;
		margin-top: 14px;
		padding: 14px;
	}

	.e-7c3ad3b .panel-fields
	{
		grid-template-columns: 1fr;
	}

	.e-7c3ad3b .panel-bottom
	{
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	.e-7c3ad3b .filters
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 4px;
	}

	.e-7c3ad3b .panel-search
	{
		width: 100%;
	}
}

/* ===== END: section-firstminute-hero-1 ===== */
/* ===== BEGIN: section-flag-deals-1 ===== */

.e-11fcbef8
{
	display: block;
	width: 100%;
}

.e-11fcbef8 > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned) ===== */

.e-11fcbef8 > .holder > .title
{
	margin: 0 0 32px;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (4 columns x 2 rows, equal gap) ===== */

.e-11fcbef8 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-11fcbef8 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-11fcbef8 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE + ARROW FLAG OVERLAYS ===== */

.e-11fcbef8 .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-11fcbef8 .card:hover > .card-image
{
	transform: scale(1.05);
}

.e-11fcbef8 .card-image > .tags
{
	position: absolute;
	left: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	max-width: 92%;
	row-gap: 4px;
}

.e-11fcbef8 .card-image > .tags-top
{
	top: 10px;
}

.e-11fcbef8 .card-image > .tags-bottom
{
	bottom: 10px;
}

/* ===== ARROW FLAG (chevron right edge, notched left edge to interlock) ===== */

.e-11fcbef8 .tags > .flag
{
	display: inline-flex;
	align-items: center;
	padding: 4px 14px 4px 10px;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.25;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-11fcbef8 .tags > .flag-head
{
	padding-left: 10px;
	clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 0 100%);
}

.e-11fcbef8 .tags > .flag-tail
{
	margin-left: -6px;
	padding-left: 16px;
	clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 0 100%, 9px 50%);
}

.e-11fcbef8 .tags > .flag-lime
{
	background: #cddc39;
	color: #1a1205;
}

.e-11fcbef8 .tags > .flag-pink
{
	background: #ec4899;
	color: white;
}

/* ===== CARD BODY (flex column, price bar pinned to bottom) ===== */

.e-11fcbef8 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	padding: 16px;
}

/* ===== TRIP NAME (bold dark, 1-2 lines) ===== */

.e-11fcbef8 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== DESCRIPTION (grey, 1-2 lines) ===== */

.e-11fcbef8 .card-body > .desc
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 6px;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== DATE PILLS (light grey, wrap; grows to equalize card heights) ===== */

.e-11fcbef8 .card-body > .dates
{
	display: flex;
	flex-wrap: wrap;
	flex: 1;
	align-content: flex-start;
	gap: 6px;
	margin-top: 12px;
}

.e-11fcbef8 .dates > .pill
{
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	color: var(--ot-text-1);
}

.e-11fcbef8 .dates > .pill-more
{
	gap: 2px;
	padding-right: 6px;
}

.e-11fcbef8 .dates > .pill-more > i
{
	font-size: 14px;
	line-height: 1;
}

/* ===== PRICE BAR (bottom aligned, thin divider on top) ===== */

.e-11fcbef8 .card-body > .price
{
	margin-top: auto;
	padding-top: 12px;
}

.e-11fcbef8 .price > .divider
{
	height: 1px;
	margin-bottom: 12px;
	background: var(--ot-bg-3-border);
}

.e-11fcbef8 .price > .price-row
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.e-11fcbef8 .price-row > .price-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	color: var(--ot-text-2);
}

.e-11fcbef8 .price-row > .price-icon > i
{
	font-size: 16px;
	line-height: 1;
}

.e-11fcbef8 .price-row > .price-label
{
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ot-text-2);
}

.e-11fcbef8 .price-row > .price-old
{
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: line-through;
	color: var(--ot-text-1);
}

.e-11fcbef8 .price-row > .price-new
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: #e11d63;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-11fcbef8 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-11fcbef8 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-11fcbef8 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-flag-deals-1 ===== */
/* ===== BEGIN: section-flags-1 ===== */

.e-2509f153
{
	display: block;
	width: 100%;
}

.e-2509f153 > .holder
{
	width: 100%;
}

/* ===== HEADER (small leading icon + bold dark-blue title, left aligned) ===== */

.e-2509f153 > .holder > .head
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 28px;
}

.e-2509f153 .head > .head-icon
{
	font-size: 28px;
	line-height: 1;
	color: var(--ot-brand);
}

.e-2509f153 .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 28px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-brand);
}

/* ===== GRID (4 equal columns, even gap on both axes) ===== */

.e-2509f153 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

/* ===== PILL (single clickable link: flag + name + chevron) ===== */

.e-2509f153 .pill
{
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-m);
	transition: background 220ms ease, border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}

.e-2509f153 .pill:hover
{
	background: var(--ot-bg-1);
	border-color: var(--ot-brand-border, var(--ot-brand));
	box-shadow: 0 8px 22px rgba(20, 18, 16, 0.10);
}

/* ===== FLAG (small rectangular icon) ===== */

.e-2509f153 .pill > .flag
{
	flex-shrink: 0;
	width: 32px;
	height: 22px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border: 1px solid var(--ot-bg-3);
	border-radius: 4px;
}

/* ===== NAME (uppercase bold dark) ===== */

.e-2509f153 .pill > .name
{
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--ot-brand);
}

/* ===== CHEVRON (blue, nudges right on hover) ===== */

.e-2509f153 .pill > .chev
{
	flex-shrink: 0;
	font-size: 22px;
	line-height: 1;
	color: var(--ot-blue);
	transition: transform 220ms ease;
}

.e-2509f153 .pill:hover > .chev
{
	transform: translateX(4px);
}

/* ===== RESPONSIVE (3 cols, then 2, then 1) ===== */

@media (max-width: 1200px)
{
	.e-2509f153 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 900px)
{
	.e-2509f153 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-2509f153 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-2509f153 .head > .title
	{
		font-size: 22px;
	}
}

/* ===== END: section-flags-1 ===== */
/* ===== BEGIN: section-flight-banner-1 ===== */

.e-7bc55b31
{
	display: block;
	width: 100%;
	--fb-yellow: #ffd400;
	--fb-navy: #141e5a;
	--fb-ribbon: 92px;
	--fb-radius: 16px;
}

/* ===== HOLDER (cela povrsina je jedan klikabilan baner sa zaobljenim uglovima) ===== */

.e-7bc55b31 > .holder
{
	position: relative;
	display: block;
	overflow: hidden;
	width: 100%;
	min-height: 420px;
	border-radius: var(--fb-radius);
	color: #ffffff;
	text-decoration: none;
}

/* ===== POZADINA (velika fotografija plaze ili aviona) ===== */

.e-7bc55b31 > .holder > .cover
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 600ms ease;
}

.e-7bc55b31 > .holder:hover > .cover
{
	transform: scale(1.04);
}

/* ===== ZATAMNJENJE (da beo natpis preko fotografije ostane citljiv) ===== */

.e-7bc55b31 > .holder > .scrim
{
	position: absolute;
	inset: 0;
	display: block;
	background: linear-gradient(180deg, rgba(10, 16, 48, 0.42) 0%, rgba(10, 16, 48, 0.28) 45%, rgba(10, 16, 48, 0.5) 100%);
}

/* ===== SARENI POJAS (talasasta gornja ivica, prelaz narandzasto - pink - plavo) ===== */

.e-7bc55b31 > .holder > .ribbon
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	display: block;
	height: var(--fb-ribbon);
	background: linear-gradient(90deg, #f5821e 0%, #e6197d 52%, #2f6feb 100%);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20160%2040%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2040%20L0%2020%20C%2026%200%2054%2040%2080%2020%20C%20106%200%20134%2040%20160%2020%20L160%2040%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	-webkit-mask-size: 160px 40px, 100% calc(100% - 40px);
	-webkit-mask-position: top left, bottom left;
	-webkit-mask-repeat: repeat-x, no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20160%2040%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2040%20L0%2020%20C%2026%200%2054%2040%2080%2020%20C%20106%200%20134%2040%20160%2020%20L160%2040%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	mask-size: 160px 40px, 100% calc(100% - 40px);
	mask-position: top left, bottom left;
	mask-repeat: repeat-x, no-repeat;
}

/* ===== SADRZAJ (natpis u dva reda i dugme, centrirani iznad pojasa) ===== */

.e-7bc55b31 > .holder > .content
{
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 420px;
	padding: 54px 40px calc(var(--fb-ribbon) + 26px);
	text-align: center;
}

.e-7bc55b31 > .holder > .content > .title
{
	display: block;
	max-width: 900px;
	color: #ffffff;
	font-family: var(--ot-font-primary);
	font-size: 46px;
	font-weight: 800;
	line-height: 1.12;
}

.e-7bc55b31 > .holder > .content > .subtitle
{
	display: block;
	max-width: 760px;
	margin-top: 12px;
	color: rgba(255, 255, 255, 0.94);
	font-family: var(--ot-font-primary);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.3;
}

/* ===== DUGME (zuta pilula sa tamnim tekstom) ===== */

.e-7bc55b31 > .holder > .content > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 26px;
	padding: 14px 36px;
	background: var(--fb-yellow);
	border-radius: 999px;
	color: var(--fb-navy);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	transition: background var(--ot-transition);
}

.e-7bc55b31 > .holder:hover > .content > .cta
{
	background: #f0c700;
}

/* ===== TABLET (nizi baner, natpis se smanjuje, pojas ostaje na dnu) ===== */

@media (max-width: 1024px)
{
	.e-7bc55b31
	{
		--fb-ribbon: 74px;
	}

	.e-7bc55b31 > .holder
	{
		min-height: 340px;
	}

	.e-7bc55b31 > .holder > .content
	{
		min-height: 340px;
		padding: 42px 30px calc(var(--fb-ribbon) + 22px);
	}

	.e-7bc55b31 > .holder > .content > .title
	{
		font-size: 36px;
	}

	.e-7bc55b31 > .holder > .content > .subtitle
	{
		font-size: 21px;
	}
}

/* ===== MOBILNI (jos nizi baner, natpis i dugme ostaju citljivi) ===== */

@media (max-width: 640px)
{
	.e-7bc55b31
	{
		--fb-ribbon: 56px;
		--fb-radius: 12px;
	}

	.e-7bc55b31 > .holder
	{
		min-height: 300px;
	}

	.e-7bc55b31 > .holder > .content
	{
		min-height: 300px;
		padding: 32px 20px calc(var(--fb-ribbon) + 18px);
	}

	.e-7bc55b31 > .holder > .content > .title
	{
		font-size: 27px;
	}

	.e-7bc55b31 > .holder > .content > .subtitle
	{
		margin-top: 10px;
		font-size: 17px;
	}

	.e-7bc55b31 > .holder > .content > .cta
	{
		width: 100%;
		max-width: 260px;
		margin-top: 22px;
		padding: 14px 24px;
	}
}

/* ===== END: section-flight-banner-1 ===== */
/* ===== BEGIN: section-flight-cards-1 ===== */

.e-19367698
{
	display: block;
	width: 100%;
}

.e-19367698 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (left-aligned title + subtitle) ===== */

.e-19367698 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	gap: 8px;
	margin-bottom: 32px;
}

.e-19367698 .head > .title
{
	margin: 0;
	font-size: 34px;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
	color: #10286b;
}

.e-19367698 .head > .subtitle
{
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: #10286b;
}

/* ===== VIEWPORT + TRACK ===== */

.e-19367698 .viewport
{
	position: relative;
	overflow: hidden;
}

.e-19367698 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD ===== */

.e-19367698 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 12px 8px;
	box-sizing: border-box;
}

.e-19367698 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 6px 20px rgba(16, 40, 107, 0.08);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-19367698 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 16px 36px rgba(16, 40, 107, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top only) ===== */

.e-19367698 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-top-left-radius: var(--ot-radius-m);
	border-top-right-radius: var(--ot-radius-m);
}

/* ===== CARD BODY ===== */

.e-19367698 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 12px;
	padding: 16px 18px 18px;
	min-width: 0;
}

.e-19367698 .card-name
{
	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;
	color: #10286b;
	min-height: 2.5em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===== META ROW (duration + transport) ===== */

.e-19367698 .card-meta
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	min-width: 0;
}

.e-19367698 .meta-item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--ot-text-1);
	min-width: 0;
}

.e-19367698 .meta-item > i
{
	font-size: 18px;
	color: #10286b;
}

.e-19367698 .meta-transport
{
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ===== DEPARTURES ===== */

.e-19367698 .departures
{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-19367698 .dep-label
{
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #10286b;
}

.e-19367698 .pills
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-19367698 .pill
{
	display: inline-flex;
	align-items: center;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-19367698 .pill.pill-more
{
	color: var(--ot-text-2);
}

/* ===== SPACER (pushes deadline + footer to the bottom) ===== */

.e-19367698 .spacer
{
	flex: 1;
	min-height: 8px;
}

/* ===== DEADLINE BAR ===== */

.e-19367698 .deadline
{
	align-self: flex-end;
	max-width: 100%;
	padding: 5px 12px;
	background: #10286b;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: white;
	text-align: right;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== FOOTER (price row) ===== */

.e-19367698 .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.e-19367698 .price-label
{
	font-size: 12px;
	line-height: 1.3;
	color: var(--ot-text-2);
	max-width: 6em;
}

.e-19367698 .price-wrap
{
	display: flex;
	align-items: baseline;
	gap: 8px;
	min-width: 0;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.e-19367698 .old-price
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-red);
}

.e-19367698 .new-price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: #10286b;
	white-space: nowrap;
}

/* ===== ARROWS ===== */

.e-19367698 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: rgba(255, 255, 255, 0.94);
	border: 0;
	border-radius: 50%;
	color: #10286b;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(16, 40, 107, 0.18);
	transition: background 240ms, color 240ms;
}

.e-19367698 .arrow:hover
{
	background: #10286b;
	color: white;
}

.e-19367698 .arrow-prev { left: 12px; }
.e-19367698 .arrow-next { right: 12px; }

/* ===== DOTS ===== */

.e-19367698 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	margin-top: 22px;
}

.e-19367698 .dots > .dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	background: var(--ot-bg-3-border);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-19367698 .dots > .dot.active
{
	width: 26px;
	background: var(--ot-orange);
	border-radius: 100px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-19367698 .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2));
		max-width: calc(100% / var(--per-view, 2));
	}
}

@media (max-width: 900px)
{
	.e-19367698 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-19367698 > .holder > .head { margin-bottom: 24px; }
	.e-19367698 .head > .title { font-size: 25px; }
	.e-19367698 .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1));
		max-width: calc(100% / var(--per-view, 1));
	}
	.e-19367698 .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-flight-cards-1 ===== */
/* ===== BEGIN: section-flight-cards-2 ===== */

.e-19367697
{
	display: block;
	width: 100%;
}

.e-19367697 > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned title + subtitle) ===== */

.e-19367697 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	gap: 8px;
	margin-bottom: 32px;
}

.e-19367697 .head > .title
{
	margin: 0;
	font-size: 34px;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
	color: #10286b;
}

.e-19367697 .head > .subtitle
{
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: #10286b;
}

/* ===== TABS (opt-in: country pills between the header and the grid) ===== */

.e-19367697 > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: -12px 0 26px;
}

.e-19367697 .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 18px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
}

.e-19367697 .tabs > .tab:hover
{
	border-color: #10286b;
	color: #10286b;
}

.e-19367697 .tabs > .tab.is-active
{
	background: #10286b;
	border-color: #10286b;
	color: white;
}

.e-19367697 .tab-flag
{
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 14px;
	border-radius: 2px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== GRID (4 columns x 3 rows, equal gap) ===== */

.e-19367697 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CELL (nosac kartice; strelice galerije su sibling linka, ne dete) ===== */

.e-19367697 .cell
{
	position: relative;
	display: flex;
	min-width: 0;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-19367697 .cell:hover
{
	transform: translateY(-6px);
}

/* ===== CARD ===== */

.e-19367697 .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 6px 20px rgba(16, 40, 107, 0.08);
	overflow: hidden;
	transition: box-shadow 320ms ease;
}

.e-19367697 .cell:hover > .card
{
	box-shadow: 0 16px 36px rgba(16, 40, 107, 0.16);
}

/* ===== MARKER (opt-in: Last Minute / First Minute pilula preko slike) ===== */

.e-19367697 .card > .marker
{
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	max-width: calc(100% - 24px);
	padding: 5px 11px;
	background: #10286b;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: white;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-19367697 .card > .marker.is-red
{
	background: #e4002b;
}

.e-19367697 .card > .marker.is-green
{
	background: #148f5f;
}

/* ===== GALLERY ARROWS (opt-in; poklapaju se sa okvirom slike 3/2) ===== */

.e-19367697 .cell > .shot-nav
{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	aspect-ratio: 3 / 2;
	z-index: 3;
	pointer-events: none;
}

.e-19367697 .shot-arrow
{
	position: absolute;
	top: 50%;
	margin-top: -16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 2px 8px rgba(16, 40, 107, 0.18);
	color: #10286b;
	cursor: pointer;
	pointer-events: auto;
	transition: background 200ms ease;
}

.e-19367697 .shot-arrow:hover
{
	background: white;
}

.e-19367697 .shot-arrow > i
{
	font-size: 20px;
}

.e-19367697 .shot-prev
{
	left: 10px;
}

.e-19367697 .shot-next
{
	right: 10px;
}

/* ===== CARD IMAGE (clean, no overlay, rounded top only) ===== */

.e-19367697 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-top-left-radius: var(--ot-radius-m);
	border-top-right-radius: var(--ot-radius-m);
}

/* ===== CARD BODY ===== */

.e-19367697 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 12px;
	padding: 16px 18px 18px;
	min-width: 0;
}

.e-19367697 .card-name
{
	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;
	color: #10286b;
	min-height: 2.5em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===== META ROW (duration + transport) ===== */

.e-19367697 .card-meta
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	min-width: 0;
}

.e-19367697 .meta-item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--ot-text-1);
	min-width: 0;
}

.e-19367697 .meta-item > i
{
	font-size: 18px;
	color: #10286b;
}

.e-19367697 .meta-transport
{
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ===== BADGES (opt-in: bazen, parking, ljubimci, basta...) ===== */

.e-19367697 .badges
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
	min-width: 0;
	margin-top: -4px;
}

.e-19367697 .badge
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-19367697 .badge > i
{
	font-size: 16px;
	color: #10286b;
}

/* ===== DEPARTURES ===== */

.e-19367697 .departures
{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.e-19367697 .dep-label
{
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #10286b;
}

.e-19367697 .pills
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-19367697 .pill
{
	display: inline-flex;
	align-items: center;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-19367697 .pill.pill-more
{
	color: var(--ot-text-2);
}

/* ===== SPACER (pushes deadline + footer to the bottom) ===== */

.e-19367697 .spacer
{
	flex: 1;
	min-height: 8px;
}

/* ===== DEADLINE BAR ===== */

.e-19367697 .deadline
{
	align-self: flex-end;
	max-width: 100%;
	padding: 5px 12px;
	background: #10286b;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: white;
	text-align: right;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== FOOTER (price row) ===== */

.e-19367697 .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.e-19367697 .price-label
{
	font-size: 12px;
	line-height: 1.3;
	color: var(--ot-text-2);
	max-width: 6em;
}

.e-19367697 .price-wrap
{
	display: flex;
	align-items: baseline;
	gap: 8px;
	min-width: 0;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.e-19367697 .old-price
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-red);
}

.e-19367697 .new-price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: #10286b;
	white-space: nowrap;
}

/* ===== FOOT (opt-in: button centred below the grid) ===== */

.e-19367697 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-19367697 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 100px;
	background: #10286b;
	font-size: 15px;
	font-weight: 800;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-19367697 .foot > .cta:hover
{
	background: #0b1c4d;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 900px)
{
	.e-19367697 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-19367697 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-19367697 > .holder > .head { margin-bottom: 24px; }
	.e-19367697 .head > .title { font-size: 25px; }

	.e-19367697 .foot > .cta
	{
		width: 100%;
	}
}

/* ===== END: section-flight-cards-2 ===== */
/* ===== BEGIN: section-guest-favorites-1 ===== */

.e-788a2788
{
	display: block;
	width: 100%;
}

.e-788a2788 > .holder
{
	width: 100%;
	background: #f5f6f8;
	border-radius: var(--ot-radius-l);
	padding: 28px 24px 32px;
	box-sizing: border-box;
}

/* ===== HEADER (centered title) ===== */

.e-788a2788 > .holder > .head
{
	margin-bottom: 20px;
	text-align: center;
}

.e-788a2788 .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-788a2788 .stage
{
	position: relative;
	outline: none;
}

.e-788a2788 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 8px 0;
}

.e-788a2788 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-788a2788 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4.3));
	max-width: calc(100% / var(--per-view, 4.3));
	padding: 6px 9px;
	box-sizing: border-box;
}

.e-788a2788 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 4px 14px rgba(15, 40, 70, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-788a2788 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(15, 40, 70, 0.14);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-788a2788 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== BRAND PILL (top-left, colored per collection, white bold text) ===== */

.e-788a2788 .card-image > .brand
{
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	display: inline-block;
	padding: 4px 9px;
	background: #e07b1a;
	border-radius: 6px;
	color: white;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1;
	text-transform: uppercase;
}

/* ===== CARD BODY ===== */

.e-788a2788 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 6px;
	padding: 14px 16px 16px;
}

/* ===== STARS (yellow, filled) ===== */

.e-788a2788 .card-body > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	white-space: nowrap;
}

.e-788a2788 .card-body > .stars > i
{
	font-size: 15px;
	line-height: 1;
	color: #f5b301;
	font-variation-settings: 'FILL' 1;
}

/* ===== NAME ROW (name left, rating circle right) ===== */

.e-788a2788 .card-body > .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.e-788a2788 .name-row > .name
{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-788a2788 .name-row > .rating-circle
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	background: var(--ot-bg-3);
	border-radius: 50%;
	color: var(--ot-text-1);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
}

/* ===== LOCATION (grey, may wrap two lines) ===== */

.e-788a2788 .card-body > .location
{
	font-size: 13px;
	line-height: 1.35;
	color: var(--ot-text-3);
}

/* ===== SPACER (stretches so footer pins to bottom) ===== */

.e-788a2788 .card-body > .spacer
{
	flex: 1;
	min-height: 10px;
}

/* ===== FOOTER (transport left, price right, pinned to bottom) ===== */

.e-788a2788 .card-body > .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
}

/* ===== TRANSPORT ICONS (grey line, plane + bed) ===== */

.e-788a2788 .footer > .transport
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	flex: 0 0 auto;
	color: var(--ot-text-3);
}

.e-788a2788 .transport > i
{
	font-size: 20px;
	line-height: 1;
}

.e-788a2788 .transport > .plus
{
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

/* ===== PRICE BLOCK (two right-aligned rows) ===== */

.e-788a2788 .footer > .price-block
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	min-width: 0;
	text-align: right;
}

.e-788a2788 .price-block > .price-line
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	min-width: 0;
}

.e-788a2788 .price-line > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-3);
	white-space: nowrap;
}

.e-788a2788 .price-line > .info
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	font-size: 14px;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-788a2788 .price-block > .price
{
	font-size: 20px;
	font-weight: 800;
	line-height: 1;
	color: var(--ot-text-1);
	white-space: nowrap;
}

/* ===== ARROW (round translucent-grey, dark chevron, at image height) ===== */

.e-788a2788 .arrow
{
	position: absolute;
	top: 29%;
	transform: translateY(-50%);
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: rgba(255, 255, 255, 0.85);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(15, 40, 70, 0.16);
	transition: background 240ms, transform 240ms;
}

.e-788a2788 .arrow:hover
{
	background: white;
	transform: translateY(-50%) scale(1.06);
}

.e-788a2788 .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

.e-788a2788 .arrow-next
{
	right: 12px;
}

/* ===== DOTS PAGINATION (active larger dark, inactive smaller light) ===== */

.e-788a2788 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 22px;
}

.e-788a2788 .dots > .dot
{
	width: 8px;
	height: 8px;
	padding: 0;
	background: #cfd6dd;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-788a2788 .dots > .dot:hover
{
	transform: scale(1.15);
}

.e-788a2788 .dots > .dot.is-active
{
	width: 11px;
	height: 11px;
	background: var(--ot-text-2);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-788a2788 .head > .title { font-size: 24px; }
}

@media (max-width: 640px)
{
	.e-788a2788 > .holder { padding: 22px 16px 26px; }
	.e-788a2788 .head > .title { font-size: 22px; }
	.e-788a2788 .cell { padding: 6px 7px; }
	.e-788a2788 .name-row > .name { font-size: 15px; }
	.e-788a2788 .price-block > .price { font-size: 18px; }
	.e-788a2788 .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-guest-favorites-1 ===== */
/* ===== BEGIN: section-guest-ranking-1 ===== */

.e-1b9b8319
{
	display: block;
	width: 100%;
	--gr-dark: #14181f;
	--gr-blue: #2f6feb;
	--gr-pink: #e6197d;
	--gr-orange: #f5a623;
	--gr-seal: #e4552e;
	--gr-green: #1f8a5f;
	--gr-grey: #6b7280;
	--gr-line: #e6e9f0;
}

.e-1b9b8319 > .holder
{
	display: block;
	width: 100%;
}

/* ===== NASLOVNI RED (sans-serif se forsira jer sites tema gura serif na h1-h6) ===== */

.e-1b9b8319 > .holder > .top
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 18px;
	margin: 0 0 24px 0;
}

.e-1b9b8319 > .holder > .top > .title
{
	margin: 0;
	padding: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	line-height: 1.15;
	font-weight: 800;
	color: var(--gr-dark);
}

.e-1b9b8319 > .holder > .top > .title > .script
{
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 38px;
	font-style: italic;
	font-weight: 400;
	color: var(--gr-pink);
}

.e-1b9b8319 > .holder > .top > .title > .lead
{
	white-space: pre-wrap;
}

.e-1b9b8319 > .holder > .top > .all-link
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	border-radius: 999px;
	background-color: var(--gr-blue);
	color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.e-1b9b8319 > .holder > .top > .all-link:hover
{
	background-color: #2359c4;
}

.e-1b9b8319 > .holder > .top > .all-link > i
{
	font-size: 18px;
	line-height: 1;
}

/* ===== DVE KOLONE (repeat(2, 1fr) puni red po red, pa 1 ide levo, 2 desno, 3 levo) ===== */

.e-1b9b8319 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: stretch;
	gap: 16px;
}

.e-1b9b8319 .row
{
	display: flex;
	align-items: center;
	gap: 16px;
	height: 100%;
	padding: 14px;
	border: 1px solid var(--gr-line);
	border-radius: 12px;
	background-color: #ffffff;
	text-decoration: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.e-1b9b8319 .row:hover
{
	border-color: #cfd6e4;
	box-shadow: 0 6px 18px rgba(20, 24, 31, 0.08);
	transform: translateY(-2px);
}

/* ===== SLICICA SA NALEPNICOM RANGA (broj je BRAT zvezde jer clip-path sece i potomke) ===== */

.e-1b9b8319 .row > .thumb
{
	position: relative;
	flex: 0 0 auto;
	width: 96px;
	height: 96px;
	border-radius: 12px;
	background-color: #eef0f5;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-1b9b8319 .row > .thumb > .seal
{
	position: absolute;
	top: 5px;
	left: 5px;
	width: 36px;
	height: 36px;
	background-color: #ffffff;
	filter: drop-shadow(0 1px 3px rgba(20, 24, 31, 0.25));
	clip-path: polygon(50% 0%, 65.7% 12.1%, 85.4% 14.6%, 87.9% 34.3%, 100% 50%, 87.9% 65.7%, 85.4% 85.4%, 65.7% 87.9%, 50% 100%, 34.3% 87.9%, 14.6% 85.4%, 12.1% 65.7%, 0% 50%, 12.1% 34.3%, 14.6% 14.6%, 34.3% 12.1%);
}

.e-1b9b8319 .row > .thumb > .rank
{
	position: absolute;
	top: 5px;
	left: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
	color: var(--gr-seal);
}

/* ===== SREDNJI DEO ===== */

.e-1b9b8319 .row > .mid
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	min-width: 0;
}

.e-1b9b8319 .row > .mid > .name
{
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--gr-dark);
}

.e-1b9b8319 .row > .mid > .stars
{
	font-size: 13px;
	line-height: 1;
	letter-spacing: 1px;
	color: var(--gr-orange);
}

.e-1b9b8319 .row > .mid > .place
{
	display: flex;
	align-items: center;
	gap: 7px;
}

.e-1b9b8319 .row > .mid > .place > .flag
{
	flex: 0 0 auto;
	width: 18px;
	height: 13px;
	border-radius: 2px;
	background-color: #eef0f5;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-1b9b8319 .row > .mid > .place > .location
{
	font-size: 13px;
	line-height: 1.35;
	color: var(--gr-grey);
}

.e-1b9b8319 .row > .mid > .rate
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 3px;
}

.e-1b9b8319 .row > .mid > .rate > .score
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	padding: 4px 8px;
	border-radius: 7px;
	background-color: var(--gr-green);
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
	color: #ffffff;
}

.e-1b9b8319 .row > .mid > .rate > .score-label
{
	font-size: 13px;
	font-weight: 700;
	color: var(--gr-green);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-1b9b8319 > .holder > .top > .title
	{
		font-size: 29px;
	}

	.e-1b9b8319 > .holder > .top > .title > .script
	{
		font-size: 33px;
	}

	.e-1b9b8319 .row > .thumb
	{
		width: 84px;
		height: 84px;
	}

	.e-1b9b8319 .row > .mid > .name
	{
		font-size: 17px;
	}
}

@media (max-width: 780px)
{
	.e-1b9b8319 > .holder > .grid
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px)
{
	.e-1b9b8319 > .holder > .top
	{
		align-items: flex-start;
		flex-direction: column;
		gap: 14px;
	}

	.e-1b9b8319 > .holder > .top > .title
	{
		font-size: 26px;
	}

	.e-1b9b8319 > .holder > .top > .title > .script
	{
		font-size: 30px;
	}

	.e-1b9b8319 .row
	{
		gap: 13px;
	}

	.e-1b9b8319 .row > .thumb
	{
		width: 76px;
		height: 76px;
	}

	.e-1b9b8319 .row > .mid > .name
	{
		font-size: 16px;
	}
}

/* ===== END: section-guest-ranking-1 ===== */
/* ===== BEGIN: section-header-hero-1 ===== */

.e-332ea520
{
	display: block;
	width: 100%;
}

.e-332ea520 > .holder
{
	width: 100%;
}

/* ===== DEO 1: gornja bela traka sa logom, jezikom, telefonom i alatkama ===== */

.e-332ea520 > .holder > .bar
{
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 14px 24px;
	background: #ffffff;
}

.e-332ea520 > .holder > .bar > .bar-logo
{
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 1px;
	color: #2f6feb;
	text-decoration: none;
}

.e-332ea520 > .holder > .bar > .bar-logo > img
{
	display: block;
	max-height: 40px;
	width: auto;
}

.e-332ea520 > .holder > .bar > .lang
{
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	margin: 0;
	padding: 6px 8px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 200ms ease;
}

.e-332ea520 > .holder > .bar > .lang:hover
{
	background: #f1f3f6;
}

.e-332ea520 > .holder > .bar > .lang > .lang-flag
{
	font-size: 15px;
	line-height: 1;
}

.e-332ea520 > .holder > .bar > .lang > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-332ea520 > .holder > .bar > .bar-phone
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	flex: 0 0 auto;
	margin-left: auto;
	text-decoration: none;
}

.e-332ea520 > .holder > .bar > .bar-phone > .bar-phone-note
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-332ea520 > .holder > .bar > .bar-phone > .bar-phone-number
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 16px;
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-332ea520 > .holder > .bar > .bar-phone > .bar-phone-number > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: #2f6feb;
}

.e-332ea520 > .holder > .bar > .tools
{
	display: flex;
	align-items: flex-start;
	gap: 18px;
	flex: 0 0 auto;
}

.e-332ea520 > .holder > .bar > .tools > .tool
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	width: 62px;
	text-decoration: none;
	color: var(--ot-text-1);
	transition: color 200ms ease;
}

.e-332ea520 > .holder > .bar > .tools > .tool:hover
{
	color: #2f6feb;
}

.e-332ea520 > .holder > .bar > .tools > .tool > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	font-weight: 300;
	font-style: normal;
	line-height: 1;
}

.e-332ea520 > .holder > .bar > .tools > .tool > .tool-label
{
	font-size: 10px;
	line-height: 1.25;
	text-align: center;
	color: var(--ot-text-3);
}

/* Opciono dugme skroz desno u traci — bez ctaLabel ga uopste nema u DOM-u. */

.e-332ea520 > .holder > .bar > .bar-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-height: 42px;
	padding: 0 22px;
	border-radius: 100px;
	background: #037ad5;
	font-size: 14px;
	font-weight: 800;
	white-space: nowrap;
	color: #ffffff;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-332ea520 > .holder > .bar > .bar-cta:hover
{
	background: #0265b1;
}

.e-332ea520 > .holder > .bar > .burger
{
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 8px;
	background: #ffffff;
	color: var(--ot-text-1);
	cursor: pointer;
}

.e-332ea520 > .holder > .bar > .burger > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

/* ===== DEO 2: navigacioni meni sa kategorijama ===== */

.e-332ea520 > .holder > .nav
{
	display: flex;
	align-items: center;
	gap: 26px;
	padding: 0 24px;
	min-height: 48px;
	background: #ffffff;
	border-bottom: 1px solid var(--ot-bg-3-border);
	overflow-x: auto;
	scrollbar-width: none;
}

.e-332ea520 > .holder > .nav::-webkit-scrollbar
{
	display: none;
}

.e-332ea520 > .holder > .nav > .nav-item
{
	display: flex;
	align-items: center;
	flex: 0 0 auto;
}

.e-332ea520 > .holder > .nav .nav-link
{
	display: flex;
	align-items: center;
	gap: 5px;
	flex: 0 0 auto;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	color: var(--ot-text-1);
	text-decoration: none;
	transition: color 200ms ease;
}

/* Stavka sa padajucim megamenijem je dugme, pa mu se skida podrazumevani izgled dugmeta. */

.e-332ea520 > .holder > .nav button.nav-link
{
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.e-332ea520 > .holder > .nav .nav-link:hover
{
	color: #2f6feb;
}

.e-332ea520 > .holder > .nav .nav-link.is-accent
{
	color: #e0701a;
}

.e-332ea520 > .holder > .nav .nav-link.is-accent:hover
{
	color: #c25c0d;
}

.e-332ea520 > .holder > .nav .nav-link > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

.e-332ea520 > .holder > .nav .nav-link > .nav-chevron
{
	font-size: 16px;
	opacity: 0.6;
}

/* ===== DEO 3: hero baner sa slajderom i formom za pretragu ===== */

.e-332ea520 > .holder > .hero
{
	position: relative;
	width: 100%;
	min-height: 620px;
	overflow: hidden;
	background: #24303a;
}

.e-332ea520 > .holder > .hero > .slide
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 900ms ease;
}

.e-332ea520 > .holder > .hero > .slide.active
{
	opacity: 1;
}

.e-332ea520 > .holder > .hero > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.32) 0%, rgba(0, 0, 0, 0.10) 45%, rgba(0, 0, 0, 0.30) 100%);
}

.e-332ea520 > .holder > .hero > .hero-content
{
	position: absolute;
	top: 90px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: min(92%, 900px);
	text-align: center;
}

.e-332ea520 > .holder > .hero > .hero-content > .hero-eyebrow
{
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	color: #ffffff;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.e-332ea520 > .holder > .hero > .hero-content > .hero-title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 58px;
	font-weight: 800;
	line-height: 1.1;
	color: #ffffff;
	text-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}

.e-332ea520 > .holder > .hero > .hero-content > .hero-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	margin-top: 6px;
	padding: 0 34px;
	border-radius: 999px;
	background: #ffffff;
	font-size: 15px;
	font-weight: 700;
	color: #2f6feb;
	text-decoration: none;
	transition: background 200ms ease, color 200ms ease;
}

.e-332ea520 > .holder > .hero > .hero-content > .hero-cta:hover
{
	background: #2f6feb;
	color: #ffffff;
}

.e-332ea520 > .holder > .hero > .hero-content > .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	margin-top: 6px;
}

.e-332ea520 > .holder > .hero > .hero-content > .dots > .dot
{
	width: 10px;
	height: 10px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-332ea520 > .holder > .hero > .hero-content > .dots > .dot.active
{
	background: #ffffff;
	transform: scale(1.25);
}

/* Blok pretrage koji lebdi preko donjeg dela fotografije. */

.e-332ea520 > .holder > .hero > .search
{
	position: absolute;
	left: 50%;
	bottom: 46px;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	width: min(94%, 1180px);
}

.e-332ea520 > .holder > .hero > .search > .tabs
{
	display: flex;
	align-items: flex-end;
	gap: 8px;
	padding: 0 10px;
	overflow-x: auto;
	scrollbar-width: none;
}

.e-332ea520 > .holder > .hero > .search > .tabs::-webkit-scrollbar
{
	display: none;
}

.e-332ea520 > .holder > .hero > .search > .tabs > .tab
{
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	margin: 0;
	padding: 10px 18px;
	border: 0;
	border-radius: 10px 10px 0 0;
	background: #2f6feb;
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	color: #ffffff;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease;
}

.e-332ea520 > .holder > .hero > .search > .tabs > .tab:hover
{
	background: #2559c4;
}

.e-332ea520 > .holder > .hero > .search > .tabs > .tab.active
{
	padding-bottom: 14px;
	margin-bottom: -4px;
	background: #ffffff;
	color: #24303a;
}

.e-332ea520 > .holder > .hero > .search > .tabs > .tab.active:hover
{
	background: #ffffff;
}

.e-332ea520 > .holder > .hero > .search > .tabs > .tab > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 17px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

.e-332ea520 > .holder > .hero > .search > .panel
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px;
	border-radius: 14px;
	background: #f5d94e;
}

.e-332ea520 > .holder > .hero > .search > .panel > .field
{
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 0;
	min-width: 0;
	min-height: 54px;
	padding: 0 14px;
	border-radius: 10px;
	background: #ffffff;
	cursor: pointer;
}

.e-332ea520 > .holder > .hero > .search > .panel > .field > .field-icon
{
	flex: 0 0 auto;
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: #2f6feb;
}

.e-332ea520 > .holder > .hero > .search > .panel > .field > .field-label
{
	flex: 1 1 auto;
	min-width: 0;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #24303a;
}

.e-332ea520 > .holder > .hero > .search > .panel > .field > .field-chev
{
	flex: 0 0 auto;
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-332ea520 > .holder > .hero > .search > .panel > .search-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex: 0 0 auto;
	min-height: 54px;
	margin: 0;
	padding: 0 34px;
	border: 0;
	border-radius: 10px;
	background: #2f6feb;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	cursor: pointer;
	transition: background 200ms ease;
}

.e-332ea520 > .holder > .hero > .search > .panel > .search-button:hover
{
	background: #2559c4;
}

.e-332ea520 > .holder > .hero > .search > .panel > .search-button > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1200px)
{
	.e-332ea520 > .holder > .bar > .tools > .tool
	{
		width: 54px;
	}

	.e-332ea520 > .holder > .hero > .hero-content > .hero-title
	{
		font-size: 48px;
	}
}

@media (max-width: 1024px)
{
	.e-332ea520 > .holder > .bar
	{
		gap: 14px;
		padding: 12px 18px;
	}

	.e-332ea520 > .holder > .bar > .tools
	{
		display: none;
	}

	.e-332ea520 > .holder > .bar > .burger
	{
		display: inline-flex;
	}

	.e-332ea520 > .holder > .bar > .bar-cta
	{
		min-height: 38px;
		padding: 0 16px;
		font-size: 13px;
	}

	.e-332ea520 > .holder > .nav
	{
		gap: 20px;
		padding: 0 18px;
	}

	.e-332ea520 > .holder > .hero
	{
		min-height: 640px;
	}

	.e-332ea520 > .holder > .hero > .search > .panel
	{
		flex-wrap: wrap;
	}

	.e-332ea520 > .holder > .hero > .search > .panel > .field
	{
		flex: 1 1 calc(50% - 5px);
	}

	.e-332ea520 > .holder > .hero > .search > .panel > .search-button
	{
		flex: 1 1 100%;
	}
}

@media (max-width: 640px)
{
	.e-332ea520 > .holder > .bar
	{
		flex-wrap: wrap;
		gap: 10px;
	}

	.e-332ea520 > .holder > .bar > .bar-phone > .bar-phone-number
	{
		font-size: 14px;
	}

	.e-332ea520 > .holder > .bar > .bar-cta
	{
		flex: 1 1 100%;
	}

	.e-332ea520 > .holder > .hero
	{
		min-height: 700px;
	}

	.e-332ea520 > .holder > .hero > .hero-content
	{
		top: 60px;
		gap: 12px;
	}

	.e-332ea520 > .holder > .hero > .hero-content > .hero-eyebrow
	{
		font-size: 15px;
	}

	.e-332ea520 > .holder > .hero > .hero-content > .hero-title
	{
		font-size: 32px;
	}

	.e-332ea520 > .holder > .hero > .search
	{
		bottom: 28px;
	}

	.e-332ea520 > .holder > .hero > .search > .panel > .field
	{
		flex: 1 1 100%;
	}
}

/* ===== END: section-header-hero-1 ===== */
/* ===== BEGIN: section-header-mozaik-1 ===== */

.e-477baf91
{
	display: block;
	width: 100%;
}

.e-477baf91 > .holder
{
	width: 100%;
}

/* ===== DEO 1: gornja bela traka sa logom, jezikom, pretragom, telefonom i alatkama ===== */

.e-477baf91 > .holder > .bar
{
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 14px 24px;
	background: #ffffff;
}

.e-477baf91 > .holder > .bar > .bar-logo
{
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 1px;
	color: #2f6feb;
	text-decoration: none;
}

.e-477baf91 > .holder > .bar > .bar-logo > img
{
	display: block;
	max-height: 34px;
	width: auto;
}

.e-477baf91 > .holder > .bar > .lang
{
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	margin: 0;
	padding: 6px 8px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 200ms ease;
}

.e-477baf91 > .holder > .bar > .lang:hover
{
	background: #f1f3f6;
}

.e-477baf91 > .holder > .bar > .lang > .lang-flag
{
	font-size: 15px;
	line-height: 1;
}

.e-477baf91 > .holder > .bar > .lang > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-477baf91 > .holder > .bar > .bar-search
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex: 0 0 auto;
	min-height: 42px;
	margin: 0 auto;
	padding: 0 22px;
	border-radius: 999px;
	background: #2f6feb;
	font-size: 14px;
	font-weight: 700;
	color: #ffffff;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-477baf91 > .holder > .bar > .bar-search:hover
{
	background: #2559c4;
}

.e-477baf91 > .holder > .bar > .bar-search > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

.e-477baf91 > .holder > .bar > .bar-phone
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	flex: 0 0 auto;
	text-decoration: none;
}

.e-477baf91 > .holder > .bar > .bar-phone > .bar-phone-note
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-477baf91 > .holder > .bar > .bar-phone > .bar-phone-number
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 16px;
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-477baf91 > .holder > .bar > .bar-phone > .bar-phone-number > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	color: #2f6feb;
}

.e-477baf91 > .holder > .bar > .tools
{
	display: flex;
	align-items: flex-start;
	gap: 18px;
	flex: 0 0 auto;
}

.e-477baf91 > .holder > .bar > .tools > .tool
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	width: 62px;
	text-decoration: none;
	color: var(--ot-text-1);
	transition: color 200ms ease;
}

.e-477baf91 > .holder > .bar > .tools > .tool:hover
{
	color: #2f6feb;
}

.e-477baf91 > .holder > .bar > .tools > .tool > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	font-weight: 300;
	font-style: normal;
	line-height: 1;
}

.e-477baf91 > .holder > .bar > .tools > .tool > .tool-label
{
	font-size: 10px;
	line-height: 1.25;
	text-align: center;
	color: var(--ot-text-3);
}

.e-477baf91 > .holder > .bar > .burger
{
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 8px;
	background: #ffffff;
	color: var(--ot-text-1);
	cursor: pointer;
}

.e-477baf91 > .holder > .bar > .burger > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

/* ===== DEO 2: navigacioni meni sa kategorijama ===== */

.e-477baf91 > .holder > .nav
{
	display: flex;
	align-items: center;
	gap: 26px;
	padding: 0 24px;
	min-height: 48px;
	background: #ffffff;
	border-bottom: 1px solid var(--ot-bg-3-border);
	overflow-x: auto;
	scrollbar-width: none;
}

.e-477baf91 > .holder > .nav::-webkit-scrollbar
{
	display: none;
}

.e-477baf91 > .holder > .nav > .nav-link
{
	display: flex;
	align-items: center;
	gap: 5px;
	flex: 0 0 auto;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	color: var(--ot-text-1);
	text-decoration: none;
	transition: color 200ms ease;
}

.e-477baf91 > .holder > .nav > .nav-link:hover
{
	color: #2f6feb;
}

.e-477baf91 > .holder > .nav > .nav-link.is-accent
{
	color: #e0701a;
}

.e-477baf91 > .holder > .nav > .nav-link.is-accent:hover
{
	color: #c25c0d;
}

.e-477baf91 > .holder > .nav > .nav-link > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
	line-height: 1;
}

/* ===== DEO 3: mozaik kategorija (masonry preko CSS kolona) ===== */

.e-477baf91 > .holder > .mozaik
{
	padding: 28px 24px 34px 24px;
	background: #f3f3f3;
}

.e-477baf91 > .holder > .mozaik > .grid
{
	column-count: 5;
	column-gap: 16px;
}

.e-477baf91 > .holder > .mozaik > .grid > .card
{
	display: block;
	margin: 0 0 20px 0;
	text-decoration: none;
	break-inside: avoid;
}

.e-477baf91 > .holder > .mozaik > .grid > .card > .card-image
{
	display: block;
	width: 100%;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 320ms ease, box-shadow 320ms ease;
}

.e-477baf91 > .holder > .mozaik > .grid > .card.is-square > .card-image
{
	aspect-ratio: 1 / 1;
}

.e-477baf91 > .holder > .mozaik > .grid > .card.is-tall > .card-image
{
	aspect-ratio: 3 / 4;
}

.e-477baf91 > .holder > .mozaik > .grid > .card.is-wide > .card-image
{
	aspect-ratio: 4 / 3;
}

.e-477baf91 > .holder > .mozaik > .grid > .card.is-big > .card-image
{
	aspect-ratio: 2 / 3;
}

.e-477baf91 > .holder > .mozaik > .grid > .card > .card-name
{
	display: block;
	margin-top: 10px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-align: center;
	color: #24303a;
	transition: color 200ms ease;
}

.e-477baf91 > .holder > .mozaik > .grid > .card:hover > .card-image
{
	transform: scale(1.03);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

.e-477baf91 > .holder > .mozaik > .grid > .card:hover > .card-name
{
	color: #2f6feb;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1200px)
{
	.e-477baf91 > .holder > .bar > .tools > .tool
	{
		width: 54px;
	}

	.e-477baf91 > .holder > .mozaik > .grid
	{
		column-count: 4;
	}
}

@media (max-width: 1024px)
{
	.e-477baf91 > .holder > .bar
	{
		gap: 14px;
		padding: 12px 18px;
	}

	.e-477baf91 > .holder > .bar > .tools
	{
		display: none;
	}

	.e-477baf91 > .holder > .bar > .burger
	{
		display: inline-flex;
	}

	.e-477baf91 > .holder > .nav
	{
		gap: 20px;
		padding: 0 18px;
	}

	.e-477baf91 > .holder > .mozaik
	{
		padding: 22px 18px 26px 18px;
	}

	.e-477baf91 > .holder > .mozaik > .grid
	{
		column-count: 3;
	}
}

@media (max-width: 640px)
{
	.e-477baf91 > .holder > .bar
	{
		flex-wrap: wrap;
		gap: 10px;
	}

	.e-477baf91 > .holder > .bar > .bar-search
	{
		order: 4;
		width: 100%;
		margin: 0;
	}

	.e-477baf91 > .holder > .bar > .bar-phone
	{
		margin-left: auto;
	}

	.e-477baf91 > .holder > .bar > .bar-phone > .bar-phone-number
	{
		font-size: 14px;
	}

	.e-477baf91 > .holder > .mozaik > .grid
	{
		column-count: 2;
		column-gap: 12px;
	}

	.e-477baf91 > .holder > .mozaik > .grid > .card
	{
		margin-bottom: 16px;
	}

	.e-477baf91 > .holder > .mozaik > .grid > .card > .card-name
	{
		font-size: 13px;
	}
}

/* ===== END: section-header-mozaik-1 ===== */
.e-4180a2e8
{
	display: block;
	width: 100%;
}

.e-4180a2e8 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ===== BORDERS ===== */

.e-4180a2e8 > .holder.border-top
{
	padding-top: 32px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-4180a2e8 > .holder.border-bottom
{
	padding-bottom: 32px;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

/* ===== ROW (text + aside) ===== */

.e-4180a2e8 > .holder > .row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
}

.e-4180a2e8 > .holder.align-center > .row
{
	justify-content: center;
	align-items: center;
}

/* ===== TEXT ===== */

.e-4180a2e8 .text
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
	max-width: 720px;
	flex: 1;
}

.e-4180a2e8 > .holder.align-center .text
{
	align-items: center;
	text-align: center;
	max-width: 820px;
	margin: 0 auto;
}

/* Eyebrow */

.e-4180a2e8 .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-4180a2e8 .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: var(--ot-brand);
}

.e-4180a2e8 > .holder.align-center .eyebrow
{
	justify-content: center;
}

/* Title */

.e-4180a2e8 .title
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.02;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-4180a2e8 .title em
{
	font-style: italic;
	color: var(--ot-brand);
	font-weight: 400;
}

.e-4180a2e8 > .holder.size-s   .title { font-size: 28px;  letter-spacing: -0.018em; line-height: 1.1;   }
.e-4180a2e8 > .holder.size-m   .title { font-size: 40px;  letter-spacing: -0.022em; line-height: 1.05;  }
.e-4180a2e8 > .holder.size-l   .title { font-size: 56px;  letter-spacing: -0.028em; line-height: 1.0;   }
.e-4180a2e8 > .holder.size-xl  .title { font-size: 76px;  letter-spacing: -0.035em; line-height: 0.96;  }

/* Description */

.e-4180a2e8 .description
{
	font-size: 15px;
	line-height: 1.65;
	color: var(--ot-text-2);
	margin: 0;
	max-width: 620px;
}

.e-4180a2e8 > .holder.size-s   .description { font-size: 13.5px; }
.e-4180a2e8 > .holder.size-l   .description,
.e-4180a2e8 > .holder.size-xl  .description { font-size: 16px; }

.e-4180a2e8 > .holder.align-center .description
{
	margin: 0 auto;
}

/* ===== ASIDE (index + right slot) ===== */

.e-4180a2e8 .aside
{
	display: flex;
	align-items: flex-end;
	gap: 24px;
	flex-shrink: 0;
}

.e-4180a2e8 > .holder.align-center .aside
{
	display: none;
}

.e-4180a2e8 .index
{
	font-family: var(--ot-font-secondary);
	font-size: 96px;
	font-weight: 300;
	line-height: 0.8;
	letter-spacing: -0.04em;
	color: var(--ot-bg-3);
	font-variation-settings: 'opsz' 144;
	user-select: none;
	pointer-events: none;
}

.e-4180a2e8 > .holder.size-s  .index { font-size: 64px; }
.e-4180a2e8 > .holder.size-l  .index { font-size: 120px; }
.e-4180a2e8 > .holder.size-xl .index { font-size: 144px; }

.e-4180a2e8 .right
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
}

/* ===== BOTTOM SLOT ===== */

.e-4180a2e8 > .holder > .bottom
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.e-4180a2e8 > .holder.align-center > .bottom
{
	justify-content: center;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-4180a2e8 > .holder
	{
		gap: 20px;
	}

	.e-4180a2e8 > .holder > .row
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.e-4180a2e8 > .holder.align-center > .row
	{
		align-items: center;
	}

	.e-4180a2e8 .index
	{
		display: none;
	}

	.e-4180a2e8 > .holder.size-l   .title { font-size: 40px; }
	.e-4180a2e8 > .holder.size-xl  .title { font-size: 48px; }
}
.e-a1f0e9c
{
	display: block;
	width: 100%;
}

.e-a1f0e9c > .holder
{
	position: relative;
	width: 100%;
}

/* ===== COVER =====
   Sa slikom hero postaje full-bleed box sa svojom pozadinom:
   tek tada nosi svoj padding/overflow/radius (izuzetak — element-kao-box). */

.e-a1f0e9c > .holder.has-image
{
	color: white;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	padding: 96px 40px 64px;
}

.e-a1f0e9c > .holder > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
}

.e-a1f0e9c > .holder > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	z-index: 0;
}

.e-a1f0e9c > .holder > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.45) 0%, rgba(20, 18, 16, 0.55) 60%, rgba(20, 18, 16, 0.78) 100%),
		linear-gradient(90deg, rgba(20, 18, 16, 0.4) 0%, rgba(20, 18, 16, 0.0) 60%);
}

/* ===== INNER ===== */

.e-a1f0e9c > .holder > .inner
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

/* Sa slikom: sadržaj se centrira unutar boksa (sekcijin container ga ne pokriva). */

.e-a1f0e9c > .holder.has-image > .inner
{
	max-width: 1100px;
	margin: 0 auto;
	width: 100%;
}

/* ===== BREADCRUMBS ===== */

.e-a1f0e9c .breadcrumbs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.e-a1f0e9c .crumb
{
	color: currentColor;
	opacity: 0.55;
	text-transform: uppercase;
	transition: opacity 180ms;
}

.e-a1f0e9c > .holder.has-image .crumb
{
	opacity: 0.75;
}

.e-a1f0e9c .crumb:hover
{
	opacity: 1;
}

.e-a1f0e9c .crumb.active
{
	opacity: 1;
	color: var(--ot-brand);
}

.e-a1f0e9c > .holder.has-image .crumb.active
{
	color: white;
}

.e-a1f0e9c .crumb:not(:last-child)::after
{
	content: '/';
	margin-left: 8px;
	opacity: 0.45;
}

/* ===== HEAD (title + count) ===== */

.e-a1f0e9c .head
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 48px;
}

.e-a1f0e9c .text
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 760px;
}

/* Eyebrow */

.e-a1f0e9c .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-a1f0e9c > .holder.has-image .eyebrow
{
	color: white;
}

.e-a1f0e9c .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: currentColor;
}

.e-a1f0e9c > .holder.has-image .eyebrow > .eyebrow-mark
{
	background: var(--ot-brand);
}

/* Title */

.e-a1f0e9c .title
{
	font-family: var(--ot-font-secondary);
	font-size: 76px;
	font-weight: 400;
	letter-spacing: -0.035em;
	line-height: 0.96;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-a1f0e9c > .holder.has-image .title
{
	color: white;
}

.e-a1f0e9c .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

/* Description */

.e-a1f0e9c .description
{
	font-size: 16px;
	line-height: 1.65;
	margin: 0;
	max-width: 580px;
	opacity: 0.85;
}

.e-a1f0e9c > .holder.has-image .description
{
	color: rgba(255, 254, 252, 0.92);
	opacity: 1;
}

/* Count */

.e-a1f0e9c .count
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex-shrink: 0;
	text-align: right;
	line-height: 1;
}

.e-a1f0e9c .count-value
{
	font-family: var(--ot-font-secondary);
	font-size: 56px;
	font-weight: 400;
	letter-spacing: -0.03em;
	font-variation-settings: 'opsz' 144;
}

.e-a1f0e9c > .holder.has-image .count-value
{
	color: white;
}

.e-a1f0e9c .count-label
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	opacity: 0.7;
	margin-top: 6px;
}

.e-a1f0e9c > .holder.has-image .count-label
{
	color: white;
	opacity: 0.78;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-a1f0e9c > .holder.has-image
	{
		padding: 64px 24px 48px;
	}

	.e-a1f0e9c > .holder > .inner
	{
		gap: 24px;
	}

	.e-a1f0e9c .head
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}

	.e-a1f0e9c .title
	{
		font-size: 48px;
	}

	.e-a1f0e9c .count
	{
		text-align: left;
	}

	.e-a1f0e9c .count-value
	{
		font-size: 36px;
	}
}
/* ===== BEGIN: section-hero-lastminute-1 ===== */

.e-fef9bfd
{
	display: block;
	width: 100%;
}

.e-fef9bfd > .holder
{
	position: relative;
	width: 100%;
	padding-bottom: 54px;
}

/* Bez plutajuce pretrage nema sta da preklopi donju ivicu slike — rezervisani prostor otpada. */

.e-fef9bfd > .holder.is-plain
{
	padding-bottom: 0;
}

/* ===== STAGE (velika slika sa zaobljenim uglovima) ===== */

.e-fef9bfd .stage
{
	position: relative;
	display: block;
	width: 100%;
	min-height: 640px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	outline: none;
}

.e-fef9bfd .slide
{
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.6s ease;
}

.e-fef9bfd .slide.active
{
	opacity: 1;
	pointer-events: auto;
}

.e-fef9bfd .slide-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: #d9d2c8;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-fef9bfd .scrim
{
	position: absolute;
	inset: 0;
	display: block;
	background: rgba(0, 0, 0, 0.28);
}

/* ===== MENI (preko slike, sav tekst beo) ===== */

.e-fef9bfd .menu
{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 22px 32px;
}

.e-fef9bfd .menu-logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #f57c00;
	color: #ffffff;
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 0.02em;
	text-decoration: none;
	overflow: hidden;
}

.e-fef9bfd .menu-logo > img
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.e-fef9bfd .menu-button
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	height: 40px;
	padding: 0 20px;
	border-radius: 999px;
	background: #f57c00;
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-fef9bfd .menu-button:hover
{
	background: #e06f00;
}

.e-fef9bfd .menu-nav
{
	display: flex;
	align-items: center;
	gap: 20px;
	flex: 1 1 auto;
	min-width: 0;
}

.e-fef9bfd .menu-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #ffffff;
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
	transition: opacity var(--ot-transition);
}

.e-fef9bfd .menu-link:hover
{
	opacity: 0.75;
}

.e-fef9bfd .menu-link > i
{
	font-size: 19px;
}

.e-fef9bfd .menu-icons
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex: 0 0 auto;
}

.e-fef9bfd .menu-icon
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #ffffff;
	font-weight: 600;
	font-size: 14px;
	white-space: nowrap;
	text-decoration: none;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
	transition: opacity var(--ot-transition);
}

.e-fef9bfd .menu-icon:hover
{
	opacity: 0.75;
}

.e-fef9bfd .menu-icon > i
{
	font-size: 21px;
}

.e-fef9bfd .menu-avatar
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.18);
	color: #ffffff;
	overflow: hidden;
}

.e-fef9bfd .menu-avatar > img
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.e-fef9bfd .menu-avatar > i
{
	font-size: 21px;
}

/* ===== KRAJNJE DESNO U MENIJU (telefon + dugme) ===== */

.e-fef9bfd .menu-end
{
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 0 0 auto;
}

.e-fef9bfd .menu-phone
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #ffffff;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
	transition: opacity var(--ot-transition);
}

.e-fef9bfd .menu-phone:hover
{
	opacity: 0.75;
}

.e-fef9bfd .menu-phone > i
{
	font-size: 19px;
}

.e-fef9bfd .menu-cta
{
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 20px;
	border-radius: 999px;
	background: #f57c00;
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-fef9bfd .menu-cta:hover
{
	background: #e06f00;
}

.e-fef9bfd .menu-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	margin-left: auto;
	padding: 0;
	border: none;
	background: none;
	color: #ffffff;
	cursor: pointer;
}

.e-fef9bfd .menu-burger > i
{
	font-size: 28px;
}

/* ===== HERO TEKST (centriran po visini, levo poravnat) ===== */

.e-fef9bfd .stage-content
{
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: 100%;
	max-width: 720px;
	padding: 0 32px;
	transform: translateY(-50%);
}

.e-fef9bfd .hero-eyebrow
{
	color: #ffffff;
	font-weight: 600;
	font-size: 16px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.e-fef9bfd .hero-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 800;
	font-size: clamp(34px, 4.4vw, 62px);
	line-height: 1.08;
	letter-spacing: -0.02em;
	text-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

.e-fef9bfd .hero-subtitle
{
	margin: 0;
	color: #ffffff;
	font-weight: 500;
	font-size: 18px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.e-fef9bfd .hero-cta
{
	display: inline-flex;
	align-items: center;
	margin-top: 8px;
	height: 52px;
	padding: 0 30px;
	border-radius: 999px;
	background: #f57c00;
	color: #ffffff;
	font-weight: 700;
	font-size: 16px;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-fef9bfd .hero-cta:hover
{
	background: #e06f00;
}

/* ===== KAROSEL KONTROLE (dole desno preko slike) ===== */

.e-fef9bfd .controls
{
	position: absolute;
	right: 32px;
	bottom: 96px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
}

/* Bez pretrage kontrole se spustaju ka dnu slike — 96px je bio razmak za plutajucu traku. */

.e-fef9bfd > .holder.is-plain .controls
{
	bottom: 28px;
}

.e-fef9bfd .control-row
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.e-fef9bfd .control
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: #ffffff;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	transition: background var(--ot-transition);
}

.e-fef9bfd .control:hover
{
	background: #f1f1f1;
}

.e-fef9bfd .control > i
{
	font-size: 22px;
}

.e-fef9bfd .track
{
	display: block;
	width: 158px;
	height: 3px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.45);
	overflow: hidden;
}

.e-fef9bfd .track-fill
{
	display: block;
	height: 100%;
	border-radius: 999px;
	background: #f57c00;
}

/* ===== TRAKA ZA PRETRAGU (pluta preko donje ivice slike) ===== */

.e-fef9bfd .search
{
	position: absolute;
	left: 32px;
	right: 32px;
	bottom: 0;
	z-index: 4;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 10px 10px 28px;
	border-radius: 999px;
	background: #ffffff;
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.16);
}

.e-fef9bfd .field
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1 1 0;
	min-width: 0;
	padding: 6px 18px 6px 0;
}

.e-fef9bfd .field-title
{
	color: var(--ot-text-3);
	font-weight: 600;
	font-size: 12px;
}

.e-fef9bfd .field-value
{
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-fef9bfd .divider
{
	display: block;
	flex: 0 0 auto;
	width: 1px;
	height: 36px;
	background: var(--ot-bg-3-border);
}

.e-fef9bfd .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	height: 56px;
	padding: 0 42px;
	border: none;
	border-radius: 999px;
	background: #f57c00;
	color: #ffffff;
	font-weight: 700;
	font-size: 16px;
	cursor: pointer;
	transition: background var(--ot-transition);
}

.e-fef9bfd .search-button:hover
{
	background: #e06f00;
}

/* ===== RESPONZIVNO ===== */

@media (max-width: 1200px)
{
	.e-fef9bfd .menu-icon > span
	{
		display: none;
	}

	.e-fef9bfd .menu-nav
	{
		gap: 14px;
	}
}

@media (max-width: 1024px)
{
	.e-fef9bfd .menu-nav,
	.e-fef9bfd .menu-icons,
	.e-fef9bfd .menu-end
	{
		display: none;
	}

	.e-fef9bfd .menu-burger
	{
		display: inline-flex;
	}

	.e-fef9bfd .stage
	{
		min-height: 560px;
	}

	.e-fef9bfd .field-value
	{
		font-size: 14px;
	}

	.e-fef9bfd .search-button
	{
		padding: 0 28px;
	}
}

@media (max-width: 760px)
{
	.e-fef9bfd > .holder
	{
		padding-bottom: 0;
	}

	.e-fef9bfd .stage
	{
		min-height: 480px;
	}

	.e-fef9bfd .menu
	{
		padding: 16px 18px;
	}

	.e-fef9bfd .stage-content
	{
		padding: 0 18px;
	}

	.e-fef9bfd .controls
	{
		right: 18px;
		bottom: 22px;
	}

	.e-fef9bfd .track
	{
		width: 110px;
	}

	.e-fef9bfd .search
	{
		position: static;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		margin-top: 16px;
		padding: 10px 18px 18px;
		border-radius: var(--ot-radius-l);
	}

	.e-fef9bfd .field
	{
		padding: 10px 0;
	}

	.e-fef9bfd .field-value
	{
		white-space: normal;
	}

	.e-fef9bfd .divider
	{
		width: 100%;
		height: 1px;
	}

	.e-fef9bfd .search-button
	{
		width: 100%;
		margin-top: 14px;
	}
}

/* ===== END: section-hero-lastminute-1 ===== */
/* ===== BEGIN: section-hero-search-1 ===== */

.e-158a9481
{
	display: block;
	width: 100%;
}

.e-158a9481 > .holder
{
	width: 100%;
}

/* ===== SLIDER (full-width, edge to edge, tall) ===== */

.e-158a9481 .slider
{
	position: relative;
	width: 100%;
	height: 82vh;
	min-height: 560px;
	overflow: hidden;
	outline: none;
}

.e-158a9481 .slide
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 900ms ease;
	pointer-events: none;
}

.e-158a9481 .slide.active
{
	opacity: 1;
	pointer-events: auto;
}

/* Vrlo blag preliv radi citljivosti — slika ostaje svetla. */

.e-158a9481 .slide > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.04) 34%, rgba(0, 0, 0, 0.00) 60%);
}

/* ===== SLIDE CONTENT (centriran, gornja/srednja trecina) ===== */

.e-158a9481 .slide-content
{
	position: absolute;
	top: 20%;
	left: 50%;
	transform: translateX(-50%);
	width: min(90%, 900px);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 22px;
}

.e-158a9481 .slide-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	line-height: 1.05;
	font-size: 60px;
	text-shadow: 0 3px 18px rgba(0, 0, 0, 0.45);
}

.e-158a9481 .slide-subtitle
{
	margin: 0;
	color: #ffffff;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.5;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

.e-158a9481 .slide-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	background: var(--ot-blue);
	color: #ffffff;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border-radius: 8px;
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9481 .slide-cta:hover
{
	background: var(--ot-blue-hover);
	transform: translateY(-2px);
}

/* ===== ARROWS (kruzne, tanak beli okvir, providne) ===== */

.e-158a9481 .arrow
{
	position: absolute;
	top: 40%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.85);
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
	cursor: pointer;
	z-index: 3;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9481 .arrow:hover
{
	background: rgba(255, 255, 255, 0.24);
}

.e-158a9481 .arrow > i
{
	font-size: 26px;
}

.e-158a9481 .arrow-prev
{
	left: 28px;
}

.e-158a9481 .arrow-next
{
	right: 28px;
}

/* ===== SEARCH (lebdi preko donjeg dela slajdera) ===== */

.e-158a9481 .search
{
	position: absolute;
	left: 50%;
	bottom: 44px;
	transform: translateX(-50%);
	width: min(94%, 980px);
	z-index: 4;
}

.e-158a9481 .tabs
{
	display: flex;
	gap: 4px;
	padding-left: 18px;
}

.e-158a9481 .tab
{
	padding: 10px 22px;
	border: none;
	border-radius: 12px 12px 0 0;
	background: rgba(255, 255, 255, 0.86);
	color: var(--ot-text-2);
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-158a9481 .tab:hover
{
	background: #ffffff;
	color: var(--ot-text-1);
}

.e-158a9481 .tab.active
{
	background: #2b2a6b;
	color: #ffffff;
}

.e-158a9481 .tab.active:hover
{
	background: #232159;
	color: #ffffff;
}

/* ===== FORM (beli kapsula-blok) ===== */

.e-158a9481 .form
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 10px 10px 28px;
	background: #ffffff;
	border-radius: 999px;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
}

.e-158a9481 .field
{
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1 1 0;
	min-width: 0;
	padding: 8px 4px;
}

.e-158a9481 .field-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #7c8aa5;
	flex: 0 0 auto;
}

.e-158a9481 .field-icon > i
{
	font-size: 26px;
}

.e-158a9481 .field-text
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.e-158a9481 .field-title
{
	font-weight: 700;
	font-size: 13px;
	color: var(--ot-text-1);
}

.e-158a9481 .field-placeholder
{
	font-size: 14px;
	color: var(--ot-text-3);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-158a9481 .divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	margin: 6px 0;
	background: var(--ot-bg-3-border);
}

.e-158a9481 .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex: 0 0 auto;
	padding: 14px 30px;
	border: none;
	border-radius: 999px;
	background: #2b2a6b;
	color: #ffffff;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9481 .search-button:hover
{
	background: #232159;
	transform: translateY(-1px);
}

.e-158a9481 .search-button > i
{
	font-size: 20px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-158a9481 .slider
	{
		height: 74vh;
		min-height: 500px;
	}

	.e-158a9481 .slide-title
	{
		font-size: 44px;
	}

	.e-158a9481 .slide-subtitle
	{
		font-size: 18px;
	}

	.e-158a9481 .arrow
	{
		width: 44px;
		height: 44px;
	}

	.e-158a9481 .arrow > i
	{
		font-size: 22px;
	}

	.e-158a9481 .arrow-prev
	{
		left: 14px;
	}

	.e-158a9481 .arrow-next
	{
		right: 14px;
	}
}

@media (max-width: 640px)
{
	.e-158a9481 .slider
	{
		height: auto;
		min-height: 0;
		padding-bottom: 24px;
	}

	.e-158a9481 .slide
	{
		position: relative;
		height: 78vh;
		min-height: 460px;
	}

	.e-158a9481 .slide:not(.active)
	{
		display: none;
	}

	.e-158a9481 .slide-title
	{
		font-size: 34px;
	}

	.e-158a9481 .slide-subtitle
	{
		font-size: 16px;
	}

	.e-158a9481 .arrow
	{
		display: none;
	}

	.e-158a9481 .search
	{
		position: relative;
		left: auto;
		bottom: auto;
		transform: none;
		width: calc(100% - 32px);
		margin: -60px auto 0;
	}

	.e-158a9481 .form
	{
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		padding: 16px;
		border-radius: 20px;
	}

	.e-158a9481 .field
	{
		width: 100%;
		padding: 10px 6px;
	}

	.e-158a9481 .divider
	{
		width: auto;
		height: 1px;
		align-self: auto;
		margin: 0 4px;
	}

	.e-158a9481 .search-button
	{
		width: 100%;
		margin-top: 8px;
		padding: 14px 24px;
	}
}

/* ===== END: section-hero-search-1 ===== */
/* ===== BEGIN: section-hero-search-2 ===== */

.e-158a9482
{
	display: block;
	width: 100%;
}

.e-158a9482 > .holder
{
	width: 100%;
}

/* ===== SLIDER (full-width, edge to edge, tall) ===== */

.e-158a9482 .slider
{
	position: relative;
	width: 100%;
	height: 82vh;
	min-height: 560px;
	overflow: hidden;
	outline: none;
}

/* Tanka narandzasta akcentna traka po gornjoj ivici. */

.e-158a9482 .accent
{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: var(--ot-orange);
	z-index: 5;
}

.e-158a9482 .slide
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 900ms ease;
	pointer-events: none;
}

.e-158a9482 .slide.active
{
	opacity: 1;
	pointer-events: auto;
}

/* Vrlo blag tamni preliv radi citljivosti teksta. */

.e-158a9482 .slide > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.12) 40%, rgba(0, 0, 0, 0.06) 70%, rgba(0, 0, 0, 0.18) 100%);
}

/* ===== SLIDE CONTENT (centriran, gornja polovina) ===== */

.e-158a9482 .slide-content
{
	position: absolute;
	top: 18%;
	left: 50%;
	transform: translateX(-50%);
	width: min(90%, 900px);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 18px;
}

.e-158a9482 .slide-eyebrow
{
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

.e-158a9482 .slide-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	line-height: 1.02;
	font-size: 72px;
	text-shadow: 0 3px 18px rgba(0, 0, 0, 0.45);
}

.e-158a9482 .slide-promo
{
	margin: 0;
	color: #ffffff;
	font-weight: 700;
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

.e-158a9482 .slide-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 6px;
	padding: 12px 26px;
	background: var(--ot-blue);
	color: #ffffff;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border-radius: 8px;
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9482 .slide-cta:hover
{
	background: var(--ot-blue-hover);
	transform: translateY(-2px);
}

/* ===== ARROWS (kruzne, tanak beli okvir, providne) ===== */

.e-158a9482 .arrow
{
	position: absolute;
	top: 38%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.85);
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
	cursor: pointer;
	z-index: 3;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9482 .arrow:hover
{
	background: rgba(255, 255, 255, 0.24);
}

.e-158a9482 .arrow > i
{
	font-size: 26px;
}

.e-158a9482 .arrow-prev
{
	left: 28px;
}

.e-158a9482 .arrow-next
{
	right: 28px;
}

/* ===== SEARCH (lebdi preko donjeg dela slajdera) ===== */

.e-158a9482 .search
{
	position: absolute;
	left: 50%;
	bottom: 44px;
	transform: translateX(-50%);
	width: min(94%, 1040px);
	z-index: 4;
}

/* ===== TABS (pill kartice na vrhu forme) ===== */

.e-158a9482 .tabs
{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	padding-left: 14px;
}

.e-158a9482 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: none;
	border-radius: 12px 12px 0 0;
	background: rgba(255, 255, 255, 0.9);
	color: var(--ot-text-1);
	font-weight: 700;
	font-size: 12px;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-158a9482 .tab > i
{
	font-size: 18px;
}

.e-158a9482 .tab:hover
{
	background: #ffffff;
}

.e-158a9482 .tab.active
{
	background: var(--ot-blue);
	color: #ffffff;
}

.e-158a9482 .tab.active:hover
{
	background: var(--ot-blue-hover);
	color: #ffffff;
}

/* ===== FORM (beli blok ispod tabova) ===== */

.e-158a9482 .form
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 10px 10px 24px;
	background: #ffffff;
	border-radius: 0 14px 14px 14px;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
}

.e-158a9482 .field
{
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1 1 0;
	min-width: 0;
	padding: 8px 4px;
}

.e-158a9482 .field-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #7c8aa5;
	flex: 0 0 auto;
}

.e-158a9482 .field-icon > i
{
	font-size: 26px;
}

.e-158a9482 .field-text
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.e-158a9482 .field-title
{
	font-weight: 700;
	font-size: 13px;
	color: var(--ot-text-1);
}

.e-158a9482 .field-placeholder
{
	font-size: 14px;
	color: var(--ot-text-3);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-158a9482 .divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	margin: 6px 0;
	background: var(--ot-bg-3-border);
}

.e-158a9482 .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex: 0 0 auto;
	padding: 16px 32px;
	border: none;
	border-radius: 10px;
	background: var(--ot-orange);
	color: #ffffff;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-158a9482 .search-button:hover
{
	background: var(--ot-orange-hover);
	transform: translateY(-1px);
}

.e-158a9482 .search-button > i
{
	font-size: 20px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-158a9482 .slider
	{
		height: 74vh;
		min-height: 500px;
	}

	.e-158a9482 .slide-title
	{
		font-size: 52px;
	}

	.e-158a9482 .slide-promo
	{
		font-size: 16px;
	}

	.e-158a9482 .arrow
	{
		width: 44px;
		height: 44px;
	}

	.e-158a9482 .arrow > i
	{
		font-size: 22px;
	}

	.e-158a9482 .arrow-prev
	{
		left: 14px;
	}

	.e-158a9482 .arrow-next
	{
		right: 14px;
	}
}

@media (max-width: 640px)
{
	.e-158a9482 .slider
	{
		height: auto;
		min-height: 0;
		padding-bottom: 24px;
	}

	.e-158a9482 .slide
	{
		position: relative;
		height: 78vh;
		min-height: 460px;
	}

	.e-158a9482 .slide:not(.active)
	{
		display: none;
	}

	.e-158a9482 .slide-title
	{
		font-size: 40px;
	}

	.e-158a9482 .slide-promo
	{
		font-size: 15px;
	}

	.e-158a9482 .arrow
	{
		display: none;
	}

	.e-158a9482 .search
	{
		position: relative;
		left: auto;
		bottom: auto;
		transform: none;
		width: calc(100% - 32px);
		margin: -60px auto 0;
	}

	.e-158a9482 .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-left: 8px;
		scrollbar-width: none;
	}

	.e-158a9482 .tabs::-webkit-scrollbar
	{
		display: none;
	}

	.e-158a9482 .tab
	{
		flex: 0 0 auto;
	}

	.e-158a9482 .form
	{
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		padding: 16px;
		border-radius: 0 14px 14px 14px;
	}

	.e-158a9482 .field
	{
		width: 100%;
		padding: 10px 6px;
	}

	.e-158a9482 .divider
	{
		width: auto;
		height: 1px;
		align-self: auto;
		margin: 0 4px;
	}

	.e-158a9482 .search-button
	{
		width: 100%;
		margin-top: 8px;
		padding: 14px 24px;
	}
}

/* ===== END: section-hero-search-2 ===== */
.e-14474df
{
	display: block;
	width: 100%;
}

.e-14474df > .holder
{
	width: 100%;
}

.e-14474df > .holder > .inner
{
	display: flex;
	flex-direction: column;
	gap: 28px;
}

/* ===== BREADCRUMBS ===== */

.e-14474df .breadcrumbs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.e-14474df .crumb
{
	color: currentColor;
	opacity: 0.55;
	text-transform: uppercase;
	transition: opacity 180ms;
}

.e-14474df .crumb:hover  { opacity: 1; }
.e-14474df .crumb.active { opacity: 1; color: var(--ot-brand); }

.e-14474df .crumb:not(:last-child)::after
{
	content: '/';
	margin-left: 8px;
	opacity: 0.45;
}

/* ===== HEADER (text + actions) ===== */

.e-14474df .header
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 32px;
}

.e-14474df .text
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 920px;
	min-width: 0;
}

/* ===== META CHIPS ===== */

.e-14474df .meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 4px;
}

.e-14474df .meta-chip
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: 0.005em;
}

.e-14474df .meta-chip > i
{
	font-size: 14px;
	color: var(--ot-text-3);
}

.e-14474df .meta-chip > .flag
{
	font-size: 14px;
	line-height: 1;
}

.e-14474df .meta-chip > .stars
{
	display: inline-flex;
	gap: 1px;
}

.e-14474df .meta-chip > .stars > i
{
	font-size: 12px;
	color: rgba(220, 165, 50, 1);
	font-variation-settings: 'FILL' 1;
}

/* Tone variants */

.e-14474df .meta-chip.meta-brand
{
	background: var(--ot-brand-opacity);
	border-color: transparent;
	color: var(--ot-brand);
}

.e-14474df .meta-chip.meta-brand > i
{
	color: var(--ot-brand);
}

.e-14474df .meta-chip.meta-dark
{
	background: var(--ot-text-1);
	border-color: var(--ot-text-1);
	color: white;
}

.e-14474df .meta-chip.meta-dark > i
{
	color: rgba(255, 255, 255, 0.85);
}

.e-14474df .meta-chip.meta-green
{
	background: rgba(20, 144, 95, 0.12);
	border-color: transparent;
	color: rgba(20, 144, 95, 1);
}

.e-14474df .meta-chip.meta-green > i
{
	color: rgba(20, 144, 95, 1);
}

/* ===== EYEBROW ===== */

.e-14474df .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-14474df .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: var(--ot-brand);
}

/* ===== TITLE ===== */

.e-14474df .title
{
	font-family: var(--ot-font-secondary);
	font-size: 64px;
	font-weight: 400;
	letter-spacing: -0.032em;
	line-height: 0.98;
	margin: 0;
	font-variation-settings: 'opsz' 144;
	color: currentColor;
}

.e-14474df .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

/* ===== LEAD ===== */

.e-14474df .lead
{
	font-size: 17px;
	line-height: 1.6;
	margin: 4px 0 0;
	max-width: 720px;
	opacity: 0.85;
}

/* ===== CODE ===== */

.e-14474df .code
{
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
	margin-top: 8px;
	font-family: var(--ot-font-primary);
}

.e-14474df .code-label
{
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	opacity: 0.55;
}

.e-14474df .code-value
{
	font-family: var(--ot-font-secondary);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
	font-variation-settings: 'opsz' 144;
}

/* ===== ACTIONS (top right) ===== */

.e-14474df .actions
{
	display: inline-flex;
	gap: 4px;
	flex-shrink: 0;
	margin-top: 4px;
}

.e-14474df .action
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	color: var(--ot-text-2);
	cursor: pointer;
	font: inherit;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms, border-color 220ms, transform 220ms;
}

.e-14474df .action:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
	transform: scale(1.04);
}

.e-14474df .action.active
{
	background: var(--ot-brand-opacity);
	border-color: var(--ot-brand);
	color: var(--ot-brand);
}

.e-14474df .action.active:hover
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: white;
}

.e-14474df .action > i
{
	font-size: 19px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-14474df > .holder > .inner
	{
		gap: 22px;
	}

	.e-14474df .header
	{
		flex-direction: column;
		gap: 20px;
	}

	.e-14474df .title
	{
		font-size: 40px;
	}

	.e-14474df .lead
	{
		font-size: 15px;
	}

	.e-14474df .actions
	{
		margin-top: 0;
	}

	.e-14474df .action
	{
		width: 38px;
		height: 38px;
	}
}
/* ===== BEGIN: section-hero-slider-2 (veliki hero slajder u stilu plave mozaik-2 sekcije) ===== */

.e-6b474285
{
	display: block;
	width: 100%;
}

.e-6b474285 > .holder
{
	width: 100%;
}

/* ===== STAGE (full-bleed okvir sa svim slajdovima jedan preko drugog) ===== */

.e-6b474285 > .holder > .stage
{
	position: relative;
	width: 100%;
	height: clamp(440px, 72vh, 760px);
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background-color: #037ad5;
	box-shadow: 0 18px 42px rgba(3, 122, 213, 0.22);
	outline: none;
}

/* ===== BLEED (opt-in: cela sirina sajta, bez zaobljenih ivica i senke) ===== */

.e-6b474285 > .holder.is-bleed > .stage
{
	border-radius: 0;
	box-shadow: none;
}

/* ===== SLIDE (crossfade preko opacity, aktivni je vidljiv) ===== */

.e-6b474285 > .holder > .stage > .slide
{
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474285 > .holder > .stage > .slide.active
{
	opacity: 1;
	visibility: visible;
}

/* ===== IMAGE (clean full-cover, nežni zoom na aktivnom slajdu) ===== */

.e-6b474285 > .holder > .stage > .slide > .slide-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transform: scale(1.02);
	transition: transform 6000ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474285 > .holder > .stage > .slide.active > .slide-image
{
	transform: scale(1.08);
}

/* ===== INNER (centrira krug preko cele scene) ===== */

.e-6b474285 > .holder > .stage > .slide > .slide-inner
{
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: clamp(20px, 4vw, 48px);
	max-width: none;
}

/* ===== CIRCLE (centralni plavi providni krug sa kompletnim tekstom) ===== */

.e-6b474285 > .holder > .stage > .slide > .slide-inner > .slide-circle
{
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	width: clamp(300px, 60vw, 560px);
	aspect-ratio: 1 / 1;
	max-width: 100%;
	max-height: 100%;
	padding: clamp(28px, 5vw, 56px);
	overflow: hidden;
	text-align: center;
	border-radius: 50%;
	background: rgba(3, 122, 213, 0.66);
	backdrop-filter: blur(2px);
	box-shadow: 0 18px 42px rgba(3, 122, 213, 0.28);
}

/* ===== STRAPS (dve zakošene parallelogram trake, centrirane, jedna ispod druge) ===== */

.e-6b474285 .straps
{
	position: static;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}

.e-6b474285 .straps > .strap
{
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: 0;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(3, 122, 213, 0.24);
	transform: skewX(-14deg);
}

.e-6b474285 .straps .strap-text
{
	display: block;
	transform: skewX(14deg);
	text-align: center;
	color: white;
}

/* Gornja traka — plava, uži eyebrow */

.e-6b474285 .straps > .strap-eyebrow
{
	z-index: 3;
	padding: 7px 22px;
	background: #037ad5;
}

.e-6b474285 .straps > .strap-eyebrow > .strap-text
{
	font-weight: 800;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* Donja traka — plava, žuti tekst */

.e-6b474285 .straps > .strap-price
{
	z-index: 2;
	padding: 8px 30px;
	background: #037ad5;
}

.e-6b474285 .straps > .strap-price > .strap-text
{
	font-weight: 800;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.01em;
	color: #f5c518;
}

/* ===== TITLE / DESCRIPTION / CTA ===== */

.e-6b474285 > .holder > .stage .slide-title
{
	margin: 0;
	font-weight: 800;
	font-size: clamp(30px, 4vw, 52px);
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: white;
	text-shadow: 0 6px 24px rgba(3, 122, 213, 0.35);
}

.e-6b474285 > .holder > .stage .slide-description
{
	margin: 0;
	max-width: 320px;
	font-weight: 400;
	font-size: clamp(14px, 1.4vw, 17px);
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.92);
	text-shadow: 0 2px 12px rgba(3, 122, 213, 0.35);
}

.e-6b474285 > .holder > .stage .slide-cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
	padding: 13px 26px;
	background: #037ad5;
	color: white;
	border-radius: 100px;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(3, 122, 213, 0.24);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6b474285 > .holder > .stage .slide-cta:hover
{
	transform: translateY(-3px);
	box-shadow: 0 16px 36px rgba(3, 122, 213, 0.32);
}

.e-6b474285 > .holder > .stage .slide-cta > i
{
	font-size: 20px;
}

/* ===== ARROWS ===== */

.e-6b474285 > .holder > .stage > .stage-arrow
{
	position: absolute;
	top: 50%;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.16);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	color: white;
	cursor: pointer;
	backdrop-filter: blur(6px);
	transition: background 320ms ease, transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474285 > .holder > .stage > .stage-arrow:hover
{
	background: #037ad5;
	border-color: #037ad5;
}

.e-6b474285 > .holder > .stage > .stage-arrow-prev
{
	left: 20px;
}

.e-6b474285 > .holder > .stage > .stage-arrow-next
{
	right: 20px;
}

.e-6b474285 > .holder > .stage > .stage-arrow > i
{
	font-size: 24px;
}

/* ===== DOTS (sa progresom autoplay-a na aktivnom) ===== */

.e-6b474285 > .holder > .stage > .stage-dots
{
	position: absolute;
	left: 50%;
	bottom: 24px;
	z-index: 4;
	display: flex;
	gap: 10px;
	transform: translateX(-50%);
}

.e-6b474285 > .holder > .stage > .stage-dots > .dot
{
	position: relative;
	width: 34px;
	height: 6px;
	padding: 0;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.4);
	border: none;
	border-radius: 100px;
	cursor: pointer;
	transition: background 320ms ease;
}

.e-6b474285 > .holder > .stage > .stage-dots > .dot.active
{
	background: rgba(255, 255, 255, 0.4);
}

.e-6b474285 > .holder > .stage > .stage-dots > .dot > .dot-progress
{
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	background: #f5c518;
	border-radius: 100px;
}

/* ===== RESPONSIVE — tablet ===== */

@media (max-width: 1024px)
{
	.e-6b474285 > .holder > .stage
	{
		height: clamp(400px, 60vh, 560px);
	}

	.e-6b474285 > .holder > .stage > .slide > .slide-inner > .slide-circle
	{
		width: clamp(280px, 66vw, 460px);
		gap: 12px;
	}
}

/* ===== RESPONSIVE — mobil ===== */

@media (max-width: 640px)
{
	.e-6b474285 > .holder > .stage
	{
		height: clamp(380px, 70vh, 500px);
	}

	.e-6b474285 > .holder > .stage > .slide > .slide-inner > .slide-circle
	{
		width: clamp(260px, 82vw, 380px);
		gap: 10px;
		padding: clamp(24px, 8vw, 40px);
	}

	.e-6b474285 > .holder > .stage > .stage-arrow
	{
		width: 40px;
		height: 40px;
	}
}

/* ===== END: section-hero-slider-2 ===== */
/* ===== BEGIN: section-hero-slider-1 (veliki hero slajder u stilu popular-destinations) ===== */

.e-6b474286
{
	display: block;
	width: 100%;
}

.e-6b474286 > .holder
{
	width: 100%;
}

/* ===== STAGE (full-bleed okvir sa svim slajdovima jedan preko drugog) ===== */

.e-6b474286 > .holder > .stage
{
	position: relative;
	width: 100%;
	height: clamp(440px, 72vh, 760px);
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background-color: #10285c;
	box-shadow: 0 18px 42px rgba(16, 40, 92, 0.22);
	outline: none;
}

/* ===== BLEED (opt-in: cela sirina sajta, bez zaobljenih ivica i senke) ===== */

.e-6b474286 > .holder.is-bleed > .stage
{
	border-radius: 0;
	box-shadow: none;
}

/* Tekst ostaje poravnat sa kolonom ostatka strane (isti racun kao .ot-container-l). */

.e-6b474286 > .holder.is-bleed > .stage > .slide > .slide-inner
{
	max-width: none;
	padding-left: max(calc(var(--ot-spacing-m) * 2), calc((100% - (1440px - var(--ot-spacing-m) * 4)) / 2));
	padding-right: max(calc(var(--ot-spacing-m) * 2), calc((100% - (1440px - var(--ot-spacing-m) * 4)) / 2));
}

.e-6b474286 > .holder.is-bleed > .stage > .slide > .slide-inner > .slide-title
{
	max-width: 620px;
}

/* ===== SLIDE (crossfade preko opacity, aktivni je vidljiv) ===== */

.e-6b474286 > .holder > .stage > .slide
{
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474286 > .holder > .stage > .slide.active
{
	opacity: 1;
	visibility: visible;
}

/* ===== IMAGE (clean full-cover, nežni zoom na aktivnom slajdu) ===== */

.e-6b474286 > .holder > .stage > .slide > .slide-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transform: scale(1.02);
	transition: transform 6000ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474286 > .holder > .stage > .slide.active > .slide-image
{
	transform: scale(1.08);
}

/* ===== OVERLAY (tamnoplavi gradient za čitljivost teksta) ===== */

.e-6b474286 > .holder > .stage > .slide > .slide-overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(16, 40, 92, 0.78) 0%, rgba(16, 40, 92, 0.45) 45%, rgba(16, 40, 92, 0.10) 100%);
}

/* ===== INNER (sadržaj slajda, levo poravnat) ===== */

.e-6b474286 > .holder > .stage > .slide > .slide-inner
{
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 18px;
	padding: 0 clamp(28px, 7vw, 96px);
	max-width: 760px;
}

/* ===== STRAPS (dve zakošene parallelogram trake, oštre ivice, lower-left) ===== */

.e-6b474286 .straps
{
	position: relative;
	display: inline-block;
	min-height: 76px;
}

.e-6b474286 .straps > .strap
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: 0;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(16, 40, 92, 0.24);
	transform: skewX(-14deg);
}

.e-6b474286 .straps .strap-text
{
	display: block;
	transform: skewX(14deg);
	text-align: center;
	color: white;
}

/* Gornja traka — tamnoplava, kraća, pomerena levo, na vrhu */

.e-6b474286 .straps > .strap-eyebrow
{
	left: 0;
	top: 0;
	z-index: 3;
	padding: 7px 22px;
	background: #10285c;
}

.e-6b474286 .straps > .strap-eyebrow > .strap-text
{
	font-weight: 800;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* Donja traka — narandžasta, šira, pomerena desno, preklapa gornju */

.e-6b474286 .straps > .strap-price
{
	left: 22px;
	top: 40px;
	z-index: 2;
	padding: 8px 30px;
	background: var(--ot-orange);
}

.e-6b474286 .straps > .strap-price > .strap-text
{
	font-weight: 800;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* ===== TITLE / DESCRIPTION / CTA ===== */

.e-6b474286 > .holder > .stage .slide-title
{
	margin: 0;
	font-weight: 800;
	font-size: clamp(34px, 5.4vw, 64px);
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: white;
	text-shadow: 0 6px 24px rgba(16, 40, 92, 0.35);
}

.e-6b474286 > .holder > .stage .slide-description
{
	margin: 0;
	max-width: 520px;
	font-weight: 400;
	font-size: clamp(15px, 1.6vw, 19px);
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.92);
	text-shadow: 0 2px 12px rgba(16, 40, 92, 0.35);
}

.e-6b474286 > .holder > .stage .slide-cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
	padding: 13px 26px;
	background: var(--ot-orange);
	color: white;
	border-radius: 100px;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(16, 40, 92, 0.24);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6b474286 > .holder > .stage .slide-cta:hover
{
	transform: translateY(-3px);
	box-shadow: 0 16px 36px rgba(16, 40, 92, 0.32);
}

.e-6b474286 > .holder > .stage .slide-cta > i
{
	font-size: 20px;
}

/* ===== ARROWS ===== */

.e-6b474286 > .holder > .stage > .stage-arrow
{
	position: absolute;
	top: 50%;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.16);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	color: white;
	cursor: pointer;
	backdrop-filter: blur(6px);
	transition: background 320ms ease, transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6b474286 > .holder > .stage > .stage-arrow:hover
{
	background: var(--ot-orange);
	border-color: var(--ot-orange);
}

.e-6b474286 > .holder > .stage > .stage-arrow-prev
{
	left: 20px;
}

.e-6b474286 > .holder > .stage > .stage-arrow-next
{
	right: 20px;
}

.e-6b474286 > .holder > .stage > .stage-arrow > i
{
	font-size: 24px;
}

/* ===== DOTS (sa progresom autoplay-a na aktivnom) ===== */

.e-6b474286 > .holder > .stage > .stage-dots
{
	position: absolute;
	left: 50%;
	bottom: 24px;
	z-index: 4;
	display: flex;
	gap: 10px;
	transform: translateX(-50%);
}

.e-6b474286 > .holder > .stage > .stage-dots > .dot
{
	position: relative;
	width: 34px;
	height: 6px;
	padding: 0;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.4);
	border: none;
	border-radius: 100px;
	cursor: pointer;
	transition: background 320ms ease;
}

.e-6b474286 > .holder > .stage > .stage-dots > .dot.active
{
	background: rgba(255, 255, 255, 0.4);
}

.e-6b474286 > .holder > .stage > .stage-dots > .dot > .dot-progress
{
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	background: var(--ot-orange);
	border-radius: 100px;
}

/* ===== RESPONSIVE — tablet ===== */

@media (max-width: 1024px)
{
	.e-6b474286 > .holder > .stage
	{
		height: clamp(400px, 60vh, 560px);
	}
}

/* ===== RESPONSIVE — uzak ekran (bleed prati kolonu ostatka strane) ===== */

@media (max-width: 900px)
{
	.e-6b474286 > .holder.is-bleed > .stage > .slide > .slide-inner
	{
		padding-left: var(--ot-spacing-m);
		padding-right: var(--ot-spacing-m);
	}
}

/* ===== RESPONSIVE — mobil ===== */

@media (max-width: 640px)
{
	.e-6b474286 > .holder > .stage
	{
		height: clamp(380px, 70vh, 500px);
	}

	.e-6b474286 > .holder > .stage > .slide > .slide-inner
	{
		gap: 14px;
	}

	.e-6b474286 > .holder > .stage > .stage-arrow
	{
		width: 40px;
		height: 40px;
	}
}

/* ===== END: section-hero-slider-1 ===== */
.e-5f8187c
{
	display: block;
	width: 100%;
}

.e-5f8187c > .holder
{
	position: relative;
	width: 100%;
}

/* ========================================== */
/* ===== CLASSIC VARIANT ==================== */
/* ========================================== */

.e-5f8187c > .holder.variant-classic
{
	color: inherit;
}

/* ========================================== */
/* ===== COVER VARIANT (dark hero) ========== */
/* ========================================== */

.e-5f8187c > .holder.variant-cover
{
	min-height: 620px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background: var(--ot-bg-3);
	color: white;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	padding: 96px 40px 64px;
}

.e-5f8187c > .holder.variant-cover > .cover
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
}

.e-5f8187c > .holder.variant-cover > .cover::before
{
	content: '';
	position: absolute;
	inset: 0;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	z-index: 0;
}

.e-5f8187c > .holder.variant-cover > .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(20, 18, 16, 0.55) 0%, rgba(20, 18, 16, 0.4) 40%, rgba(20, 18, 16, 0.85) 100%);
}

/* ===== INNER ===== */

.e-5f8187c > .holder > .inner
{
	position: relative;
	z-index: 2;
	max-width: 880px;
	margin: 0 auto;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ===== TEXT ===== */

.e-5f8187c .text
{
	display: flex;
	flex-direction: column;
	gap: 18px;
}

/* ===== META ROW ===== */

.e-5f8187c .meta
{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	font-weight: 500;
}

.e-5f8187c .category
{
	display: inline-flex;
	padding: 5px 12px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 10.5px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	transition: background 200ms, color 200ms;
}

.e-5f8187c > .holder.variant-cover .category
{
	background: rgba(255, 254, 252, 0.16);
	color: white;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.e-5f8187c .category:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-5f8187c .meta-dot
{
	width: 3px;
	height: 3px;
	background: currentColor;
	border-radius: 50%;
	opacity: 0.4;
}

.e-5f8187c .date
{
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.005em;
	opacity: 0.7;
}

.e-5f8187c .reading
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	opacity: 0.7;
}

.e-5f8187c .reading > i
{
	font-size: 14px;
}

/* ===== TITLE ===== */

.e-5f8187c .title
{
	font-family: var(--ot-font-secondary);
	font-size: 60px;
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1.02;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-5f8187c > .holder.variant-cover .title
{
	font-size: 72px;
	letter-spacing: -0.035em;
	line-height: 0.98;
}

.e-5f8187c .title em
{
	font-style: italic;
	color: var(--ot-brand);
}

.e-5f8187c > .holder.variant-cover .title em
{
	color: white;
}

/* ===== LEAD ===== */

.e-5f8187c .lead
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: -0.012em;
	margin: 4px 0 0;
	font-variation-settings: 'opsz' 144;
	opacity: 0.92;
}

/* ===== AUTHOR ===== */

.e-5f8187c .author
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-top: 12px;
	color: inherit;
	transition: opacity 200ms;
}

.e-5f8187c .author:hover
{
	opacity: 0.78;
}

.e-5f8187c .author-avatar
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	border-radius: 50%;
	flex-shrink: 0;
}

.e-5f8187c > .holder.variant-cover .author-avatar
{
	border: 2px solid rgba(255, 255, 255, 0.4);
}

.e-5f8187c .author-avatar-fallback > i
{
	font-size: 22px;
	color: var(--ot-text-3);
}

.e-5f8187c .author-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.3;
}

.e-5f8187c .author-name
{
	font-size: 13.5px;
	font-weight: 600;
	letter-spacing: -0.005em;
}

.e-5f8187c .author-role
{
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	opacity: 0.65;
}

/* ===== BELOW IMAGE (classic variant) ===== */

.e-5f8187c .below-image
{
	max-width: 1280px;
	margin: 56px auto 0;
	padding: 0 32px;
}

.e-5f8187c .below-image > img
{
	display: block;
	width: 100%;
	height: auto;
	max-height: 640px;
	object-fit: cover;
	border-radius: var(--ot-radius-l);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-5f8187c > .holder.variant-cover
	{
		min-height: 480px;
		padding: 64px 24px 44px;
	}

	.e-5f8187c .title
	{
		font-size: 40px;
	}

	.e-5f8187c > .holder.variant-cover .title
	{
		font-size: 44px;
	}

	.e-5f8187c .lead
	{
		font-size: 17px;
	}

	.e-5f8187c .below-image
	{
		margin-top: 36px;
		padding: 0 20px;
	}
}
/* ===== BEGIN: section-holiday-destinations-1 ===== */

@font-face
{
	font-family: 'Permanent Marker';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/permanentmarker/v16/Fh4uPib9Iyv2ucM6pGQMWimMp004Hao.ttf) format('truetype');
}

@font-face
{
	font-family: 'Pacifico';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/pacifico/v23/FwZY7-Qmy14u9lezJ96A.ttf) format('truetype');
}

.e-68e953e4
{
	display: block;
	width: 100%;
}

.e-68e953e4 > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned red marker title + red subtitle with thick red underline) ===== */

.e-68e953e4 > .holder > .head
{
	margin-bottom: 26px;
}

.e-68e953e4 .head > .title
{
	margin: 0;
	font-family: 'Permanent Marker', var(--ot-font-secondary), cursive;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.08;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: #ed1c24;
}

.e-68e953e4 .head > .subtitle
{
	display: inline-block;
	position: relative;
	margin-top: 12px;
	padding-bottom: 10px;
	font-weight: 800;
	font-size: 18px;
	color: #ed1c24;
}

.e-68e953e4 .head > .subtitle::after
{
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 5px;
	background: #ed1c24;
	border-radius: 100px;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-68e953e4 .stage
{
	position: relative;
	outline: none;
}

.e-68e953e4 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-68e953e4 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (tall portrait, full-cover bright image, no overlay) ===== */

.e-68e953e4 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-68e953e4 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.5;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-3);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.18);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-68e953e4 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.26);
}

.e-68e953e4 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-68e953e4 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== DESTINATION NAME (white handwritten script over the upper-middle) ===== */

.e-68e953e4 .card > .name
{
	position: absolute;
	left: 20px;
	right: 20px;
	top: 30%;
	transform: translateY(-50%);
	font-family: 'Pacifico', 'Snell Roundhand', 'Brush Script MT', cursive;
	font-weight: 400;
	font-size: 42px;
	line-height: 1.05;
	text-align: center;
	color: white;
	text-shadow: 0 2px 10px rgba(20, 18, 16, 0.45), 0 1px 2px rgba(20, 18, 16, 0.35);
	pointer-events: none;
}

/* ===== CTA (solid red button, centered, pinned to the bottom) ===== */

.e-68e953e4 .card > .cta
{
	position: absolute;
	left: 50%;
	bottom: 22px;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-width: calc(100% - 32px);
	padding: 11px 20px;
	background: #ed1c24;
	border-radius: 100px;
	font-family: var(--ot-font-primary);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.1;
	text-align: center;
	color: white;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-shadow: 0 8px 20px rgba(237, 28, 36, 0.35);
	transition: background 240ms ease, transform 240ms ease;
}

.e-68e953e4 .card:hover > .cta
{
	background: #cc1018;
	transform: translateX(-50%) translateY(-2px);
}

/* ===== ARROWS (white glyph, faint translucent bg, over the edges) ===== */

.e-68e953e4 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(20, 18, 16, 0.28);
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	z-index: 2;
	backdrop-filter: blur(2px);
	transition: background 240ms ease, transform 240ms ease;
}

.e-68e953e4 .arrow-prev
{
	left: -6px;
}

.e-68e953e4 .arrow-next
{
	right: -6px;
}

.e-68e953e4 .arrow:hover
{
	background: rgba(20, 18, 16, 0.5);
	transform: translateY(-50%) scale(1.06);
}

.e-68e953e4 .arrow > i
{
	font-size: 24px;
}

/* ===== PROGRESS BAR (bottom center, red fill) ===== */

.e-68e953e4 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 24px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-68e953e4 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #ed1c24;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-68e953e4 .head > .title { font-size: 38px; }
	.e-68e953e4 .card > .name { font-size: 38px; }
}

@media (max-width: 640px)
{
	.e-68e953e4 .viewport { padding: 10px 6px; }
	.e-68e953e4 .cell { padding: 0 8px; }
	.e-68e953e4 .head > .title { font-size: 32px; }
	.e-68e953e4 .card > .name { font-size: 36px; }
	.e-68e953e4 .arrow { width: 42px; height: 42px; }
	.e-68e953e4 .progress { max-width: 78%; }
}

/* ===== END: section-holiday-destinations-1 ===== */
/* ===== BEGIN: section-holiday-promos (promo akcije — mreza 3x2 sa opcionim badzom i lila trakom) ===== */

.e-15be1a45
{
	display: block;
	width: 100%;
}

.e-15be1a45 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif, tamnoljubicast) ===== */

.e-15be1a45 > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-15be1a45 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #3b1f5c;
}

/* ===== GRID (3 kolone x 2 reda; grid-auto-rows: 1fr izjednacava visine SVIH redova) ===== */

.e-15be1a45 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (klikabilna, jednake visine) ===== */

.e-15be1a45 > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 12px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-15be1a45 > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== MEDIA (fiksne proporcije, nosac za badz) ===== */

.e-15be1a45 > .holder > .grid > .card > .card-media
{
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
}

.e-15be1a45 > .holder > .grid > .card > .card-media > .card-image
{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-15be1a45 > .holder > .grid > .card:hover > .card-media > .card-image
{
	transform: scale(1.05);
}

/* ===== BADGE (kosa bela oznaka nad punim krugom, gore-levo preko slike) ===== */

.e-15be1a45 > .holder > .grid > .card > .card-media > .badge
{
	/* top ostavlja mesta za vrh kose oznake — rotacija podigne desnu ivicu za sirina*sin(8deg). */

	position: absolute;
	top: 26px;
	left: 16px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	pointer-events: none;
}

.e-15be1a45 > .holder > .grid > .card > .card-media > .badge > .badge-label
{
	transform: rotate(-8deg);
	transform-origin: left center;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #ffffff;
	text-shadow: 0 1px 6px rgba(15, 23, 42, 0.45);
}

.e-15be1a45 > .holder > .grid > .card > .card-media > .badge > .badge-circle
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 78px;
	height: 78px;
	margin-top: 2px;
	border-radius: 50%;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.1;
	text-align: center;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

/* ===== BODY (lila blok: tekst levo, strelica desno, popunjava ostatak kartice) ===== */

.e-15be1a45 > .holder > .grid > .card > .card-body
{
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 104px;
	padding: 18px 20px;
	background: #f3edf7;
}

.e-15be1a45 > .holder > .grid > .card > .card-body > .card-text
{
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.e-15be1a45 > .holder > .grid > .card > .card-body > .card-text > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: #3b1f5c;
}

.e-15be1a45 > .holder > .grid > .card > .card-body > .card-text > .card-desc
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== ARROW (siva strelica, ista vertikalna linija u svim karticama) ===== */

.e-15be1a45 > .holder > .grid > .card > .card-body > .card-arrow
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 24px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 220ms ease;
}

.e-15be1a45 > .holder > .grid > .card:hover > .card-body > .card-arrow
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-15be1a45 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-15be1a45 > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-15be1a45 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-15be1a45 > .holder > .grid > .card > .card-body
	{
		min-height: 96px;
		padding: 16px 18px;
	}

	.e-15be1a45 > .holder > .head > .title { font-size: 26px; }
	.e-15be1a45 > .holder > .grid > .card > .card-body > .card-text > .card-title { font-size: 17px; }
}

/* ===== END: section-holiday-promos ===== */
/* ===== BEGIN: section-hotel-categories-1 (mreža kategorija hotela 2x3) ===== */

.e-4ee30149
{
	display: block;
	width: 100%;
}

.e-4ee30149 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo + sivlji podnaslov) ===== */

.e-4ee30149 > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-4ee30149 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

.e-4ee30149 > .holder > .head > .subtitle
{
	margin: 8px 0 0 0;
	max-width: 640px;
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== GRID (2 kolone x 3 reda, isti gutter po obe ose) ===== */

.e-4ee30149 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 22px;
}

/* ===== CARD (klikabilan link, full-cover slika, fiksan odnos = jednake visine) ===== */

.e-4ee30149 > .holder > .grid > .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-4ee30149 > .holder > .grid > .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-4ee30149 > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.e-4ee30149 > .holder > .grid > .card:hover::before
{
	transform: scale(1.06);
}

/* ===== OVERLAY (vrlo blago tamnjenje — kontrast nosi label, ne scrim) ===== */

.e-4ee30149 > .holder > .grid > .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.06);
	transition: background 360ms ease;
}

.e-4ee30149 > .holder > .grid > .card:hover > .overlay
{
	background: rgba(0, 0, 0, 0.12);
}

/* ===== LABEL (poluprovidni tamni pill, centriran, beo serifni bold) ===== */

.e-4ee30149 > .holder > .grid > .card > .label
{
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	max-width: calc(100% - 40px);
	padding: 12px 22px;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.55);
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-4ee30149 > .holder > .head > .title { font-size: 30px; }
	.e-4ee30149 > .holder > .grid > .card > .label { font-size: 20px; }
}

@media (max-width: 640px)
{
	.e-4ee30149 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-4ee30149 > .holder > .grid > .card
	{
		aspect-ratio: 4 / 3;
	}

	.e-4ee30149 > .holder > .head > .title { font-size: 26px; }
	.e-4ee30149 > .holder > .head > .subtitle { font-size: 15px; }

	.e-4ee30149 > .holder > .grid > .card > .label
	{
		padding: 10px 16px;
		font-size: 19px;
	}
}

/* ===== END: section-hotel-categories-1 ===== */
/* ===== BEGIN: section-hotel-concepts-1 ===== */

.e-7f6e1da6
{
	display: block;
	width: 100%;
	--hcn-navy: #16294d;
	--hcn-grey: #6b7280;
	--hcn-blue: #2f6feb;
}

.e-7f6e1da6 > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamnoplavi sans naslov) ===== */

.e-7f6e1da6 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-7f6e1da6 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--hcn-navy);
}

/* ===== MREZA (tri kartice po redu, sve iste visine u oba reda) ===== */

.e-7f6e1da6 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 26px 24px;
}

/* ===== KARTICA ===== */

.e-7f6e1da6 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(16, 24, 40, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-7f6e1da6 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(16, 24, 40, 0.16);
}

/* ===== MEDIA (slika na vrhu + obojena logo plocica gore levo) ===== */

.e-7f6e1da6 .card > .card-media
{
	position: relative;
	display: block;
	height: 200px;
	overflow: hidden;
}

.e-7f6e1da6 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-7f6e1da6 .card:hover .card-image
{
	transform: scale(1.06);
}

/* Plocica je jedan zaobljeni okvir, a njena dva dela nose svaki svoju boju. */

.e-7f6e1da6 .card-media > .card-plate
{
	position: absolute;
	top: 16px;
	left: 16px;
	display: flex;
	align-items: stretch;
	max-width: calc(100% - 32px);
	border-radius: 4px;
	box-shadow: 0 6px 14px rgba(20, 18, 16, 0.22);
	overflow: hidden;
}

.e-7f6e1da6 .card-plate > .plate-main
{
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 12px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-7f6e1da6 .plate-main > .plate-icon
{
	font-size: 17px;
	flex-shrink: 0;
}

.e-7f6e1da6 .card-plate > .plate-tail
{
	display: flex;
	align-items: center;
	padding: 7px 11px;
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.2;
	white-space: nowrap;
}

/* ===== TELO KARTICE (naziv koncepta + sivi opis) ===== */

.e-7f6e1da6 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 18px 20px 22px;
}

.e-7f6e1da6 .card-body > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.28;
	color: var(--hcn-navy);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-7f6e1da6 .card:hover .card-title
{
	color: var(--hcn-blue);
}

.e-7f6e1da6 .card-body > .card-desc
{
	margin-top: 10px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.55;
	color: var(--hcn-grey);
}

/* ===== DUGME (jedno, centrirano ispod cele mreze) ===== */

.e-7f6e1da6 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-7f6e1da6 .foot > .all
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 30px;
	border: 1.5px solid var(--hcn-blue);
	border-radius: 100px;
	background: transparent;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--hcn-blue);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-7f6e1da6 .foot > .all:hover
{
	background: var(--hcn-blue);
	color: #ffffff;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

@media (max-width: 1024px)
{
	.e-7f6e1da6 .head > .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-7f6e1da6 .head > .title
	{
		font-size: 24px;
	}

	.e-7f6e1da6 .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-7f6e1da6 .card > .card-media
	{
		height: 190px;
	}

	.e-7f6e1da6 .card-body > .card-title
	{
		font-size: 19px;
	}

	.e-7f6e1da6 .foot > .all
	{
		width: 100%;
	}
}

/* ===== END: section-hotel-concepts-1 ===== */
/* ===== BEGIN: section-hotel-deals-1 ===== */

.e-185316ec
{
	display: block;
	width: 100%;
}

.e-185316ec > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (centered eyebrow + title + subtitle) ===== */

.e-185316ec > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
	margin-bottom: 28px;
}

.e-185316ec .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-185316ec .head > .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: var(--ot-brand);
}

.e-185316ec .head > .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	font-size: 44px;
	letter-spacing: -0.025em;
	line-height: 1.04;
	color: var(--ot-text-1);
}

.e-185316ec .head > .subtitle
{
	margin: 0;
	max-width: 620px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== TABS BAR (destination tabs + filter dropdown) ===== */

.e-185316ec > .holder > .tabs-bar
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 24px;
}

.e-185316ec .tabs-bar > .tabs
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.e-185316ec .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	background: transparent;
	border: 0;
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	white-space: nowrap;
	transition: background 220ms ease, color 220ms ease;
}

.e-185316ec .tabs > .tab:hover
{
	background: var(--ot-bg-2);
}

.e-185316ec .tabs > .tab.active
{
	background: var(--ot-orange);
	color: white;
}

.e-185316ec .tabs > .tab.active:hover
{
	background: var(--ot-orange);
}

.e-185316ec .tabs-bar > .filter
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-2);
	cursor: pointer;
	white-space: nowrap;
	transition: border-color 220ms ease;
}

.e-185316ec .tabs-bar > .filter:hover
{
	border-color: var(--ot-text-3);
}

.e-185316ec .filter > i
{
	font-size: 18px;
	color: var(--ot-text-3);
}

/* ===== VIEWPORT + TRACK ===== */

.e-185316ec .viewport
{
	position: relative;
	overflow: hidden;
}

.e-185316ec .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL ===== */

.e-185316ec .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	max-width: calc(100% / var(--per-view, 3));
	padding: 12px 8px;
	box-sizing: border-box;
}

/* ===== SHARED CARD ===== */

.e-185316ec .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-185316ec .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== PROMO CARD (full-image destination banner) ===== */

.e-185316ec .card.promo
{
	position: relative;
	min-height: 380px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-185316ec .card.promo::after
{
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.15) 0%, rgba(20, 18, 16, 0.65) 100%);
}

.e-185316ec .promo > .promo-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	margin-top: auto;
	padding: 26px 24px;
	color: white;
}

.e-185316ec .promo-body > .promo-title
{
	font-family: var(--ot-font-secondary);
	font-size: 40px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1;
	text-transform: uppercase;
}

.e-185316ec .promo-body > .promo-cities
{
	font-size: 14px;
	font-weight: 500;
	opacity: 0.9;
}

.e-185316ec .promo-body > .promo-cta
{
	display: inline-flex;
	align-items: center;
	margin-top: 8px;
	padding: 11px 22px;
	border: 1.5px solid rgba(255, 255, 255, 0.85);
	border-radius: 100px;
	background: transparent;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: white;
	transition: background 220ms ease, color 220ms ease;
}

.e-185316ec .card.promo:hover .promo-cta
{
	background: white;
	color: var(--ot-text-1);
}

/* ===== HOTEL CARD IMAGE ===== */

.e-185316ec .card.hotel > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-185316ec .card.hotel:hover > .card-image
{
	transform: scale(1.05);
}

.e-185316ec .card-image > .card-badge
{
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	background: white;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--ot-text-1);
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.14);
}

/* ===== HOTEL CARD BODY ===== */

.e-185316ec .card.hotel > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 16px 18px 18px;
}

.e-185316ec .hotel-location
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-185316ec .hotel-location > i
{
	font-size: 15px;
}

.e-185316ec .hotel-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.4em;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
}

.e-185316ec .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-185316ec .stars > i
{
	font-size: 16px;
	font-variation-settings: 'FILL' 1;
}

.e-185316ec .price-row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: 4px;
}

.e-185316ec .price-main
{
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.e-185316ec .price-label
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-185316ec .price-value
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-blue);
}

.e-185316ec .service
{
	font-size: 12px;
	color: var(--ot-text-3);
	text-align: right;
	padding-bottom: 3px;
}

.e-185316ec .meta
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 8px;
	padding-top: 12px;
	border-top: 1px solid var(--ot-bg-3-border);
}

.e-185316ec .dates
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-185316ec .meta-row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.e-185316ec .stay
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-185316ec .rating
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
}

.e-185316ec .rating > i
{
	font-size: 15px;
	color: var(--ot-green);
}

.e-185316ec .rating-score
{
	font-size: 12px;
	font-weight: 800;
	color: var(--ot-green);
}

.e-185316ec .rating-label
{
	font-size: 11px;
	color: var(--ot-text-3);
}

/* ===== ARROWS ===== */

.e-185316ec .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.92);
	border: 0;
	border-radius: 50%;
	color: var(--ot-brand);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.16);
	transition: background 240ms, color 240ms;
}

.e-185316ec .arrow:hover
{
	background: var(--ot-brand);
	color: white;
}

.e-185316ec .arrow-prev { left: 18px; }
.e-185316ec .arrow-next { right: 18px; }

/* ===== DOTS ===== */

.e-185316ec .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 22px;
}

.e-185316ec .dots > .dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	background: var(--ot-bg-3-border);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-185316ec .dots > .dot.active
{
	width: 28px;
	background: var(--ot-orange);
	border-radius: 100px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-185316ec .head > .title { font-size: 34px; }
}

@media (max-width: 640px)
{
	.e-185316ec > .holder > .head { margin-bottom: 22px; }
	.e-185316ec .head > .title { font-size: 28px; }
	.e-185316ec .card.promo { min-height: 320px; }
	.e-185316ec .promo-body > .promo-title { font-size: 32px; }
	.e-185316ec .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-hotel-deals-1 ===== */
/* ===== BEGIN: section-hotel-finder ===== */

.e-38fb963f
{
	display: block;
	width: 100%;
}

.e-38fb963f > .holder
{
	width: 100%;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-38fb963f > .holder > .title
{
	margin: 0 0 30px;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: #16294d;
}

/* ===== GRID (tri uspravne kartice jednake sirine i jednake visine) ===== */

.e-38fb963f .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	gap: 24px;
	align-items: stretch;
}

/* ===== KARTICA (cela je link; slika popunjava ceo okvir) ===== */

.e-38fb963f .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	text-decoration: none;
	border-radius: 12px;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.10);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-38fb963f .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.18);
}

.e-38fb963f .card > .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: #dbe6f0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-38fb963f .card:hover > .card-image
{
	transform: scale(1.05);
}

/* Blaga senka pri dnu da bela plocica ne lebdi na svetloj fotografiji bez razdvajanja. */

.e-38fb963f .card > .card-shade
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	height: 55%;
	background: linear-gradient(to bottom, rgba(9, 20, 40, 0) 0%, rgba(9, 20, 40, 0.28) 100%);
}

/* ===== BELA PLOCICA (lebdi preko donjeg dela slike, uvucena sa sve tri strane) ===== */

.e-38fb963f .card > .card-plate
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	width: calc(100% - 28px);
	margin: 0 14px 14px;
	padding: 16px 18px;
	background: rgba(255, 255, 255, 0.94);
	border-radius: 10px;
	box-shadow: 0 8px 20px rgba(9, 20, 40, 0.14);
}

/* Rezervisana visina dva reda drzi sve plocice iste visine i linkove u istoj liniji. */

.e-38fb963f .card-plate > .plate-title
{
	display: block;
	min-height: 58px;
	font-family: var(--ot-font-primary);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.3;
	color: #16294d;
}

.e-38fb963f .card-plate > .plate-link
{
	display: block;
	margin-top: 8px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	color: #2f6feb;
}

.e-38fb963f .card:hover .plate-link
{
	text-decoration: underline;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna puna sirina) ===== */

@media (max-width: 1024px)
{
	.e-38fb963f .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-38fb963f > .holder > .title
	{
		font-size: 26px;
		margin-bottom: 22px;
	}

	.e-38fb963f .grid
	{
		grid-template-columns: 1fr;
	}

	.e-38fb963f .card
	{
		aspect-ratio: 4 / 5;
	}
}

/* ===== END: section-hotel-finder ===== */
/* ===== BEGIN: section-hotel-gallery-1 (hotelski rezultati sa galerijom: velika slika levo + mreza 2x2 desno, pa info red ispod) ===== */

.e-129f41df
{
	--hg-blue: #2f6feb;
	--hg-purple: #7b1fa2;
	--hg-orange: #f5901e;
	--hg-green: #148f5f;
	--hg-dark: #24303a;
	--hg-grey: #6b7280;
	--hg-line: #e8eaee;
	--hg-circle: #eceff3;

	display: block;
}

.e-129f41df .holder
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.e-129f41df .head
{
	display: block;
}

.e-129f41df .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--hg-dark);
}

.e-129f41df .list
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* Kartica je uspravna: gore galerija, dole jedan informacioni red. */

.e-129f41df .card
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 14px;
	border: 1px solid var(--hg-line);
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.06);
}

/* Galerija: glavna slika levo i mreza od cetiri manje desno; mreza se sama izjednaci sa visinom glavne slike. */

.e-129f41df .gallery
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.e-129f41df .main
{
	position: relative;
	aspect-ratio: 16 / 10;
	border-radius: 10px;
	overflow: hidden;
}

.e-129f41df .main-link
{
	position: absolute;
	inset: 0;
	display: block;
}

.e-129f41df .main-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--hg-circle);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 0.35s ease;
}

.e-129f41df .main:hover .main-image
{
	transform: scale(1.04);
}

.e-129f41df .arrow
{
	position: absolute;
	top: 50%;
	margin-top: -18px;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--hg-dark);
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(16, 24, 40, 0.18);
	transition: background 0.2s ease;
}

.e-129f41df .arrow:hover
{
	background: #ffffff;
}

.e-129f41df .arrow i
{
	font-size: 22px;
}

.e-129f41df .arrow-prev
{
	left: 12px;
}

.e-129f41df .arrow-next
{
	right: 12px;
}

.e-129f41df .thumbs
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 10px;
}

.e-129f41df .thumb
{
	min-width: 0;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 10px;
	background-color: var(--hg-circle);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.e-129f41df .thumb:hover
{
	opacity: 0.86;
}

/* Donji red: levo informacije, desno ocena, cena i dugmad. */

.e-129f41df .body
{
	display: flex;
	gap: 24px;
	flex: 1;
}

.e-129f41df .info
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
	min-width: 0;
	padding: 4px 0 0 6px;
}

.e-129f41df .title-row
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.e-129f41df .name
{
	font-size: 23px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--hg-blue);
	text-decoration: none;
}

.e-129f41df .name:hover
{
	text-decoration: underline;
}

.e-129f41df .stars
{
	display: inline-flex;
	gap: 2px;
	color: var(--hg-orange);
	font-size: 16px;
	line-height: 1;
}

.e-129f41df .place
{
	display: flex;
	align-items: center;
	gap: 8px;
}

.e-129f41df .flag
{
	width: 20px;
	height: 14px;
	flex: 0 0 20px;
	border-radius: 2px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-129f41df .location
{
	font-size: 14px;
	color: var(--hg-grey);
}

.e-129f41df .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-129f41df .feature
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--hg-dark);
}

.e-129f41df .feature i
{
	font-size: 18px;
	color: var(--hg-green);
}

.e-129f41df .meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin-top: 2px;
}

.e-129f41df .meta-line
{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--hg-grey);
}

.e-129f41df .meta-line i
{
	font-size: 17px;
}

.e-129f41df .side
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	flex: 0 0 260px;
	padding: 4px 6px 0 22px;
	border-left: 1px solid var(--hg-line);
}

.e-129f41df .review
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.e-129f41df .review-label
{
	font-size: 15px;
	font-weight: 700;
	color: var(--hg-dark);
}

.e-129f41df .review-score
{
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--hg-circle);
	font-size: 17px;
	font-weight: 800;
	color: var(--hg-dark);
}

.e-129f41df .cost
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-129f41df .cost-old
{
	font-size: 14px;
	color: var(--hg-grey);
	text-decoration: line-through;
}

.e-129f41df .cost-row
{
	display: flex;
	align-items: baseline;
	gap: 6px;
}

.e-129f41df .cost-label
{
	font-size: 14px;
	color: var(--hg-grey);
}

.e-129f41df .cost-value
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--hg-dark);
}

.e-129f41df .cost-note
{
	font-size: 13px;
	color: var(--hg-grey);
}

/* Dugmad su prikovana za dno kartice, pa razlicit broj osobina ne pomera poziv na akciju. */

.e-129f41df .buy
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: auto;
}

.e-129f41df .heart
{
	width: 42px;
	height: 42px;
	flex: 0 0 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--hg-line);
	border-radius: 50%;
	background: #ffffff;
	color: var(--hg-grey);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.e-129f41df .heart:hover
{
	border-color: var(--hg-purple);
	color: var(--hg-purple);
}

.e-129f41df .heart.is-liked
{
	border-color: var(--hg-purple);
	color: var(--hg-purple);
}

.e-129f41df .cta
{
	flex: 1;
	min-height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 20px;
	border-radius: 100px;
	background: var(--hg-purple);
	font-size: 16px;
	font-weight: 700;
	color: #ffffff;
	text-decoration: none;
	transition: background 0.2s ease;
}

.e-129f41df .cta:hover
{
	background: #66178a;
}

@media (max-width: 1024px)
{
	.e-129f41df .body
	{
		flex-wrap: wrap;
	}

	.e-129f41df .side
	{
		flex: 1 0 100%;
		flex-direction: row;
		align-items: center;
		gap: 20px;
		padding: 16px 0 0 0;
		border-left: 0;
		border-top: 1px solid var(--hg-line);
	}

	.e-129f41df .review
	{
		justify-content: flex-start;
	}

	.e-129f41df .buy
	{
		flex: 0 1 320px;
		margin-top: 0;
		margin-left: auto;
	}
}

@media (max-width: 640px)
{
	.e-129f41df .title
	{
		font-size: 26px;
	}

	.e-129f41df .gallery
	{
		grid-template-columns: 1fr;
	}

	.e-129f41df .main
	{
		aspect-ratio: 4 / 3;
	}

	.e-129f41df .thumbs
	{
		grid-template-rows: auto auto;
	}

	.e-129f41df .thumb
	{
		aspect-ratio: 4 / 3;
	}

	/* Bez ovoga bi flex-basis iz tablet reda postao VISINA, jer je kolona sada uspravna. */

	.e-129f41df .body
	{
		flex-direction: column;
		gap: 16px;
	}

	.e-129f41df .info
	{
		padding-left: 0;
	}

	.e-129f41df .side
	{
		flex: 0 0 auto;
		flex-direction: column;
		align-items: stretch;
		padding: 16px 0 0 0;
	}

	.e-129f41df .buy
	{
		flex: 0 0 auto;
		margin-left: 0;
	}
}

/* ===== END: section-hotel-gallery-1 ===== */
/* ===== BEGIN: section-hotel-grid-1 ===== */

@font-face
{
	font-family: 'Permanent Marker';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/permanentmarker/v16/Fh4uPib9Iyv2ucM6pGQMWimMp004Hao.ttf) format('truetype');
}

.e-13b5d95f
{
	display: block;
	width: 100%;
}

.e-13b5d95f > .holder
{
	width: 100%;
}

/* ===== TITLE (centered, uppercase, red, marker/grunge font) ===== */

.e-13b5d95f > .holder > .title
{
	margin: 0 0 36px;
	text-align: center;
	font-family: 'Permanent Marker', var(--ot-font-secondary), cursive;
	font-weight: 400;
	font-size: 46px;
	line-height: 1.1;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--ot-red);
}

/* ===== GRID (3 columns x 2 rows, equal, equal-height) ===== */

.e-13b5d95f .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, white frame) ===== */

.e-13b5d95f .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	box-sizing: border-box;
	padding: 8px;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.05);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-13b5d95f .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 16px 36px rgba(20, 18, 16, 0.14);
}

/* ===== IMAGE (inset white frame from card padding, rounded, own overflow) ===== */

.e-13b5d95f .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-13b5d95f .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== BODY (flex column, footer pinned to bottom for equal heights) ===== */

.e-13b5d95f .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	padding: 12px 8px 8px;
}

/* ===== STARS (5, filled yellow-orange up to category, rest light grey) ===== */

.e-13b5d95f .card-body > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
}

.e-13b5d95f .stars > i
{
	font-size: 16px;
	font-variation-settings: 'FILL' 1;
}

.e-13b5d95f .stars > i.is-filled
{
	color: #f5b301;
}

.e-13b5d95f .stars > i.is-empty
{
	color: #d8d8d8;
}

/* ===== NAME (bold red, up to two lines, category suffix) ===== */

.e-13b5d95f .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 8px;
	min-height: 2.5em;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--ot-red);
}

.e-13b5d95f .name > .name-category
{
	white-space: nowrap;
}

/* ===== LOCATION (pin + place, small dark bold) ===== */

.e-13b5d95f .card-body > .location
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	margin-top: 8px;
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.e-13b5d95f .location > i
{
	font-size: 15px;
	color: var(--ot-text-2);
}

/* ===== FOOT (desc left + price badge right, pinned to bottom) ===== */

.e-13b5d95f .card-body > .card-foot
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: auto;
	padding-top: 14px;
}

.e-13b5d95f .card-foot > .foot-desc
{
	flex: 1 1 120px;
	min-width: 0;
	font-size: 11px;
	line-height: 1.35;
	color: var(--ot-text-2);
}

.e-13b5d95f .card-foot > .price-badge
{
	flex: 0 0 auto;
	padding: 8px 14px;
	border-radius: var(--ot-radius-m);
	background: linear-gradient(135deg, var(--ot-red), #7c3aed);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.1;
	white-space: nowrap;
	color: white;
	transition: filter 220ms ease;
}

.e-13b5d95f .card:hover .price-badge
{
	filter: brightness(0.92);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-13b5d95f .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-13b5d95f > .holder > .title
	{
		font-size: 38px;
	}
}

@media (max-width: 640px)
{
	.e-13b5d95f .grid
	{
		grid-template-columns: 1fr;
	}

	.e-13b5d95f > .holder > .title
	{
		margin-bottom: 26px;
		font-size: 30px;
	}
}

/* ===== END: section-hotel-grid-1 ===== */
/* ===== BEGIN: section-hotel-inspire-1 ===== */

.e-5118499
{
	display: block;
	width: 100%;
}

.e-5118499 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== SECTION HEAD (left-aligned, light-blue, semi-bold) ===== */

.e-5118499 .section-head
{
	margin: 0 0 24px;
	padding: 0 8px;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-brand);
}

/* ===== STAGE ===== */

.e-5118499 .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-5118499 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 0;
}

.e-5118499 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL ===== */

.e-5118499 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 0 12px;
	box-sizing: border-box;
}

/* ===== CARD (white, rounded, soft shadow, equal height) ===== */

.e-5118499 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5118499 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
}

/* ===== CARD IMAGE (full width top, rounded top corners) ===== */

.e-5118499 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 16 / 11;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l) var(--ot-radius-l) 0 0;
}

/* ===== WAVE (two layers: light-blue band over image + white wave into body) ===== */
/* White wave is the top layer (crest ~y48), light-blue wave sits behind (crest ~y30) so only a thin blue sliver shows above the white crest. */

.e-5118499 .card > .wave
{
	display: block;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 46px;
	margin-top: -46px;
	background-image:
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,48 C200,23 400,73 600,48 C800,23 1000,73 1200,48 L1200,100 L0,100 Z' fill='%23ffffff'/></svg>"),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,30 C200,5 400,55 600,30 C800,5 1000,55 1200,30 L1200,100 L0,100 Z' fill='%238fc9f2'/></svg>");
	background-position: bottom, bottom;
	background-size: 100% 100%, 100% 100%;
	background-repeat: no-repeat, no-repeat;
}

/* ===== CARD BODY (hotel data, white, grows to keep equal height) ===== */

.e-5118499 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 3px;
	padding: 4px 22px 26px;
	background: var(--ot-bg-1);
	border-radius: 0 0 var(--ot-radius-l) var(--ot-radius-l);
}

/* ===== GOLD CATEGORY STARS (row above the hotel name) ===== */

.e-5118499 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-5118499 .card-stars > i
{
	font-size: 14px;
	font-variation-settings: 'FILL' 1;
}

/* ===== HOTEL NAME (bold dark blue, up to two lines) ===== */

.e-5118499 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 21px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: #0d3b66;
}

/* ===== LOCATION (smaller city and country line) ===== */

.e-5118499 .card-location
{
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ot-text-2);
}

/* ===== PRICE (bold, "from" label lighter) ===== */

.e-5118499 .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	margin-top: 6px;
	font-size: 20px;
	font-weight: 800;
	color: #0d3b66;
}

.e-5118499 .card-from
{
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-text-2);
}

/* ===== DOTS (centered, active filled blue, inactive white with blue ring) ===== */

.e-5118499 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 28px;
}

.e-5118499 .dot
{
	width: 11px;
	height: 11px;
	padding: 0;
	background: var(--ot-bg-1);
	border: 1.5px solid var(--ot-brand);
	border-radius: 50%;
	cursor: pointer;
	transition: background 240ms ease, transform 240ms ease;
}

.e-5118499 .dot:hover
{
	transform: scale(1.15);
}

.e-5118499 .dot.is-active
{
	background: var(--ot-brand);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5118499 .section-head { font-size: 24px; }
	.e-5118499 .cell { padding: 0 10px; }
}

@media (max-width: 640px)
{
	.e-5118499 .section-head { font-size: 21px; }
	.e-5118499 .cell { padding: 0 8px; }
	.e-5118499 .card > .card-body { padding: 4px 18px 22px; }
}

/* ===== END: section-hotel-inspire-1 ===== */
/* ===== BEGIN: section-hotel-inspire-2 ===== */

.e-5118498
{
	display: block;
	width: 100%;
}

.e-5118498 > .holder
{
	width: 100%;
}

/* ===== SECTION HEAD (left-aligned, light-blue, semi-bold) ===== */

.e-5118498 .section-head
{
	margin: 0 0 24px;
	padding: 0 8px;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-brand);
}

/* ===== GRID (static, four across, three rows) ===== */

.e-5118498 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	padding: 12px 0;
}

/* ===== CARD (rounded, soft shadow, equal height) ===== */

.e-5118498 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5118498 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
}

/* ===== CARD IMAGE (full width top, rounded top corners) ===== */

.e-5118498 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 16 / 11;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l) var(--ot-radius-l) 0 0;
}

/* ===== WAVE (two layers: light-blue band over image + yellow wave into body) ===== */
/* Yellow wave is the top layer (crest ~y48), light-blue wave sits behind (crest ~y30) so only a thin blue sliver shows above the yellow crest that forms the yellow body top. */

.e-5118498 .card > .wave
{
	display: block;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 46px;
	margin-top: -46px;
	background-image:
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,48 C200,23 400,73 600,48 C800,23 1000,73 1200,48 L1200,100 L0,100 Z' fill='%23f5c518'/></svg>"),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,30 C200,5 400,55 600,30 C800,5 1000,55 1200,30 L1200,100 L0,100 Z' fill='%238fc9f2'/></svg>");
	background-position: bottom, bottom;
	background-size: 100% 100%, 100% 100%;
	background-repeat: no-repeat, no-repeat;
}

/* ===== CARD BODY (hotel data, yellow, grows to keep equal height) ===== */

.e-5118498 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 3px;
	padding: 4px 22px 26px;
	background: #f5c518;
	border-radius: 0 0 var(--ot-radius-l) var(--ot-radius-l);
}

/* ===== CATEGORY STARS (dark for contrast on yellow) ===== */

.e-5118498 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #1c1a12;
}

.e-5118498 .card-stars > i
{
	font-size: 14px;
	font-variation-settings: 'FILL' 1;
}

/* ===== HOTEL NAME (bold dark blue, up to two lines) ===== */

.e-5118498 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 21px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: #0d3b66;
}

/* ===== LOCATION (smaller city and country line, dark for contrast on yellow) ===== */

.e-5118498 .card-location
{
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	color: rgba(28, 26, 18, 0.85);
}

/* ===== DETAIL CHIPS (opciono; tamno mastilo na zutom telu, prelamaju se u vise redova) ===== */

.e-5118498 .card-meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-top: 5px;
}

.e-5118498 .card-meta > .chip
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 7px;
	border-radius: 100px;
	background: rgba(28, 26, 18, 0.10);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: #1c1a12;
}

.e-5118498 .card-meta > .chip > i
{
	font-size: 13px;
}

/* ===== PRICE (bold dark blue, "from" label darkened) ===== */

.e-5118498 .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	margin-top: 6px;
	font-size: 20px;
	font-weight: 800;
	color: #0d3b66;
}

.e-5118498 .card-from
{
	font-size: 12px;
	font-weight: 700;
	color: rgba(28, 26, 18, 0.7);
}

/* ===== WHITE VARIANT (opt-in: config.variant sadrzi "white") ===== */
/* Telo kartice i greben talasa postaju beli; plavi sloj talasa ostaje kao tanka razdelna linija */
/* izmedju fotografije i belog tela. Selektor ima tri klase pa gazi bazna pravila bez njihove izmene. */

.e-5118498 > .holder.white .card > .card-body
{
	background: #FFFFFF;
}

/* Oba sloja se moraju napisati ponovo — pojedinacan sloj u background-image listi se ne moze zameniti. */

.e-5118498 > .holder.white .card > .wave
{
	background-image:
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,48 C200,23 400,73 600,48 C800,23 1000,73 1200,48 L1200,100 L0,100 Z' fill='%23ffffff'/></svg>"),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,30 C200,5 400,55 600,30 C800,5 1000,55 1200,30 L1200,100 L0,100 Z' fill='%238fc9f2'/></svg>");
}

/* Mastilo po receptu belih kartica sekcije "Izabrali smo za vas" (picks.css): sekundarni tekst na */
/* --ot-text-2, cipovi na --ot-bg-2 sa plavom ikonicom. Ime, cena i zvezdice ostaju kao na zutom telu. */

.e-5118498 > .holder.white .card-location,
.e-5118498 > .holder.white .card-from
{
	color: var(--ot-text-2);
}

.e-5118498 > .holder.white .card-meta > .chip
{
	background: var(--ot-bg-2);
	color: var(--ot-text-1);
}

.e-5118498 > .holder.white .card-meta > .chip > i
{
	color: var(--ot-blue);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5118498 .section-head { font-size: 24px; }
	.e-5118498 .grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media (max-width: 640px)
{
	.e-5118498 .section-head { font-size: 21px; }
	.e-5118498 .grid { grid-template-columns: repeat(1, 1fr); gap: 18px; }
	.e-5118498 .card > .card-body { padding: 4px 18px 22px; }
}

/* ===== END: section-hotel-inspire-2 ===== */
/* ===== BEGIN: section-hotel-lists-1 ===== */

.e-694c905e
{
	display: block;
	width: 100%;
	--hl-dark: #24303a;
	--hl-violet: #5b3fd6;
	--hl-orange: #f5a623;
	--hl-grey: #7c8398;
	--hl-line: #e8eaf1;
}

.e-694c905e > .holder
{
	width: 100%;
}

/* ===== DVE JEDNAKE KOLONE (iste visine, poravnate na vrhu i na dnu) ===== */

.e-694c905e > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: stretch;
	gap: 28px;
}

.e-694c905e > .holder > .grid > .column
{
	display: flex;
	flex-direction: column;
	min-width: 0;
}

/* ===== NASLOV KOLONE (sans-serif se forsira jer sites tema gura serif na h1-h6) ===== */

.e-694c905e .col-title
{
	margin: 0 0 14px 0;
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.3px;
	color: var(--hl-dark);
	text-align: left;
}

/* ===== BELI KONTEJNER SA LISTOM ===== */

.e-694c905e .panel
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 4px 18px 14px 18px;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 2px 14px rgba(20, 30, 90, 0.07);
}

.e-694c905e .rows
{
	display: flex;
	flex-direction: column;
}

/* ===== RED (fiksna visina drzi redove obe kolone u istoj liniji) ===== */

.e-694c905e .row
{
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 96px;
	padding: 12px 26px 12px 0;
	border-top: 1px solid var(--hl-line);
	text-decoration: none;
	transition: background .2s ease;
}

.e-694c905e .rows > .row:first-child
{
	border-top: none;
}

.e-694c905e .row:hover
{
	background: #f7f8fc;
}

/* ===== LEVO: KVADRATNA SLICICA ===== */

.e-694c905e .thumb
{
	flex: 0 0 auto;
	width: 72px;
	height: 72px;
	border-radius: 8px;
	background-color: #eef0f6;
	background-position: center;
	background-size: cover;
}

/* ===== SREDINA: IME + ZVEZDICE, LOKACIJA, NOCENJA ===== */

.e-694c905e .mid
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.e-694c905e .name-line
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.e-694c905e .name
{
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--hl-violet);
}

.e-694c905e .row:hover .name
{
	text-decoration: underline;
}

.e-694c905e .stars
{
	font-size: 12px;
	line-height: 1;
	color: var(--hl-orange);
	letter-spacing: 1px;
}

.e-694c905e .location
{
	overflow: hidden;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--hl-grey);
	text-overflow: ellipsis;
}

.e-694c905e .nights
{
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--hl-grey);
}

.e-694c905e .nights > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 14px;
	font-style: normal;
	line-height: 1;
}

/* ===== DESNO: CENA (desno poravnata, precrtana stara cena je opciona) ===== */

.e-694c905e .price
{
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	text-align: right;
}

.e-694c905e .price-old
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hl-grey);
	text-decoration: line-through;
	white-space: nowrap;
}

.e-694c905e .price-main
{
	display: flex;
	align-items: baseline;
	gap: 4px;
}

.e-694c905e .price-prefix
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hl-grey);
}

.e-694c905e .price-value
{
	font-size: 19px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--hl-dark);
	white-space: nowrap;
}

.e-694c905e .price-unit
{
	font-size: 11px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hl-grey);
	white-space: nowrap;
}

/* ===== SEVRON (uvek uz desnu ivicu, vertikalno centriran) ===== */

.e-694c905e .chev
{
	position: absolute;
	top: 50%;
	right: 0;
	font-family: 'Material Symbols Rounded';
	font-size: 24px;
	font-style: normal;
	line-height: 1;
	color: var(--hl-violet);
	transform: translateY(-50%);
	transition: right .2s ease;
}

.e-694c905e .row:hover > .chev
{
	right: -3px;
}

/* ===== LINK NA DNU KOLONE (margin-top:auto drzi oba linka u istoj liniji) ===== */

.e-694c905e .foot-link
{
	margin-top: auto;
	padding: 16px 0 4px 0;
	border-top: 1px solid var(--hl-line);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--hl-violet);
	text-align: center;
	text-decoration: underline;
}

.e-694c905e .foot-link:hover
{
	color: #3f26b4;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-694c905e > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

@media (max-width: 640px)
{
	.e-694c905e .row
	{
		flex-wrap: wrap;
		padding-right: 24px;
	}

	.e-694c905e .price
	{
		flex: 1 1 100%;
		align-items: flex-start;
		padding-left: 86px;
		text-align: left;
	}

	.e-694c905e .price-value
	{
		font-size: 17px;
	}

	.e-694c905e .col-title
	{
		font-size: 21px;
	}
}

/* ===== END: section-hotel-lists-1 ===== */
/* ===== BEGIN: section-hotel-mozaik-1 ===== */

.e-101c607a
{
	display: block;
	width: 100%;
}

.e-101c607a > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark title + short thick yellow underline) ===== */

.e-101c607a > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 28px;
}

.e-101c607a .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-101c607a .head > .rule
{
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 12px;
	border-radius: 2px;
	background: #f5c518;
}

/* ===== GRID (4-column bento puzzle, fixed height) ===== */

.e-101c607a .grid
{
	display: grid;
	grid-template-columns: 1.25fr 1fr 1fr 0.82fr;
	grid-template-rows: repeat(10, 1fr);
	gap: 16px;
	height: 560px;
}

/* Slot placement — column 1 big, columns 2-4 alternating tall/short splits */

.e-101c607a .card.slot-1 { grid-column: 1; grid-row: 1 / -1; }
.e-101c607a .card.slot-2 { grid-column: 2; grid-row: 1 / 7; }
.e-101c607a .card.slot-3 { grid-column: 2; grid-row: 7 / 11; }
.e-101c607a .card.slot-4 { grid-column: 3; grid-row: 1 / 5; }
.e-101c607a .card.slot-5 { grid-column: 3; grid-row: 5 / 11; }
.e-101c607a .card.slot-6 { grid-column: 4; grid-row: 1 / 5; }
.e-101c607a .card.slot-7 { grid-column: 4; grid-row: 5 / 11; }

/* ===== CARD (full-cover image, clickable) ===== */

.e-101c607a .card
{
	position: relative;
	display: block;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c607a .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(20, 18, 16, 0.24);
}

.e-101c607a .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c607a .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== STRIP (translucent blue bar across the bottom) ===== */

.e-101c607a .card > .card-strip
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 12px 16px;
	background: rgba(3, 122, 213, 0.66);
	transition: background 260ms ease;
}

.e-101c607a .card:hover > .card-strip
{
	background: rgba(3, 122, 213, 0.78);
}

/* Gold category stars — row above the destination name */

.e-101c607a .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c607a .card-stars > i
{
	font-size: 14px;
	font-variation-settings: 'FILL' 1;
}

.e-101c607a .card-name
{
	font-weight: 800;
	font-size: 16px;
	line-height: 1.2;
	color: white;
}

/* Hotel name — smaller lighter line under the destination */

.e-101c607a .card-hotel
{
	font-weight: 600;
	font-size: 13px;
	line-height: 1.2;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c607a .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	font-weight: 800;
	font-size: 15px;
	color: #f5c518;
}

.e-101c607a .card-from
{
	font-weight: 700;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.9);
}

/* Big card — taller strip, larger text */

.e-101c607a .card.slot-1 > .card-strip
{
	padding: 18px 22px;
	gap: 5px;
}

.e-101c607a .card.slot-1 .card-stars > i
{
	font-size: 17px;
}

.e-101c607a .card.slot-1 .card-name
{
	font-size: 24px;
}

.e-101c607a .card.slot-1 .card-hotel
{
	font-size: 15px;
}

.e-101c607a .card.slot-1 .card-price
{
	font-size: 19px;
}

.e-101c607a .card.slot-1 .card-from
{
	font-size: 14px;
}

/* ===== RESPONSIVE — 2 equal columns on tablet, uniform heights ===== */

@media (max-width: 1024px)
{
	.e-101c607a .head > .title { font-size: 26px; }

	.e-101c607a .grid
	{
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		height: auto;
	}

	.e-101c607a .card.slot-1,
	.e-101c607a .card.slot-2,
	.e-101c607a .card.slot-3,
	.e-101c607a .card.slot-4,
	.e-101c607a .card.slot-5,
	.e-101c607a .card.slot-6,
	.e-101c607a .card.slot-7
	{
		grid-column: auto;
		grid-row: auto;
		aspect-ratio: 3 / 2;
	}

	.e-101c607a .card.slot-1 .card-stars > i { font-size: 14px; }
	.e-101c607a .card.slot-1 .card-name { font-size: 16px; }
	.e-101c607a .card.slot-1 .card-hotel { font-size: 13px; }
	.e-101c607a .card.slot-1 .card-price { font-size: 15px; }
	.e-101c607a .card.slot-1 .card-from { font-size: 12px; }
	.e-101c607a .card.slot-1 > .card-strip { padding: 12px 16px; gap: 3px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-101c607a > .holder > .head { margin-bottom: 22px; }
	.e-101c607a .head > .title { font-size: 23px; }

	.e-101c607a .grid
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

/* ===== END: section-hotel-mozaik-1 ===== */
/* ===== BEGIN: section-hotel-mozaik-10 ===== */

.e-c90516a
{
	display: block;
	width: 100%;
}

.e-c90516a > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516a > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516a .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516a .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516a .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516a .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== OPTIONAL FILTER TABS (between the title and the grid) ===== */

.e-c90516a > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: -12px 0 26px;
}

.e-c90516a .tabs > .tab
{
	padding: 9px 20px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.e-c90516a .tabs > .tab:hover
{
	border-color: #1c1a12;
	color: var(--ot-text-1);
}

.e-c90516a .tabs > .tab.is-active
{
	background: #f5c518;
	border-color: #f5c518;
	color: #1c1a12;
}

/* ===== UNIFORM GRID (4 columns, equal portrait cards → 2 rows of 4) ===== */

.e-c90516a .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

/* ===== CARD (full-cover image, clickable) — every card the same upright portrait rectangle, top-right corner maximally rounded ===== */

.e-c90516a .card
{
	position: relative;
	aspect-ratio: 2 / 3;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l) 50% var(--ot-radius-l) var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516a .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-c90516a .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516a .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-c90516a .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c90516a .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-c90516a .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-c90516a .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-c90516a .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-c90516a .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-c90516a .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c90516a .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (YELLOW panel — stars + destination + serif hotel + link, dark text) ===== */

.e-c90516a .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 16px 20px 20px;
	background: #f5c518;
	color: #1c1a12;
}

.e-c90516a .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #1c1a12;
}

.e-c90516a .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516a .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(28, 26, 18, 0.85);
}

.e-c90516a .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: #1c1a12;
}

.e-c90516a .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: #1c1a12;
	border-bottom: 1px solid rgba(28, 26, 18, 0.45);
	transition: border-color 240ms ease;
}

.e-c90516a .card:hover .card-link
{
	border-bottom-color: #1c1a12;
}

/* ===== OPTIONAL CTA BUTTON BELOW THE GRID ===== */

.e-c90516a > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-c90516a .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 34px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	text-decoration: none;
	transition: background 0.2s ease;
}

.e-c90516a .foot > .cta:hover
{
	background: #e0b30e;
}

/* ===== RESPONSIVE — 3 columns on wide tablet ===== */

@media (max-width: 1280px)
{
	.e-c90516a .grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 900px)
{
	.e-c90516a .head > .title { font-size: 32px; }
	.e-c90516a .grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== RESPONSIVE — 2 columns with smaller header on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516a > .holder > .head { margin-bottom: 24px; }
	.e-c90516a .head > .title { font-size: 27px; }
	.e-c90516a .head > .subtitle { font-size: 16px; }
	.e-c90516a .grid { grid-template-columns: repeat(2, 1fr); }
	.e-c90516a > .holder > .tabs { justify-content: flex-start; margin: -6px 0 22px; }
	.e-c90516a .tabs > .tab { padding: 8px 16px; font-size: 13px; }
	.e-c90516a .foot > .cta { width: 100%; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 400px)
{
	.e-c90516a .grid { grid-template-columns: 1fr; }
	.e-c90516a .card { aspect-ratio: 3 / 4; }
}

/* ===== END: section-hotel-mozaik-10 ===== */
/* ===== BEGIN: section-hotel-mozaik-11 ===== */

.e-c90516b
{
	display: block;
	width: 100%;
}

.e-c90516b > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516b > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516b .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516b .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516b .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516b .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== UNIFORM GRID (4 columns, equal round cards → 2 rows of 4) ===== */

.e-c90516b .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

/* ===== CARD (round circle, clickable) — yellow text face at rest, image circle on hover ===== */

.e-c90516b .card
{
	position: relative;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	overflow: hidden;
	text-decoration: none;
	background: var(--hm11-accent, #f5c518);
	border-radius: 50%;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516b .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

/* Image circle — hidden at rest, fades in on hover */

.e-c90516b .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 420ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516b .card:hover > .card-image
{
	opacity: 1;
	transform: scale(1.06);
}

/* Dark shade layer — not used on the yellow face */

.e-c90516b .card > .card-shade
{
	position: absolute;
	inset: 0;
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + board) — dark ink on yellow, fades out on hover ===== */

.e-c90516b .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 18px 20px 0;
	color: var(--hm11-ink, #1c1a12);
	opacity: 1;
	transition: opacity 320ms ease;
}

.e-c90516b .card:hover > .card-top
{
	opacity: 0;
}

.e-c90516b .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: var(--hm11-ink, #1c1a12);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: var(--hm11-accent, #f5c518);
}

.e-c90516b .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c90516b .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: color-mix(in srgb, var(--hm11-ink, #1c1a12) 82%, transparent);
}

.e-c90516b .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
	color: var(--hm11-ink, #1c1a12);
}

.e-c90516b .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: color-mix(in srgb, var(--hm11-ink, #1c1a12) 90%, transparent);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — dark ink on yellow, fades out on hover ===== */

.e-c90516b .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px 20px;
	color: var(--hm11-ink, #1c1a12);
	opacity: 1;
	transition: opacity 320ms ease;
}

.e-c90516b .card:hover > .card-bottom
{
	opacity: 0;
}

.e-c90516b .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: var(--hm11-ink, #1c1a12);
}

.e-c90516b .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516b .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: color-mix(in srgb, var(--hm11-ink, #1c1a12) 85%, transparent);
}

.e-c90516b .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: var(--hm11-ink, #1c1a12);
}

.e-c90516b .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: var(--hm11-ink, #1c1a12);
	border-bottom: 1px solid color-mix(in srgb, var(--hm11-ink, #1c1a12) 45%, transparent);
	transition: border-color 240ms ease;
}

.e-c90516b .card:hover .card-link
{
	border-bottom-color: var(--hm11-ink, #1c1a12);
}

/* ===== FOOT (optional button centred below the grid) ===== */

/* Dugme nosi iste dve promenljive kao i kartice, pa prati boju sekcije bez novog polja. */

.e-c90516b > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-c90516b .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 100px;
	background: var(--hm11-accent, #f5c518);
	font-size: 15px;
	font-weight: 800;
	color: var(--hm11-ink, #1c1a12);
	text-decoration: none;
	transition: filter 200ms ease;
}

.e-c90516b .foot > .cta:hover
{
	filter: brightness(0.94);
}

/* ===== RESPONSIVE — 3 columns on wide tablet ===== */

@media (max-width: 1280px)
{
	.e-c90516b .grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 900px)
{
	.e-c90516b .head > .title { font-size: 32px; }
	.e-c90516b .grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== RESPONSIVE — 2 columns with smaller header on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516b > .holder > .head { margin-bottom: 24px; }
	.e-c90516b .head > .title { font-size: 27px; }
	.e-c90516b .head > .subtitle { font-size: 16px; }
	.e-c90516b .grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== RESPONSIVE — 1 full-width column on mobile (still a circle) ===== */

@media (max-width: 400px)
{
	.e-c90516b .grid { grid-template-columns: 1fr; }
	.e-c90516b .card { aspect-ratio: 1 / 1; }
	.e-c90516b .foot > .cta { width: 100%; }
}

/* ===== END: section-hotel-mozaik-11 ===== */
/* ===== BEGIN: section-hotel-mozaik-12 ===== */

.e-c90516c
{
	display: block;
	width: 100%;
}

.e-c90516c > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516c > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516c .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516c .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516c .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516c .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== ONE SLIDING ROW (marquee — moves right to left) ===== */

.e-c90516c .rows
{
	display: flex;
	flex-direction: column;
}

.e-c90516c .row
{
	overflow: hidden;
	padding: 24px 0;
}

.e-c90516c .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
	animation: e-c90516c-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c90516c .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c90516c-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (round circle, clickable) — yellow text face at rest, image circle on hover ===== */

.e-c90516c .card
{
	position: relative;
	flex: 0 0 auto;
	width: 440px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	overflow: hidden;
	text-decoration: none;
	background: #f5c518;
	border-radius: 50%;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516c .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

/* Image circle — hidden at rest, fades in on hover */

.e-c90516c .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 420ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516c .card:hover > .card-image
{
	opacity: 1;
	transform: scale(1.06);
}

/* Dark shade layer — not used on the yellow face */

.e-c90516c .card > .card-shade
{
	position: absolute;
	inset: 0;
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + board) — dark ink on yellow, fades out on hover ===== */

.e-c90516c .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 18px 20px 0;
	color: #1c1a12;
	opacity: 1;
	transition: opacity 320ms ease;
}

.e-c90516c .card:hover > .card-top
{
	opacity: 0;
}

.e-c90516c .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #1c1a12;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #f5c518;
}

.e-c90516c .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c90516c .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(28, 26, 18, 0.82);
}

.e-c90516c .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
	color: #1c1a12;
}

.e-c90516c .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(28, 26, 18, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — dark ink on yellow, fades out on hover ===== */

.e-c90516c .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px 20px;
	color: #1c1a12;
	opacity: 1;
	transition: opacity 320ms ease;
}

.e-c90516c .card:hover > .card-bottom
{
	opacity: 0;
}

.e-c90516c .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #1c1a12;
}

.e-c90516c .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516c .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(28, 26, 18, 0.85);
}

.e-c90516c .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: #1c1a12;
}

.e-c90516c .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: #1c1a12;
	border-bottom: 1px solid rgba(28, 26, 18, 0.45);
	transition: border-color 240ms ease;
}

.e-c90516c .card:hover .card-link
{
	border-bottom-color: #1c1a12;
}

/* ===== RESPONSIVE — smaller circles on tablet ===== */

@media (max-width: 1024px)
{
	.e-c90516c .card { width: 330px; }
	.e-c90516c .card-price { font-size: 23px; }
	.e-c90516c .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + circles on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516c > .holder > .head { margin-bottom: 24px; }
	.e-c90516c .head > .title { font-size: 27px; }
	.e-c90516c .head > .subtitle { font-size: 16px; }
	.e-c90516c .card { width: 200px; }
	.e-c90516c .card > .card-top { padding: 14px 15px 0; }
	.e-c90516c .card > .card-bottom { padding: 0 15px 15px; }
	.e-c90516c .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact circles on mobile ===== */

@media (max-width: 400px)
{
	.e-c90516c .card { width: 130px; }
	.e-c90516c .card-price { font-size: 20px; }
	.e-c90516c .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-12 ===== */
/* ===== BEGIN: section-hotel-mozaik-13 ===== */

.e-c90516d
{
	display: block;
	width: 100%;
}

.e-c90516d > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516d > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516d .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516d .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516d .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516d .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== SINGLE SLIDING ROW (marquee — scrolls left) ===== */

.e-c90516d .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-c90516d .row
{
	overflow: hidden;
}

.e-c90516d .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-c90516d .row-top > .track
{
	animation: e-c90516d-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c90516d .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c90516d-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (full-cover image, clickable) — every card the same big square size (80% larger) ===== */

/* Sirina po ekranu zivi u --hm13-width, a --hm13-scale je opcioni mnozilac koji stize inline sa holdera (config cardScale). */

.e-c90516d .card
{
	position: relative;
	flex: 0 0 auto;
	--hm13-width: 792px;
	width: calc(var(--hm13-width) * var(--hm13-scale, 1));
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516d .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-c90516d .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516d .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-c90516d .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c90516d .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-c90516d .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-c90516d .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-c90516d .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-c90516d .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-c90516d .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c90516d .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-c90516d .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-c90516d .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-c90516d .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516d .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-c90516d .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-c90516d .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-c90516d .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — smaller square cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-c90516d .card { --hm13-width: 594px; }
	.e-c90516d .card-price { font-size: 23px; }
	.e-c90516d .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516d > .holder > .head { margin-bottom: 24px; }
	.e-c90516d .head > .title { font-size: 27px; }
	.e-c90516d .head > .subtitle { font-size: 16px; }
	.e-c90516d .card { --hm13-width: 360px; }
	.e-c90516d .card > .card-top { padding: 14px 15px 0; }
	.e-c90516d .card > .card-bottom { padding: 0 15px 15px; }
	.e-c90516d .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-c90516d .card { --hm13-width: 234px; }
	.e-c90516d .card-price { font-size: 20px; }
	.e-c90516d .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-13 ===== */
/* ===== BEGIN: section-hotel-mozaik-14 ===== */

.e-c90516e
{
	display: block;
	width: 100%;
}

.e-c90516e > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516e > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516e .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516e .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516e .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516e .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== SINGLE SLIDING ROW (marquee — scrolls left) ===== */

.e-c90516e .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-c90516e .row
{
	overflow: hidden;
}

.e-c90516e .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-c90516e .row-top > .track
{
	animation: e-c90516e-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c90516e .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c90516e-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (full-cover image, clickable) — every card the same big circle with content centred in the middle ===== */

.e-c90516e .card
{
	position: relative;
	flex: 0 0 auto;
	width: 792px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 14px;
	overflow: hidden;
	text-decoration: none;
	border-radius: 50%;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516e .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-c90516e .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516e .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark radial-friendly gradient — text readable over the centre of the circle */

.e-c90516e .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c90516e .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) — centred ===== */

.e-c90516e .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 0 20px;
	color: white;
}

.e-c90516e .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-c90516e .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c90516e .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-c90516e .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c90516e .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — centred ===== */

.e-c90516e .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px;
	color: white;
}

.e-c90516e .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-c90516e .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516e .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-c90516e .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-c90516e .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-c90516e .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — smaller circle cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-c90516e .card { width: 594px; }
	.e-c90516e .card-price { font-size: 23px; }
	.e-c90516e .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516e > .holder > .head { margin-bottom: 24px; }
	.e-c90516e .head > .title { font-size: 27px; }
	.e-c90516e .head > .subtitle { font-size: 16px; }
	.e-c90516e .card { width: 360px; }
	.e-c90516e .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-c90516e .card { width: 234px; }
	.e-c90516e .card-price { font-size: 20px; }
	.e-c90516e .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-14 ===== */
/* ===== BEGIN: section-hotel-mozaik-15 ===== */

.e-c90516f
{
	display: block;
	width: 100%;
}

.e-c90516f > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c90516f > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c90516f .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c90516f .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c90516f .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c90516f .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== SINGLE SLIDING ROW (marquee — scrolls left) ===== */

.e-c90516f .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-c90516f .row
{
	overflow: hidden;
}

.e-c90516f .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-c90516f .row-top > .track
{
	animation: e-c90516f-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c90516f .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c90516f-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (full-cover image circle at rest, turns yellow with black text on hover) ===== */

.e-c90516f .card
{
	position: relative;
	flex: 0 0 auto;
	width: 792px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 14px;
	overflow: hidden;
	text-decoration: none;
	background: #f5c518;
	border-radius: 50%;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-c90516f .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

/* Image layer — visible at rest, fades out on hover to reveal the yellow disc */

.e-c90516f .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: opacity 420ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c90516f .card:hover > .card-image
{
	opacity: 0;
	transform: scale(1.06);
}

/* Dark radial-friendly gradient — readable over the image at rest, hidden on the yellow face */

.e-c90516f .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c90516f .card:hover > .card-shade
{
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + board) — white at rest, black on the yellow face ===== */

.e-c90516f .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c90516f .card:hover > .card-top
{
	color: #1c1a12;
}

.e-c90516f .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	transition: background 320ms ease, color 320ms ease;
}

.e-c90516f .card:hover .card-promo
{
	background: #1c1a12;
	color: #f5c518;
}

.e-c90516f .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c90516f .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
	transition: color 320ms ease;
}

.e-c90516f .card:hover .card-from
{
	color: rgba(28, 26, 18, 0.82);
}

.e-c90516f .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c90516f .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
	transition: color 320ms ease;
}

.e-c90516f .card:hover .card-board
{
	color: rgba(28, 26, 18, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — white at rest, black on the yellow face ===== */

.e-c90516f .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c90516f .card:hover > .card-bottom
{
	color: #1c1a12;
}

.e-c90516f .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
	transition: color 320ms ease;
}

.e-c90516f .card:hover .card-stars
{
	color: #1c1a12;
}

.e-c90516f .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c90516f .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
	transition: color 320ms ease;
}

.e-c90516f .card:hover .card-country
{
	color: rgba(28, 26, 18, 0.85);
}

.e-c90516f .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
	transition: color 320ms ease;
}

.e-c90516f .card:hover .card-title
{
	color: #1c1a12;
}

.e-c90516f .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: color 320ms ease, border-color 240ms ease;
}

.e-c90516f .card:hover .card-link
{
	color: #1c1a12;
	border-bottom-color: #1c1a12;
}

/* ===== RESPONSIVE — smaller circle cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-c90516f .card { width: 594px; }
	.e-c90516f .card-price { font-size: 23px; }
	.e-c90516f .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-c90516f > .holder > .head { margin-bottom: 24px; }
	.e-c90516f .head > .title { font-size: 27px; }
	.e-c90516f .head > .subtitle { font-size: 16px; }
	.e-c90516f .card { width: 360px; }
	.e-c90516f .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-c90516f .card { width: 234px; }
	.e-c90516f .card-price { font-size: 20px; }
	.e-c90516f .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-15 ===== */
/* ===== BEGIN: section-hotel-mozaik-16 ===== */

.e-c905170
{
	display: block;
	width: 100%;
}

.e-c905170 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c905170 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c905170 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c905170 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c905170 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c905170 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== SINGLE SLIDING ROW (marquee — scrolls left) ===== */

.e-c905170 .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-c905170 .row
{
	overflow: hidden;
}

.e-c905170 .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-c905170 .row-top > .track
{
	animation: e-c905170-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c905170 .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c905170-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (full-cover image irregular blob at rest, turns yellow with black text on hover) ===== */

.e-c905170 .card
{
	position: relative;
	flex: 0 0 auto;
	width: 792px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 14px;
	overflow: hidden;
	text-decoration: none;
	background: #f5c518;
	border-radius: 70% 30% 52% 48% / 36% 64% 36% 64%;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

/* Varied irregular rounded (blob) outlines so the shapes read as "some irregular shapes", not one repeated form. */

.e-c905170 .card:nth-child(2n)
{
	border-radius: 30% 70% 48% 52% / 64% 36% 64% 36%;
}

.e-c905170 .card:nth-child(3n)
{
	border-radius: 52% 48% 70% 30% / 62% 34% 66% 38%;
}

.e-c905170 .card:nth-child(4n)
{
	border-radius: 46% 54% 32% 68% / 38% 66% 34% 62%;
}

.e-c905170 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

/* Image layer — visible at rest, fades out on hover to reveal the yellow blob */

.e-c905170 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: opacity 420ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c905170 .card:hover > .card-image
{
	opacity: 0;
	transform: scale(1.06);
}

/* Dark radial-friendly gradient — readable over the image at rest, hidden on the yellow face */

.e-c905170 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c905170 .card:hover > .card-shade
{
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + board) — white at rest, black on the yellow face ===== */

.e-c905170 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c905170 .card:hover > .card-top
{
	color: #1c1a12;
}

.e-c905170 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	transition: background 320ms ease, color 320ms ease;
}

.e-c905170 .card:hover .card-promo
{
	background: #1c1a12;
	color: #f5c518;
}

.e-c905170 .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c905170 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
	transition: color 320ms ease;
}

.e-c905170 .card:hover .card-from
{
	color: rgba(28, 26, 18, 0.82);
}

.e-c905170 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c905170 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
	transition: color 320ms ease;
}

.e-c905170 .card:hover .card-board
{
	color: rgba(28, 26, 18, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — white at rest, black on the yellow face ===== */

.e-c905170 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c905170 .card:hover > .card-bottom
{
	color: #1c1a12;
}

.e-c905170 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
	transition: color 320ms ease;
}

.e-c905170 .card:hover .card-stars
{
	color: #1c1a12;
}

.e-c905170 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c905170 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
	transition: color 320ms ease;
}

.e-c905170 .card:hover .card-country
{
	color: rgba(28, 26, 18, 0.85);
}

.e-c905170 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
	transition: color 320ms ease;
}

.e-c905170 .card:hover .card-title
{
	color: #1c1a12;
}

.e-c905170 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: color 320ms ease, border-color 240ms ease;
}

.e-c905170 .card:hover .card-link
{
	color: #1c1a12;
	border-bottom-color: #1c1a12;
}

/* ===== RESPONSIVE — smaller blob cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-c905170 .card { width: 594px; }
	.e-c905170 .card-price { font-size: 23px; }
	.e-c905170 .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-c905170 > .holder > .head { margin-bottom: 24px; }
	.e-c905170 .head > .title { font-size: 27px; }
	.e-c905170 .head > .subtitle { font-size: 16px; }
	.e-c905170 .card { width: 360px; }
	.e-c905170 .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-c905170 .card { width: 234px; }
	.e-c905170 .card-price { font-size: 20px; }
	.e-c905170 .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-16 ===== */
/* ===== BEGIN: section-hotel-mozaik-17 ===== */

.e-c905171
{
	display: block;
	width: 100%;
}

.e-c905171 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-c905171 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-c905171 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-c905171 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-c905171 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-c905171 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== SINGLE SLIDING ROW (marquee — scrolls left) ===== */

.e-c905171 .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-c905171 .row
{
	overflow: hidden;
}

.e-c905171 .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-c905171 .row-top > .track
{
	animation: e-c905171-left 90s linear infinite;
}

/* Pause the row on hover so a card can be read. */

.e-c905171 .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-c905171-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* ===== CARD (full-cover image clipped to an irregular SHARP-EDGED polygon at rest, turns yellow with black text on hover) ===== */

.e-c905171 .card
{
	position: relative;
	flex: 0 0 auto;
	width: 792px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 14px;
	overflow: hidden;
	text-decoration: none;
	background: #f5c518;
	border-radius: 0;
	clip-path: polygon(8% 0%, 62% 4%, 100% 22%, 94% 78%, 70% 100%, 22% 96%, 0% 60%, 5% 18%);
	filter: drop-shadow(0 14px 28px rgba(20, 18, 16, 0.20));
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), filter 320ms ease;
}

/* Varied irregular sharp-edged (angular) outlines so the shapes read as "some irregular shapes", not one repeated form. */

.e-c905171 .card:nth-child(2n)
{
	clip-path: polygon(0% 14%, 44% 6%, 88% 0%, 100% 46%, 90% 92%, 46% 100%, 12% 88%, 4% 50%);
}

.e-c905171 .card:nth-child(3n)
{
	clip-path: polygon(20% 2%, 74% 0%, 100% 34%, 96% 74%, 66% 96%, 24% 100%, 2% 66%, 8% 28%);
}

.e-c905171 .card:nth-child(4n)
{
	clip-path: polygon(6% 8%, 50% 0%, 92% 10%, 100% 54%, 84% 96%, 40% 92%, 8% 78%, 0% 34%);
}

.e-c905171 .card:hover
{
	transform: translateY(-5px);
	filter: drop-shadow(0 22px 40px rgba(20, 18, 16, 0.30));
}

/* Image layer — visible at rest, fades out on hover to reveal the yellow shape */

.e-c905171 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: opacity 420ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-c905171 .card:hover > .card-image
{
	opacity: 0;
	transform: scale(1.06);
}

/* Dark radial-friendly gradient — readable over the image at rest, hidden on the yellow face */

.e-c905171 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-c905171 .card:hover > .card-shade
{
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + board) — white at rest, black on the yellow face ===== */

.e-c905171 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c905171 .card:hover > .card-top
{
	color: #1c1a12;
}

.e-c905171 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	transition: background 320ms ease, color 320ms ease;
}

.e-c905171 .card:hover .card-promo
{
	background: #1c1a12;
	color: #f5c518;
}

.e-c905171 .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-c905171 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
	transition: color 320ms ease;
}

.e-c905171 .card:hover .card-from
{
	color: rgba(28, 26, 18, 0.82);
}

.e-c905171 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-c905171 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
	transition: color 320ms ease;
}

.e-c905171 .card:hover .card-board
{
	color: rgba(28, 26, 18, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) — white at rest, black on the yellow face ===== */

.e-c905171 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 7px;
	padding: 0 20px;
	color: white;
	transition: color 320ms ease;
}

.e-c905171 .card:hover > .card-bottom
{
	color: #1c1a12;
}

.e-c905171 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
	transition: color 320ms ease;
}

.e-c905171 .card:hover .card-stars
{
	color: #1c1a12;
}

.e-c905171 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-c905171 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
	transition: color 320ms ease;
}

.e-c905171 .card:hover .card-country
{
	color: rgba(28, 26, 18, 0.85);
}

.e-c905171 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
	transition: color 320ms ease;
}

.e-c905171 .card:hover .card-title
{
	color: #1c1a12;
}

.e-c905171 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: color 320ms ease, border-color 240ms ease;
}

.e-c905171 .card:hover .card-link
{
	color: #1c1a12;
	border-bottom-color: #1c1a12;
}

/* ===== RESPONSIVE — smaller angular cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-c905171 .card { width: 594px; }
	.e-c905171 .card-price { font-size: 23px; }
	.e-c905171 .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-c905171 > .holder > .head { margin-bottom: 24px; }
	.e-c905171 .head > .title { font-size: 27px; }
	.e-c905171 .head > .subtitle { font-size: 16px; }
	.e-c905171 .card { width: 360px; }
	.e-c905171 .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-c905171 .card { width: 234px; }
	.e-c905171 .card-price { font-size: 20px; }
	.e-c905171 .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-17 ===== */
/* ===== BEGIN: section-hotel-mozaik-2 ===== */

.e-101c6079
{
	display: block;
	width: 100%;
}

.e-101c6079 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6079 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6079 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6079 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6079 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6079 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== OPTIONAL FILTER TABS (between the title and the grid) ===== */

.e-101c6079 > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: -12px 0 26px;
}

.e-101c6079 .tabs > .tab
{
	padding: 9px 20px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.e-101c6079 .tabs > .tab:hover
{
	border-color: #1c1a12;
	color: var(--ot-text-1);
}

.e-101c6079 .tabs > .tab.is-active
{
	background: #f5c518;
	border-color: #f5c518;
	color: #1c1a12;
}

/* ===== UNIFORM GRID (5 columns, equal portrait cards → 3 rows of 5) ===== */

.e-101c6079 .grid
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 14px;
}

/* ===== CARD (full-cover image, clickable) — every card the same size ===== */

.e-101c6079 .card
{
	position: relative;
	aspect-ratio: 3 / 4;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6079 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6079 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6079 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6079 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6079 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6079 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 16px 18px 0;
	color: white;
}

.e-101c6079 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6079 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6079 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6079 .card-price
{
	font-size: 23px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6079 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6079 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 18px 18px;
	color: white;
}

.e-101c6079 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6079 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6079 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6079 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6079 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6079 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — 4 columns on wide tablet ===== */

@media (max-width: 1280px)
{
	.e-101c6079 .grid { grid-template-columns: repeat(4, 1fr); }
}

/* ===== RESPONSIVE — 3 columns on tablet ===== */

@media (max-width: 900px)
{
	.e-101c6079 .head > .title { font-size: 32px; }
	.e-101c6079 .grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== OPTIONAL CTA BUTTON BELOW THE GRID ===== */

.e-101c6079 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-101c6079 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 34px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	text-decoration: none;
	transition: background 0.2s ease;
}

.e-101c6079 .foot > .cta:hover
{
	background: #e0b30e;
}

/* ===== RESPONSIVE — 2 columns on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6079 > .holder > .head { margin-bottom: 24px; }
	.e-101c6079 .head > .title { font-size: 27px; }
	.e-101c6079 .head > .subtitle { font-size: 16px; }
	.e-101c6079 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-101c6079 > .holder > .tabs { justify-content: flex-start; margin: -6px 0 22px; }
	.e-101c6079 .tabs > .tab { padding: 8px 16px; font-size: 13px; }
	.e-101c6079 .foot > .cta { width: 100%; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6079 .grid { grid-template-columns: 1fr; }
	.e-101c6079 .card { aspect-ratio: 3 / 2.4; }
}

/* ===== END: section-hotel-mozaik-2 ===== */
/* ===== BEGIN: section-hotel-mozaik-3 ===== */

.e-101c6078
{
	display: block;
	width: 100%;
}

.e-101c6078 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6078 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6078 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6078 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6078 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6078 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== UNIFORM GRID (4 columns, equal square cards → 2 rows of 4) ===== */

.e-101c6078 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

/* ===== CARD (full-cover image, clickable) — every card the same square size ===== */

.e-101c6078 .card
{
	position: relative;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6078 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6078 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6078 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6078 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6078 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6078 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6078 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6078 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6078 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6078 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6078 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6078 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-101c6078 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6078 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6078 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6078 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6078 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6078 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — 3 columns on wide tablet ===== */

@media (max-width: 1280px)
{
	.e-101c6078 .grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 900px)
{
	.e-101c6078 .head > .title { font-size: 32px; }
	.e-101c6078 .grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== OPTIONAL CTA BUTTON BELOW THE GRID ===== */

.e-101c6078 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-101c6078 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 34px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	text-decoration: none;
	transition: background 0.2s ease;
}

.e-101c6078 .foot > .cta:hover
{
	background: #e0b30e;
}

/* ===== RESPONSIVE — 2 columns with smaller header on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6078 > .holder > .head { margin-bottom: 24px; }
	.e-101c6078 .head > .title { font-size: 27px; }
	.e-101c6078 .head > .subtitle { font-size: 16px; }
	.e-101c6078 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-101c6078 .foot > .cta { width: 100%; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6078 .grid { grid-template-columns: 1fr; }
	.e-101c6078 .card { aspect-ratio: 3 / 2.4; }
}

/* ===== END: section-hotel-mozaik-3 ===== */
/* ===== BEGIN: section-hotel-mozaik-4 ===== */

.e-101c6077
{
	display: block;
	width: 100%;
}

.e-101c6077 > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark title + short thick yellow underline) ===== */

.e-101c6077 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 28px;
}

.e-101c6077 .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-101c6077 .head > .rule
{
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 12px;
	border-radius: 2px;
	background: #f5c518;
}

/* ===== TABS (optional country pills between the title and the grid) ===== */

.e-101c6077 > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: -8px 0 24px;
}

.e-101c6077 .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 18px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
}

.e-101c6077 .tabs > .tab:hover
{
	border-color: #037ad5;
	color: #037ad5;
}

.e-101c6077 .tabs > .tab.is-active
{
	background: #037ad5;
	border-color: #037ad5;
	color: white;
}

.e-101c6077 .tab-flag
{
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 14px;
	border-radius: 2px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== GRID (uniform 5 columns, portrait cards, 3 rows) ===== */

.e-101c6077 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 16px;
}

/* ===== CARD (full-cover image, clickable) ===== */

.e-101c6077 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6077 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(20, 18, 16, 0.24);
}

.e-101c6077 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6077 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== TAG (optional badge over the top left corner of the image) ===== */

.e-101c6077 .card > .card-tag
{
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	border-radius: 100px;
	background: #e4002b;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: white;
}

/* ===== STRIP (translucent blue bar across the bottom) ===== */

.e-101c6077 .card > .card-strip
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 12px 14px;
	background: rgba(3, 122, 213, 0.66);
	transition: background 260ms ease;
}

.e-101c6077 .card:hover > .card-strip
{
	background: rgba(3, 122, 213, 0.78);
}

/* Gold category stars — row above the hotel name */

.e-101c6077 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6077 .card-stars > i
{
	font-size: 14px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6077 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-weight: 800;
	font-size: 16px;
	line-height: 1.2;
	color: white;
}

/* Location — smaller lighter city and country line */

.e-101c6077 .card-location
{
	font-weight: 600;
	font-size: 13px;
	line-height: 1.2;
	color: rgba(255, 255, 255, 0.92);
}

/* Detail chips — days, nights, transport, amenities, distance from the beach */

.e-101c6077 .card-meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-top: 3px;
}

.e-101c6077 .card-meta > .chip
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 7px;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.18);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: white;
}

.e-101c6077 .card-meta > .chip > i
{
	font-size: 13px;
}

.e-101c6077 .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	margin-top: 2px;
	font-weight: 800;
	font-size: 16px;
	color: #f5c518;
}

.e-101c6077 .card-from
{
	font-weight: 700;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== FOOT (optional button centred below the grid) ===== */

.e-101c6077 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-101c6077 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 100px;
	background: #ff8401;
	font-size: 15px;
	font-weight: 800;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-101c6077 .foot > .cta:hover
{
	background: #e57500;
}

/* ===== RESPONSIVE (5 -> 4 -> 3 -> 2 -> 1, cards stay uniform and portrait) ===== */

@media (max-width: 1280px)
{
	.e-101c6077 > .holder > .grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1024px)
{
	.e-101c6077 .head > .title { font-size: 26px; }
	.e-101c6077 > .holder > .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px)
{
	.e-101c6077 > .holder > .grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px)
{
	.e-101c6077 > .holder > .head { margin-bottom: 22px; }
	.e-101c6077 .head > .title { font-size: 23px; }
	.e-101c6077 > .holder > .grid { grid-template-columns: 1fr; }
	.e-101c6077 .foot > .cta { width: 100%; }
}

/* ===== END: section-hotel-mozaik-4 ===== */
/* ===== BEGIN: section-hotel-mozaik-5 ===== */

.e-101c6076
{
	display: block;
	width: 100%;
}

.e-101c6076 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6076 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6076 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6076 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6076 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6076 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== TWO SLIDING ROWS (marquee — top scrolls left, bottom scrolls right) ===== */

.e-101c6076 .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-101c6076 .row
{
	overflow: hidden;
}

.e-101c6076 .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-101c6076 .row-top > .track
{
	animation: e-101c6076-left 90s linear infinite;
}

.e-101c6076 .row-bottom > .track
{
	animation: e-101c6076-right 90s linear infinite;
}

/* Pause both rows on hover so a card can be read. */

.e-101c6076 .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-101c6076-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

@keyframes e-101c6076-right
{
	from
	{
		transform: translateX(-50%);
	}

	to
	{
		transform: translateX(0);
	}
}

/* ===== CARD (full-cover image, clickable) — every card the same square size ===== */

.e-101c6076 .card
{
	position: relative;
	flex: 0 0 auto;
	width: 440px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6076 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6076 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6076 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6076 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6076 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6076 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6076 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6076 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6076 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6076 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6076 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6076 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-101c6076 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6076 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6076 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6076 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6076 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6076 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — smaller square cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-101c6076 .card { width: 330px; }
	.e-101c6076 .card-price { font-size: 23px; }
	.e-101c6076 .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6076 > .holder > .head { margin-bottom: 24px; }
	.e-101c6076 .head > .title { font-size: 27px; }
	.e-101c6076 .head > .subtitle { font-size: 16px; }
	.e-101c6076 .card { width: 200px; }
	.e-101c6076 .card > .card-top { padding: 14px 15px 0; }
	.e-101c6076 .card > .card-bottom { padding: 0 15px 15px; }
	.e-101c6076 .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6076 .card { width: 130px; }
	.e-101c6076 .card-price { font-size: 20px; }
	.e-101c6076 .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-5 ===== */
/* ===== BEGIN: section-hotel-mozaik-6 ===== */

.e-101c6075
{
	display: block;
	width: 100%;
}

.e-101c6075 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6075 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6075 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6075 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6075 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6075 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== TWO SLIDING ROWS (marquee — top scrolls left, bottom scrolls right) ===== */

.e-101c6075 .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-101c6075 .row
{
	overflow: hidden;
}

.e-101c6075 .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-101c6075 .row-top > .track
{
	animation: e-101c6075-left 90s linear infinite;
}

.e-101c6075 .row-bottom > .track
{
	animation: e-101c6075-right 90s linear infinite;
}

/* Pause both rows on hover so a card can be read. */

.e-101c6075 .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-101c6075-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

@keyframes e-101c6075-right
{
	from
	{
		transform: translateX(-50%);
	}

	to
	{
		transform: translateX(0);
	}
}

/* ===== CARD (full-cover image, clickable) — every card the same square size ===== */

.e-101c6075 .card
{
	position: relative;
	flex: 0 0 auto;
	width: 440px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6075 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6075 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6075 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6075 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6075 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6075 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6075 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6075 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6075 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6075 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6075 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (GOLD panel — stars + destination + serif hotel + link, dark text) ===== */

.e-101c6075 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 16px 20px 20px;
	background: #f5c518;
	color: #1c1a12;
}

.e-101c6075 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #1c1a12;
}

.e-101c6075 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6075 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(28, 26, 18, 0.85);
}

.e-101c6075 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: #1c1a12;
}

.e-101c6075 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: #1c1a12;
	border-bottom: 1px solid rgba(28, 26, 18, 0.45);
	transition: border-color 240ms ease;
}

.e-101c6075 .card:hover .card-link
{
	border-bottom-color: #1c1a12;
}

/* ===== RESPONSIVE — smaller square cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-101c6075 .card { width: 330px; }
	.e-101c6075 .card-price { font-size: 23px; }
	.e-101c6075 .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6075 > .holder > .head { margin-bottom: 24px; }
	.e-101c6075 .head > .title { font-size: 27px; }
	.e-101c6075 .head > .subtitle { font-size: 16px; }
	.e-101c6075 .card { width: 200px; }
	.e-101c6075 .card > .card-top { padding: 14px 15px 0; }
	.e-101c6075 .card > .card-bottom { padding: 13px 15px 15px; }
	.e-101c6075 .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6075 .card { width: 130px; }
	.e-101c6075 .card-price { font-size: 20px; }
	.e-101c6075 .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-6 ===== */
/* ===== BEGIN: section-hotel-mozaik-7 ===== */

.e-101c6074
{
	display: block;
	width: 100%;
}

.e-101c6074 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6074 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6074 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6074 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6074 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6074 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== TWO SLIDING ROWS (marquee — top scrolls left, bottom scrolls right) ===== */

.e-101c6074 .rows
{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.e-101c6074 .row
{
	overflow: hidden;
}

.e-101c6074 .track
{
	display: flex;
	gap: 14px;
	width: max-content;
	will-change: transform;
}

.e-101c6074 .row-top > .track
{
	animation: e-101c6074-left 90s linear infinite;
}

.e-101c6074 .row-bottom > .track
{
	animation: e-101c6074-right 90s linear infinite;
}

/* Pause both rows on hover so a card can be read. */

.e-101c6074 .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-101c6074-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

@keyframes e-101c6074-right
{
	from
	{
		transform: translateX(-50%);
	}

	to
	{
		transform: translateX(0);
	}
}

/* ===== CARD (full-cover image, clickable) — every card the same square size, top two corners maximally rounded ===== */

.e-101c6074 .card
{
	position: relative;
	flex: 0 0 auto;
	width: 440px;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: 50% 50% var(--ot-radius-l) var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6074 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6074 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6074 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6074 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6074 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6074 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6074 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6074 .card-price-block
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.e-101c6074 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6074 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6074 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6074 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-101c6074 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6074 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6074 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6074 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6074 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6074 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — smaller square cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-101c6074 .card { width: 330px; }
	.e-101c6074 .card-price { font-size: 23px; }
	.e-101c6074 .card-title { font-size: 20px; }
}

/* ===== RESPONSIVE — smaller header + cards on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6074 > .holder > .head { margin-bottom: 24px; }
	.e-101c6074 .head > .title { font-size: 27px; }
	.e-101c6074 .head > .subtitle { font-size: 16px; }
	.e-101c6074 .card { width: 200px; }
	.e-101c6074 .card > .card-top { padding: 14px 15px 0; }
	.e-101c6074 .card > .card-bottom { padding: 0 15px 15px; }
	.e-101c6074 .card-title { font-size: 18px; }
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6074 .card { width: 130px; }
	.e-101c6074 .card-price { font-size: 20px; }
	.e-101c6074 .card-title { font-size: 16px; }
}

/* ===== END: section-hotel-mozaik-7 ===== */
/* ===== BEGIN: section-hotel-mozaik-8 ===== */

.e-101c6073
{
	display: block;
	width: 100%;
}

.e-101c6073 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6073 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6073 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6073 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6073 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6073 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== UNIFORM GRID (2 columns, equal wide landscape cards → 2 rows of 2) ===== */

.e-101c6073 .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 14px;
}

/* ===== CARD (full-cover image, clickable) — every card the same wide landscape size ===== */

.e-101c6073 .card
{
	position: relative;
	aspect-ratio: 3 / 2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6073 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6073 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6073 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6073 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6073 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6073 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6073 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6073 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6073 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6073 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6073 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6073 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-101c6073 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6073 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6073 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6073 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6073 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6073 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — smaller header on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6073 > .holder > .head { margin-bottom: 24px; }
	.e-101c6073 .head > .title { font-size: 27px; }
	.e-101c6073 .head > .subtitle { font-size: 16px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6073 .grid { grid-template-columns: 1fr; }
}

/* ===== END: section-hotel-mozaik-8 ===== */
/* ===== BEGIN: section-hotel-mozaik-9 ===== */

.e-101c6072
{
	display: block;
	width: 100%;
}

.e-101c6072 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-101c6072 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-101c6072 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-101c6072 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-101c6072 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-101c6072 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== UNIFORM GRID (4 columns, equal square cards → 2 rows of 4) ===== */

.e-101c6072 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

/* ===== CARD (full-cover image, clickable) — every card the same square size, top-right corner maximally rounded ===== */

.e-101c6072 .card
{
	position: relative;
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l) 50% var(--ot-radius-l) var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-101c6072 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-101c6072 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-101c6072 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-101c6072 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-101c6072 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + board) ===== */

.e-101c6072 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px 20px 0;
	color: white;
}

.e-101c6072 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-101c6072 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-101c6072 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-101c6072 .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-101c6072 .card-board
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (gold stars + destination + serif hotel + link) ===== */

.e-101c6072 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	padding: 0 20px 20px;
	color: white;
}

.e-101c6072 .card-stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-101c6072 .card-stars > i
{
	font-size: 15px;
	font-variation-settings: 'FILL' 1;
}

.e-101c6072 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-101c6072 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: white;
}

.e-101c6072 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-101c6072 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — 3 columns on wide tablet ===== */

@media (max-width: 1280px)
{
	.e-101c6072 .grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 900px)
{
	.e-101c6072 .head > .title { font-size: 32px; }
	.e-101c6072 .grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== OPTIONAL CTA BUTTON BELOW THE GRID ===== */

.e-101c6072 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.e-101c6072 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 34px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	text-decoration: none;
	transition: background 0.2s ease;
}

.e-101c6072 .foot > .cta:hover
{
	background: #e0b30e;
}

/* ===== RESPONSIVE — 2 columns with smaller header on small tablet ===== */

@media (max-width: 640px)
{
	.e-101c6072 > .holder > .head { margin-bottom: 24px; }
	.e-101c6072 .head > .title { font-size: 27px; }
	.e-101c6072 .head > .subtitle { font-size: 16px; }
	.e-101c6072 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-101c6072 .foot > .cta { width: 100%; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 400px)
{
	.e-101c6072 .grid { grid-template-columns: 1fr; }
	.e-101c6072 .card { aspect-ratio: 3 / 2.4; }
}

/* ===== END: section-hotel-mozaik-9 ===== */
/* ===== BEGIN: section-hotel-offers-carousel-1 ===== */

.e-75698d63
{
	display: block;
	width: 100%;
	--hc-navy: #141e5a;
	--hc-dark: #24303a;
	--hc-grey: #6b7280;
	--hc-blue: #2f6feb;
	--hc-blue-soft: rgba(47, 111, 235, 0.08);
	--hc-orange: #e0701a;
	--hc-sun: #f5901e;
	--hc-sun-off: rgba(36, 48, 58, 0.18);
	--hc-yellow: #f5c518;
	--hc-badge: #f5d94e;
	--hc-pill: #f2f2f3;
}

.e-75698d63 > .holder
{
	width: 100%;
}

/* ===== NASLOV (sans-serif, jer sites tema gura serif na sve h1-h6) ===== */

.e-75698d63 > .holder > .head
{
	margin: 0 0 16px 0;
}

.e-75698d63 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--hc-navy);
}

/* ===== RED ISPOD NASLOVA (outline pill levo, brojač + jedna strelica desno) ===== */

.e-75698d63 > .holder > .top
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 20px 0;
}

.e-75698d63 > .holder > .top > .all
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 22px;
	border: 1.5px solid var(--hc-blue);
	border-radius: 100px;
	background: transparent;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--hc-blue);
	transition: background var(--ot-transition);
}

.e-75698d63 > .holder > .top > .all:hover
{
	background: var(--hc-blue-soft);
}

.e-75698d63 > .holder > .top > .nav
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-left: auto;
}

.e-75698d63 .nav > .counter
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--hc-dark);
}

.e-75698d63 .nav > .nav-next
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1.5px solid var(--hc-blue);
	border-radius: 50%;
	background: transparent;
	color: var(--hc-blue);
	cursor: pointer;
	transition: background var(--ot-transition);
}

.e-75698d63 .nav > .nav-next:hover
{
	background: var(--hc-blue-soft);
}

.e-75698d63 .nav > .nav-next > i
{
	font-size: 24px;
	line-height: 1;
}

/* ===== VIEWPORT / TRACK ===== */

.e-75698d63 > .holder > .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
}

.e-75698d63 > .holder > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-75698d63 > .holder > .viewport > .track > .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 4));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 4));
	min-width: 0;
	padding: 0 10px;
}

.e-75698d63 .cell > .promo,
.e-75698d63 .cell > .card
{
	flex: 1;
	min-width: 0;
}

/* ===== PROMO PLOČICA (ilustracija: gradijent + prozirni znaci, nije fotografija) ===== */

.e-75698d63 .cell > .promo
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 420px;
	padding: 26px 22px;
	border-radius: 10px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-75698d63 .cell > .promo:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

.e-75698d63 .promo > .promo-art
{
	position: absolute;
	inset: 0;
	display: block;
	pointer-events: none;
}

.e-75698d63 .promo-art > i
{
	position: absolute;
	line-height: 1;
	color: #ffffff;
}

.e-75698d63 .promo-art > .art-sun
{
	top: -26px;
	right: -22px;
	font-size: 150px;
	opacity: 0.28;
}

.e-75698d63 .promo-art > .art-pool
{
	bottom: 96px;
	left: -30px;
	font-size: 150px;
	opacity: 0.2;
}

.e-75698d63 .promo-art > .art-waves
{
	right: -40px;
	bottom: -54px;
	font-size: 220px;
	opacity: 0.18;
}

.e-75698d63 .promo > .promo-body
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
}

.e-75698d63 .promo-body > .promo-title
{
	font-family: var(--ot-font-primary);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.15;
	text-align: left;
	color: #ffffff;
	text-shadow: 0 2px 10px rgba(15, 23, 42, 0.22);
}

.e-75698d63 .promo-body > .promo-tag
{
	display: inline-block;
	padding: 8px 16px;
	border-radius: 100px;
	background: var(--hc-orange);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

/* ===== KARTICA HOTELA ===== */

.e-75698d63 .cell > .card
{
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-75698d63 .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== MINI GALERIJA (slika + male kružne strelice preko ivica + žuti badge) ===== */

.e-75698d63 .card > .gallery
{
	position: relative;
	flex-shrink: 0;
	height: 190px;
	overflow: hidden;
}

.e-75698d63 .gallery > .shot
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-75698d63 .gallery > .badge
{
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	display: inline-block;
	padding: 6px 12px;
	border-radius: 100px;
	background: var(--hc-badge);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--hc-dark);
}

.e-75698d63 .gallery > .g-arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	color: var(--hc-dark);
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
	transform: translateY(-50%);
	transition: background var(--ot-transition);
}

.e-75698d63 .gallery > .g-arrow:hover
{
	background: #ffffff;
}

.e-75698d63 .gallery > .g-arrow > i
{
	font-size: 20px;
	line-height: 1;
}

.e-75698d63 .gallery > .g-prev
{
	left: 8px;
}

.e-75698d63 .gallery > .g-next
{
	right: 8px;
}

/* ===== INFO (raste da cena ostane poravnata na jednoj liniji) ===== */

.e-75698d63 .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	min-width: 0;
	padding: 14px 16px 16px;
}

.e-75698d63 .info > .rate
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.e-75698d63 .rate > .cats
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
}

.e-75698d63 .cats > .cat
{
	font-size: 16px;
	line-height: 1;
	color: var(--hc-sun-off);
}

.e-75698d63 .cats > .cat.is-on
{
	color: var(--hc-sun);
}

.e-75698d63 .rate > .score
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: auto;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	color: var(--hc-dark);
}

.e-75698d63 .score > i
{
	font-size: 17px;
	line-height: 1;
	color: var(--hc-yellow);
}

.e-75698d63 .info > .name
{
	width: 100%;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-decoration: none;
	color: var(--hc-dark);
}

.e-75698d63 .info > .name:hover
{
	text-decoration: underline;
}

.e-75698d63 .info > .loc
{
	display: inline-flex;
	align-items: flex-start;
	gap: 4px;
	max-width: 100%;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
	text-decoration: none;
	color: var(--hc-blue);
}

.e-75698d63 .info > .loc:hover
{
	text-decoration: underline;
}

.e-75698d63 .loc > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1.2;
}

/* ===== USLUGE (male kružne outline ikonice) ===== */

.e-75698d63 .info > .services
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 1px;
}

.e-75698d63 .services > .service
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border: 1px solid var(--hc-sun-off);
	border-radius: 50%;
	color: var(--hc-grey);
}

.e-75698d63 .service > i
{
	font-size: 15px;
	line-height: 1;
}

.e-75698d63 .service > .service-text
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1;
}

/* ===== POLAZAK I TERMIN ===== */

.e-75698d63 .info > .departure
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.35;
	color: var(--hc-grey);
}

.e-75698d63 .departure > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1;
}

.e-75698d63 .info > .stay
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	border-radius: 6px;
	background: var(--hc-pill);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;
	color: #4b5563;
}

.e-75698d63 .stay > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1;
}

.e-75698d63 .info > .spacer
{
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 12px;
}

/* ===== CENA (prikačena za dno, poravnata uz desnu ivicu) ===== */

.e-75698d63 .info > .price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	width: 100%;
	text-align: right;
}

.e-75698d63 .price > .price-line
{
	display: flex;
	align-items: baseline;
	gap: 4px;
	white-space: nowrap;
}

.e-75698d63 .price-line > .price-from
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hc-grey);
}

.e-75698d63 .price-line > .price-main
{
	font-size: 23px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--hc-dark);
}

.e-75698d63 .price-line > .price-unit
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hc-grey);
}

.e-75698d63 .price > .price-total
{
	font-size: 11px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--hc-grey);
}

/* ===== RESPONSIVE (promo + jedna do dve ponude, pa jedna puna kartica) ===== */

@media (max-width: 1024px)
{
	.e-75698d63 .head > .title
	{
		font-size: 32px;
	}

	.e-75698d63 > .holder > .viewport > .track > .cell
	{
		padding: 0 8px;
	}

	.e-75698d63 .card > .gallery
	{
		height: 176px;
	}

	.e-75698d63 .promo-body > .promo-title
	{
		font-size: 27px;
	}
}

@media (max-width: 640px)
{
	.e-75698d63 .head > .title
	{
		font-size: 27px;
	}

	.e-75698d63 > .holder > .top
	{
		gap: 12px;
	}

	.e-75698d63 > .holder > .top > .all
	{
		min-height: 40px;
		padding: 0 16px;
		font-size: 13px;
	}

	.e-75698d63 > .holder > .viewport > .track > .cell
	{
		padding: 0 6px;
	}

	.e-75698d63 .cell > .promo
	{
		min-height: 360px;
	}

	.e-75698d63 .card > .gallery
	{
		height: 200px;
	}

	.e-75698d63 .price-line > .price-main
	{
		font-size: 22px;
	}
}

/* ===== END: section-hotel-offers-carousel-1 ===== */
/* ===== BEGIN: section-hotel-offers-slider-1 ===== */

.e-254fd464
{
	display: block;
	width: 100%;
	--hs-dark: #24303a;
	--hs-grey: #6b7280;
	--hs-blue: #2f6feb;
	--hs-blue-soft: rgba(47, 111, 235, 0.08);
	--hs-sun: #f5901e;
	--hs-sun-off: rgba(36, 48, 58, 0.18);
	--hs-yellow: #f5c518;
	--hs-pill: #f2f2f3;
}

.e-254fd464 > .holder
{
	width: 100%;
}

/* ===== TOP (outline pill levo, brojač + strelica desno) ===== */

.e-254fd464 > .holder > .top
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 20px 0;
}

.e-254fd464 > .holder > .top > .all
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 22px;
	border: 1.5px solid var(--hs-blue);
	border-radius: 100px;
	background: transparent;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--hs-blue);
	transition: background var(--ot-transition);
}

.e-254fd464 > .holder > .top > .all:hover
{
	background: var(--hs-blue-soft);
}

.e-254fd464 > .holder > .top > .nav
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-left: auto;
}

.e-254fd464 .nav > .counter
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--hs-dark);
}

.e-254fd464 .nav > .nav-next
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1.5px solid var(--hs-blue);
	border-radius: 50%;
	background: transparent;
	color: var(--hs-blue);
	cursor: pointer;
	transition: background var(--ot-transition);
}

.e-254fd464 .nav > .nav-next:hover
{
	background: var(--hs-blue-soft);
}

.e-254fd464 .nav > .nav-next > i
{
	font-size: 24px;
	line-height: 1;
}

/* ===== VIEWPORT / TRACK ===== */

.e-254fd464 > .holder > .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
}

.e-254fd464 > .holder > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-254fd464 > .holder > .viewport > .track > .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 4));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 4));
	min-width: 0;
	padding: 0 10px;
}

.e-254fd464 .cell > .promo,
.e-254fd464 .cell > .card
{
	flex: 1;
	min-width: 0;
}

/* ===== PROMO (cela kartica je slika + nakrivljena bela nalepnica) ===== */

.e-254fd464 .cell > .promo
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
}

.e-254fd464 .promo > .promo-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.14);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-254fd464 .promo:hover > .promo-image
{
	transform: scale(1.05);
}

.e-254fd464 .promo > .label
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	max-width: 84%;
	padding: 16px 24px 26px;
	background: #ffffff;
	text-align: center;
	box-shadow: 0 10px 26px rgba(15, 23, 42, 0.22);
	transform: rotate(-3deg);
}

.e-254fd464 .label > .label-top
{
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.2;
	color: var(--hs-grey);
}

.e-254fd464 .label > .label-title
{
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--hs-dark);
}

/* ===== KARTICA HOTELA ===== */

.e-254fd464 .cell > .card
{
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-254fd464 .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== MINI GALERIJA (slika + male kružne strelice preko ivica) ===== */

.e-254fd464 .card > .gallery
{
	position: relative;
	flex-shrink: 0;
	height: 190px;
	overflow: hidden;
}

.e-254fd464 .gallery > .shot
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-254fd464 .gallery > .g-arrow
{
	position: absolute;
	top: 50%;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	color: var(--hs-dark);
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
	transform: translateY(-50%);
	transition: background var(--ot-transition);
}

.e-254fd464 .gallery > .g-arrow:hover
{
	background: #ffffff;
}

.e-254fd464 .gallery > .g-arrow > i
{
	font-size: 20px;
	line-height: 1;
}

.e-254fd464 .gallery > .g-prev
{
	left: 8px;
}

.e-254fd464 .gallery > .g-next
{
	right: 8px;
}

/* ===== INFO (raste da dno ostane poravnato) ===== */

.e-254fd464 .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	min-width: 0;
	padding: 14px 16px 16px;
}

.e-254fd464 .info > .rate
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.e-254fd464 .rate > .cats
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
}

.e-254fd464 .cats > .cat
{
	font-size: 16px;
	line-height: 1;
	color: var(--hs-sun-off);
}

.e-254fd464 .cats > .cat.is-on
{
	color: var(--hs-sun);
}

.e-254fd464 .rate > .score
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: auto;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	color: var(--hs-dark);
}

.e-254fd464 .score > i
{
	font-size: 17px;
	line-height: 1;
	color: var(--hs-yellow);
}

.e-254fd464 .info > .name
{
	width: 100%;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-decoration: none;
	color: var(--hs-dark);
}

.e-254fd464 .info > .name:hover
{
	text-decoration: underline;
}

.e-254fd464 .info > .loc
{
	display: inline-flex;
	align-items: flex-start;
	gap: 4px;
	max-width: 100%;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
	text-decoration: none;
	color: var(--hs-blue);
}

.e-254fd464 .info > .loc:hover
{
	text-decoration: underline;
}

.e-254fd464 .loc > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1.2;
}

.e-254fd464 .info > .tag
{
	display: inline-block;
	padding: 3px 9px;
	border-radius: 4px;
	background: var(--hs-pill);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--hs-grey);
}

/* ===== USLUGE (male kružne outline ikonice) ===== */

.e-254fd464 .info > .services
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 1px;
}

.e-254fd464 .services > .service
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border: 1px solid var(--hs-sun-off);
	border-radius: 50%;
	color: var(--hs-grey);
}

.e-254fd464 .service > i
{
	font-size: 15px;
	line-height: 1;
}

.e-254fd464 .service > .service-text
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1;
}

/* ===== POLAZAK I TERMIN ===== */

.e-254fd464 .info > .departure
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.35;
	color: var(--hs-grey);
}

.e-254fd464 .departure > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1;
}

.e-254fd464 .info > .stay
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	border-radius: 6px;
	background: var(--hs-pill);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;
	color: #4b5563;
}

.e-254fd464 .stay > i
{
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1;
}

.e-254fd464 .info > .spacer
{
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 12px;
}

/* ===== CENA (prikačena za dno, poravnata uz desnu ivicu) ===== */

.e-254fd464 .info > .price
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	width: 100%;
	text-align: right;
}

.e-254fd464 .price > .price-line
{
	display: flex;
	align-items: baseline;
	gap: 4px;
	white-space: nowrap;
}

.e-254fd464 .price-line > .price-from
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hs-grey);
}

.e-254fd464 .price-line > .price-main
{
	font-size: 23px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--hs-dark);
}

.e-254fd464 .price-line > .price-unit
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--hs-grey);
}

.e-254fd464 .price > .price-total
{
	font-size: 11px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--hs-grey);
}

/* ===== RESPONSIVE (promo + jedna do dve ponude, pa jedna puna kartica) ===== */

@media (max-width: 1024px)
{
	.e-254fd464 > .holder > .viewport > .track > .cell
	{
		padding: 0 8px;
	}

	.e-254fd464 .card > .gallery
	{
		height: 176px;
	}

	.e-254fd464 .label > .label-title
	{
		font-size: 22px;
	}
}

@media (max-width: 640px)
{
	.e-254fd464 > .holder > .top
	{
		gap: 12px;
	}

	.e-254fd464 > .holder > .top > .all
	{
		min-height: 40px;
		padding: 0 16px;
		font-size: 13px;
	}

	.e-254fd464 > .holder > .viewport > .track > .cell
	{
		padding: 0 6px;
	}

	.e-254fd464 .card > .gallery
	{
		height: 200px;
	}

	.e-254fd464 .info > .price
	{
		align-items: flex-end;
		width: 100%;
	}

	.e-254fd464 .price-line > .price-main
	{
		font-size: 22px;
	}
}

/* ===== END: section-hotel-offers-slider-1 ===== */
/* ===== BEGIN: section-hotel-picks-1 ===== */

.e-6966cd3f
{
	display: block;
	width: 100%;
}

.e-6966cd3f > .holder
{
	width: 100%;
	background: #f5f6f8;
	border-radius: var(--ot-radius-l);
	padding: 28px 24px 32px;
	box-sizing: border-box;
}

/* ===== HEADER ===== */

.e-6966cd3f > .holder > .head
{
	margin-bottom: 20px;
}

.e-6966cd3f .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 600;
	font-size: 26px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: #2f8fd6;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-6966cd3f .stage
{
	position: relative;
	outline: none;
}

.e-6966cd3f .viewport
{
	position: relative;
	overflow: hidden;
	padding: 8px 0;
}

.e-6966cd3f .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-6966cd3f .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-6966cd3f .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(15, 40, 70, 0.07);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-6966cd3f .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 40, 70, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-6966cd3f .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== HEART (white filled, top-right, no background circle) ===== */

.e-6966cd3f .card-image > .heart
{
	position: absolute;
	top: 10px;
	right: 10px;
	font-size: 24px;
	line-height: 1;
	color: white;
	cursor: pointer;
	font-variation-settings: 'FILL' 1;
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.35));
	transition: transform 180ms ease, color 180ms ease;
	z-index: 2;
}

.e-6966cd3f .card-image > .heart:hover
{
	transform: scale(1.12);
}

.e-6966cd3f .card-image > .heart.is-active
{
	color: #ff4d67;
}

/* ===== CARD BODY ===== */

.e-6966cd3f .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 6px;
	padding: 14px 16px 16px;
}

/* ===== NAME + STARS (inline flow: dugacak naziv se prelama, zvezdice u red ispod; kratak naziv drzi zvezdice u istom redu; bez zvezdica nema rezervisanog mesta) ===== */

.e-6966cd3f .card-body > .name-block
{
	display: block;
	line-height: 1.25;
}

.e-6966cd3f .name-block > .name
{
	font-size: 16px;
	font-weight: 600;
	color: #2f8fd6;
}

.e-6966cd3f .name-block > .stars
{
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	gap: 1px;
	margin-left: 6px;
	white-space: nowrap;
}

.e-6966cd3f .name-block > .stars > i
{
	font-size: 15px;
	line-height: 1;
	color: #f5b301;
	font-variation-settings: 'FILL' 1;
}

.e-6966cd3f .card-body > .location
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	color: var(--ot-text-1);
}

/* ===== FOOTER (rating left, price right, pinned to bottom, space above stretches) ===== */

.e-6966cd3f .card-body > .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 14px;
}

/* ===== RATING PILL (solid light blue, white text) ===== */

.e-6966cd3f .footer > .rating-pill
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
	padding: 5px 10px;
	background: #2f8fd6;
	border-radius: 100px;
	color: white;
	white-space: nowrap;
}

.e-6966cd3f .rating-pill > i
{
	font-size: 16px;
	line-height: 1;
	font-variation-settings: 'FILL' 1;
}

.e-6966cd3f .rating-pill > .rating
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
}

.e-6966cd3f .rating-pill > .rating-max
{
	font-size: 11px;
	opacity: 0.85;
	line-height: 1;
}

/* ===== PRICE BLOCK (two right-aligned rows) ===== */

.e-6966cd3f .footer > .price-block
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	min-width: 0;
	text-align: right;
}

.e-6966cd3f .price-block > .price-line
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	min-width: 0;
}

.e-6966cd3f .price-line > .info
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	font-size: 14px;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-6966cd3f .price-line > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-6966cd3f .price-line > .price
{
	font-size: 18px;
	font-weight: 800;
	line-height: 1;
	color: var(--ot-orange);
	white-space: nowrap;
}

.e-6966cd3f .price-block > .price-suffix
{
	font-size: 11px;
	color: var(--ot-text-1);
	white-space: nowrap;
}

/* ===== DOTS PAGINATION ===== */

.e-6966cd3f .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 22px;
}

.e-6966cd3f .dots > .dot
{
	width: 10px;
	height: 10px;
	padding: 0;
	background: white;
	border: 1px solid #2f8fd6;
	border-radius: 50%;
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-6966cd3f .dots > .dot:hover
{
	transform: scale(1.15);
}

.e-6966cd3f .dots > .dot.is-active
{
	background: #2f8fd6;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6966cd3f .head > .title { font-size: 24px; }
}

@media (max-width: 640px)
{
	.e-6966cd3f > .holder { padding: 22px 16px 26px; }
	.e-6966cd3f .head > .title { font-size: 22px; }
	.e-6966cd3f .cell { padding: 6px 8px; }
	.e-6966cd3f .name-block > .name { font-size: 15px; }
	.e-6966cd3f .price-line > .price { font-size: 16px; }
}

/* ===== END: section-hotel-picks-1 ===== */
/* ===== BEGIN: section-hotel-recommend-1 ===== */

.e-42468d77
{
	--hr-orange: #f5821e;
	--hr-orange-hover: #dc6f0f;
	--hr-navy: #16294d;
	--hr-blue: #dceefb;
	--hr-grey: #6b7280;
	--hr-lift: 22px;

	display: block;
	width: 100%;
}

.e-42468d77 > .holder
{
	width: 100%;
}

/* ===== LAYOUT: tekst levo (uzak) + karusel desno (sirok) ===== */

.e-42468d77 .layout
{
	display: grid;
	grid-template-columns: minmax(260px, 330px) 1fr;
	gap: 40px;
	align-items: start;
}

/* ===== INTRO (leva kolona, sve levo poravnato) ===== */

.e-42468d77 .intro
{
	text-align: left;
}

.e-42468d77 .intro > .eyebrow
{
	display: block;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--hr-orange);
}

.e-42468d77 .intro > .title
{
	margin: 10px 0 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--hr-navy);
}

.e-42468d77 .intro > .subtitle
{
	margin: 14px 0 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--hr-navy);
}

.e-42468d77 .intro > .description
{
	margin: 14px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--hr-grey);
}

.e-42468d77 .intro > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 22px;
	padding: 13px 26px;
	border-radius: 999px;
	background: var(--hr-orange);
	color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-42468d77 .intro > .cta:hover
{
	background: var(--hr-orange-hover);
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-42468d77 .stage
{
	position: relative;
	outline: none;
}

.e-42468d77 .viewport
{
	position: relative;
	overflow: hidden;
	padding: var(--hr-lift) 0 30px;
}

.e-42468d77 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (stepenasti karusel efekat kroz transform, visine ostaju jednake) ===== */

.e-42468d77 .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 2.6));
	max-width: calc(100% / var(--per-view, 2.6));
	padding: 0 11px;
	box-sizing: border-box;
}

.e-42468d77 .cell.is-raised
{
	transform: translateY(calc(-1 * var(--hr-lift)));
}

/* ===== CARD ===== */

.e-42468d77 .card
{
	position: relative;
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(15, 40, 70, 0.10);
	transition: box-shadow var(--ot-transition);
}

.e-42468d77 .card:hover
{
	box-shadow: 0 16px 38px rgba(15, 40, 70, 0.18);
}

/* ===== GALLERY (slika + male okrugle strelice + pilule + pecat) ===== */

.e-42468d77 .card > .gallery
{
	position: relative;
	flex: 0 0 214px;
	height: 214px;
	overflow: hidden;
}

.e-42468d77 .gallery > .shot
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-42468d77 .gallery > .g-arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	color: var(--hr-navy);
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
	transform: translateY(-50%);
	transition: background var(--ot-transition);
}

.e-42468d77 .gallery > .g-arrow:hover
{
	background: #ffffff;
}

.e-42468d77 .gallery > .g-arrow > i
{
	font-size: 20px;
	line-height: 1;
}

.e-42468d77 .gallery > .g-prev
{
	left: 8px;
}

.e-42468d77 .gallery > .g-next
{
	right: 8px;
}

.e-42468d77 .gallery > .pills
{
	position: absolute;
	top: 12px;
	left: 12px;
	right: 62px;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.e-42468d77 .pills > .pill
{
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--hr-orange);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
}

.e-42468d77 .gallery > .seal
{
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #ffffff;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	box-shadow: 0 3px 10px rgba(15, 23, 42, 0.20);
}

.e-42468d77 .gallery > .seal.is-text
{
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-align: center;
	color: var(--hr-navy);
}

/* ===== INFO (raste da plavi blok ostane poravnat) ===== */

.e-42468d77 .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
	padding: 16px 16px 18px;
}

.e-42468d77 .info > .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
}

.e-42468d77 .name-row > .name
{
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--hr-navy);
	text-decoration: none;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.e-42468d77 .name-row > .name:hover
{
	text-decoration: underline;
}

.e-42468d77 .name-row > .heart
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	background: #ffffff;
	color: var(--hr-grey);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	transition: color var(--ot-transition), border-color var(--ot-transition);
}

.e-42468d77 .name-row > .heart.is-liked
{
	border-color: var(--hr-orange);
	color: var(--hr-orange);
}

.e-42468d77 .info > .location
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	color: var(--hr-grey);
}

.e-42468d77 .location > i
{
	font-size: 16px;
	line-height: 1;
}

.e-42468d77 .info > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.e-42468d77 .stars > .star
{
	font-size: 14px;
	line-height: 1;
	color: var(--hr-orange);
}

.e-42468d77 .info > .services
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 12px;
	margin-top: 2px;
}

.e-42468d77 .services > .service
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--hr-grey);
}

.e-42468d77 .service > i
{
	font-size: 16px;
	line-height: 1;
}

.e-42468d77 .service > .service-text
{
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
}

/* ===== MONEY (svetloplavi blok na dnu) ===== */

.e-42468d77 .card > .money
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 16px 16px 14px;
	background: var(--hr-blue);
}

/* Pilula lebdi preko gornje ivice pa svi plavi blokovi ostaju iste visine. */

.e-42468d77 .money > .seats
{
	position: absolute;
	top: -13px;
	right: 16px;
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--hr-orange);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	box-shadow: 0 3px 10px rgba(15, 23, 42, 0.18);
}

.e-42468d77 .money > .meta
{
	display: inline-flex;
	align-items: flex-start;
	gap: 5px;
	font-size: 12px;
	line-height: 1.4;
	color: var(--hr-navy);
}

.e-42468d77 .meta > i
{
	flex: 0 0 auto;
	font-size: 15px;
	line-height: 1.2;
}

.e-42468d77 .money > .views
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	color: var(--hr-grey);
}

.e-42468d77 .views > i
{
	font-size: 14px;
	line-height: 1;
}

.e-42468d77 .money > .price-label
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 2px;
	font-size: 11px;
	color: var(--hr-grey);
}

.e-42468d77 .price-label > i
{
	font-size: 13px;
	line-height: 1;
}

.e-42468d77 .money > .price-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
}

.e-42468d77 .price-foot > .price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--hr-navy);
}

.e-42468d77 .price-foot > .go
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--hr-orange);
	color: #ffffff;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-42468d77 .price-foot > .go:hover
{
	background: var(--hr-orange-hover);
}

.e-42468d77 .price-foot > .go > i
{
	font-size: 22px;
	line-height: 1;
}

/* ===== CONTROLS (ispod karusela, desno poravnato) ===== */

.e-42468d77 .controls
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 14px;
}

.e-42468d77 .controls > .counter
{
	min-width: 48px;
	font-size: 15px;
	font-weight: 700;
	text-align: center;
	color: var(--hr-navy);
}

.e-42468d77 .controls > .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: #ffffff;
	color: var(--hr-navy);
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(15, 40, 70, 0.12);
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-42468d77 .controls > .arrow > i
{
	font-size: 24px;
	line-height: 1;
}

.e-42468d77 .controls > .arrow:hover
{
	background: var(--hr-orange);
	color: #ffffff;
}

.e-42468d77 .controls > .arrow.is-off
{
	opacity: 0.4;
	cursor: default;
}

.e-42468d77 .controls > .arrow.is-off:hover
{
	background: #ffffff;
	color: var(--hr-navy);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-42468d77 .layout
	{
		grid-template-columns: 1fr;
		gap: 26px;
	}

	.e-42468d77 .intro > .title { font-size: 32px; }
}

@media (max-width: 640px)
{
	.e-42468d77 .intro > .title { font-size: 27px; }
	.e-42468d77 .intro > .cta { width: 100%; }
	.e-42468d77 .viewport { padding: 0 0 26px; }
	.e-42468d77 .cell { padding: 0 4px; }
	.e-42468d77 .cell.is-raised { transform: none; }
	.e-42468d77 .name-row > .name { font-size: 17px; }
}

/* ===== END: section-hotel-recommend-1 ===== */
/* ===== BEGIN: section-hotel-results-1 ===== */

.e-6ce0927d
{
	display: block;
	width: 100%;
	--hr-pink: #e6197d;
	--hr-pink-hover: #c9166d;
	--hr-orange: #f5901e;
	--hr-green: #148f5f;
	--hr-yellow: #fff3cd;
	--hr-blue: #2f6feb;
	--hr-dark: #24303a;
	--hr-grey: #6b7280;
	--hr-line: #e8eaee;
}

.e-6ce0927d > .holder
{
	width: 100%;
}

/* ===== NASLOV (opcioni) ===== */

.e-6ce0927d > .holder > .head
{
	margin-bottom: 24px;
	text-align: left;
}

.e-6ce0927d > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--hr-dark);
}

/* ===== LISTA (kartice pune sirine, jedna ispod druge) ===== */

.e-6ce0927d > .holder > .list
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-6ce0927d > .holder > .list > .card
{
	display: flex;
	align-items: stretch;
	width: 100%;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.07);
	overflow: hidden;
	transition: box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card:hover
{
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(16, 24, 40, 0.13);
}

/* ===== LEVA KOLONA (fotografija preko cele visine kartice) ===== */

.e-6ce0927d > .holder > .list > .card > .media
{
	position: relative;
	flex: 0 0 40%;
	min-height: 268px;
	overflow: hidden;
	background: #eceff3;
}

.e-6ce0927d > .holder > .list > .card > .media > .media-link
{
	position: absolute;
	inset: 0;
	display: block;
}

.e-6ce0927d > .holder > .list > .card > .media > .media-link > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card:hover > .media > .media-link > .media-image
{
	transform: scale(1.04);
}

.e-6ce0927d > .holder > .list > .card > .media > .heart
{
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.86);
	box-shadow: 0 2px 8px rgba(16, 24, 40, 0.18);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card > .media > .heart:hover
{
	background: #ffffff;
	transform: scale(1.08);
}

.e-6ce0927d > .holder > .list > .card > .media > .heart > i
{
	font-size: 20px;
	color: var(--hr-dark);
}

.e-6ce0927d > .holder > .list > .card > .media > .heart.is-liked > i
{
	color: var(--hr-pink);
}

.e-6ce0927d > .holder > .list > .card > .media > .shot-next
{
	position: absolute;
	top: 50%;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin-top: -17px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.86);
	box-shadow: 0 2px 8px rgba(16, 24, 40, 0.18);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card > .media > .shot-next:hover
{
	background: #ffffff;
	transform: scale(1.08);
}

.e-6ce0927d > .holder > .list > .card > .media > .shot-next > i
{
	font-size: 22px;
	color: var(--hr-dark);
}

/* ===== SREDNJA KOLONA (naziv, kategorija, lokacija, osobine, mapa) ===== */

.e-6ce0927d > .holder > .list > .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
	padding: 22px 24px;
}

.e-6ce0927d > .holder > .list > .card > .info > .name
{
	font-size: 23px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--hr-dark);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card > .info > .name:hover
{
	color: var(--hr-pink);
}

.e-6ce0927d > .holder > .list > .card > .info > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-top: 6px;
}

.e-6ce0927d > .holder > .list > .card > .info > .stars > .star
{
	font-size: 15px;
	line-height: 1;
	color: var(--hr-orange);
}

.e-6ce0927d > .holder > .list > .card > .info > .place
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.e-6ce0927d > .holder > .list > .card > .info > .place > .flag
{
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 14px;
	border-radius: 2px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-6ce0927d > .holder > .list > .card > .info > .place > .location
{
	font-size: 14px;
	color: var(--hr-grey);
}

.e-6ce0927d > .holder > .list > .card > .info > .features
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 7px 22px;
	margin-top: 18px;
}

.e-6ce0927d > .holder > .list > .card > .info > .features.is-wide
{
	grid-template-columns: 1fr 1fr;
}

.e-6ce0927d > .holder > .list > .card > .info > .features > .feature
{
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	font-size: 14px;
	color: var(--hr-dark);
}

.e-6ce0927d > .holder > .list > .card > .info > .features > .feature > i
{
	flex: 0 0 auto;
	font-size: 18px;
	color: var(--hr-green);
}

.e-6ce0927d > .holder > .list > .card > .info > .map
{
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	gap: 6px;
	margin-top: auto;
	padding-top: 18px;
	font-size: 14px;
	font-weight: 700;
	color: var(--hr-blue);
	text-decoration: none;
}

.e-6ce0927d > .holder > .list > .card > .info > .map:hover
{
	text-decoration: underline;
}

.e-6ce0927d > .holder > .list > .card > .info > .map > i
{
	font-size: 19px;
}

/* ===== DESNA KOLONA (ocena, cena, detalji, dugme) ===== */

.e-6ce0927d > .holder > .list > .card > .side
{
	display: flex;
	flex: 0 0 246px;
	flex-direction: column;
	padding: 22px 24px;
	border-left: 1px solid var(--hr-line);
}

.e-6ce0927d > .holder > .list > .card > .side > .review
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
}

.e-6ce0927d > .holder > .list > .card > .side > .review > .review-text
{
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-6ce0927d > .holder > .list > .card > .side > .review > .review-text > .review-label
{
	font-size: 15px;
	font-weight: 800;
	color: var(--hr-green);
}

.e-6ce0927d > .holder > .list > .card > .side > .review > .review-text > .review-count
{
	font-size: 12px;
	color: var(--hr-grey);
}

.e-6ce0927d > .holder > .list > .card > .side > .review > .review-score
{
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--hr-green);
	font-size: 16px;
	font-weight: 800;
	color: #ffffff;
}

.e-6ce0927d > .holder > .list > .card > .side > .cost
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 12px 14px;
	border-radius: 8px;
	background: var(--hr-yellow);
}

.e-6ce0927d > .holder > .list > .card > .side > .cost > .cost-label
{
	font-size: 12px;
	color: var(--hr-grey);
}

.e-6ce0927d > .holder > .list > .card > .side > .cost > .cost-value
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--hr-dark);
}

.e-6ce0927d > .holder > .list > .card > .side > .note
{
	margin-top: 8px;
	font-size: 11px;
	line-height: 1.45;
	color: var(--hr-grey);
}

.e-6ce0927d > .holder > .list > .card > .side > .meta
{
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: 14px;
}

.e-6ce0927d > .holder > .list > .card > .side > .meta > .meta-line
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--hr-dark);
}

.e-6ce0927d > .holder > .list > .card > .side > .meta > .meta-line > i
{
	flex: 0 0 auto;
	font-size: 17px;
	color: var(--hr-grey);
}

.e-6ce0927d > .holder > .list > .card > .side > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin-top: auto;
	padding: 0 30px;
	border-radius: 100px;
	background: var(--hr-pink);
	font-size: 16px;
	font-weight: 800;
	color: #ffffff;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-6ce0927d > .holder > .list > .card > .side > .cta:hover
{
	background: var(--hr-pink-hover);
}

/* ===== TABLET ===== */

@media (max-width: 1024px)
{
	.e-6ce0927d > .holder > .head > .title
	{
		font-size: 28px;
	}

	.e-6ce0927d > .holder > .list > .card
	{
		flex-wrap: wrap;
	}

	.e-6ce0927d > .holder > .list > .card > .media
	{
		flex: 0 0 30%;
	}

	.e-6ce0927d > .holder > .list > .card > .info
	{
		flex: 1 1 0;
	}

	.e-6ce0927d > .holder > .list > .card > .info > .features.is-wide
	{
		grid-template-columns: 1fr;
	}

	.e-6ce0927d > .holder > .list > .card > .side
	{
		flex: 1 0 100%;
		flex-direction: row;
		align-items: center;
		gap: 18px;
		padding-top: 16px;
		border-top: 1px solid var(--hr-line);
		border-left: 0;
	}

	.e-6ce0927d > .holder > .list > .card > .side > .review
	{
		margin-bottom: 0;
	}

	.e-6ce0927d > .holder > .list > .card > .side > .note
	{
		flex: 0 1 190px;
		margin-top: 0;
	}

	.e-6ce0927d > .holder > .list > .card > .side > .meta
	{
		margin-top: 0;
	}

	.e-6ce0927d > .holder > .list > .card > .side > .cta
	{
		margin-top: 0;
		margin-left: auto;
	}
}

/* ===== MOBILNI ===== */

@media (max-width: 640px)
{
	.e-6ce0927d > .holder > .list > .card
	{
		flex-direction: column;
		flex-wrap: nowrap;
	}

	.e-6ce0927d > .holder > .list > .card > .media
	{
		flex: 0 0 auto;
		height: 220px;
		min-height: 0;
	}

	.e-6ce0927d > .holder > .list > .card > .info
	{
		flex: 0 0 auto;
		padding: 18px;
	}

	.e-6ce0927d > .holder > .list > .card > .info > .name
	{
		font-size: 20px;
	}

	.e-6ce0927d > .holder > .list > .card > .side
	{
		flex: 0 0 auto;
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		padding: 0 18px 18px;
	}

	/* Bez ovoga bi flex-basis iz tablet reda postao VISINA note-a, jer je kolona sada uspravna. */

	.e-6ce0927d > .holder > .list > .card > .side > .note
	{
		flex: 0 0 auto;
	}

	.e-6ce0927d > .holder > .list > .card > .side > .cta
	{
		width: 100%;
		margin-left: 0;
	}
}

/* ===== END: section-hotel-results-1 ===== */
/* ===== BEGIN: section-hotel-selections ===== */

.e-37761242
{
	display: block;
	width: 100%;
}

.e-37761242 > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamni sans naslov + sivi podnaslov) ===== */

.e-37761242 > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-37761242 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
	color: #24303a;
}

.e-37761242 .head > .subtitle
{
	margin: 8px 0 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== GRID (tri kartice jednake sirine i visine) ===== */

.e-37761242 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
	align-items: stretch;
}

/* ===== KARTICA (bela, klikabilna, jednake visine) ===== */

.e-37761242 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-37761242 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== MEDIA (slika na vrhu + rotirana koralna nalepnica) ===== */

.e-37761242 .card > .card-media
{
	position: relative;
	display: block;
	height: 200px;
	overflow: hidden;
}

.e-37761242 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-37761242 .card:hover .card-image
{
	transform: scale(1.06);
}

.e-37761242 .card-media > .card-badge
{
	position: absolute;
	top: 18px;
	left: 16px;
	padding: 6px 12px;
	background: #fb5a56;
	border-radius: 3px;
	box-shadow: 0 6px 14px rgba(20, 18, 16, 0.22);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
	color: #ffffff;
	transform: rotate(-5deg);
	transform-origin: left center;
}

/* ===== TELO KARTICE (naslov, opis, spacer, narandzasti link na dnu) ===== */

.e-37761242 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 20px;
}

.e-37761242 .card-body > .card-title
{
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: #24303a;
}

.e-37761242 .card-body > .card-desc
{
	margin-top: 10px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-37761242 .card-body > .spacer
{
	flex: 1;
	min-height: 16px;
}

.e-37761242 .card-body > .card-link
{
	font-size: 14px;
	font-weight: 600;
	color: #f57c00;
	transition: color var(--ot-transition);
}

.e-37761242 .card:hover .card-link
{
	color: #d96a00;
	text-decoration: underline;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

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

@media (max-width: 640px)
{
	.e-37761242 .head > .title
	{
		font-size: 24px;
	}

	.e-37761242 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-37761242 .card > .card-media
	{
		height: 180px;
	}
}

/* ===== END: section-hotel-selections ===== */
/* ===== BEGIN: section-hotel-showcase-1 ===== */

.e-3bc639c8
{
	display: block;
	width: 100%;
}

.e-3bc639c8 > .holder
{
	width: 100%;
}

/* ===== FILTER (top-right visual dropdown) ===== */

.e-3bc639c8 .filter
{
	display: flex;
	justify-content: flex-end;
	margin-bottom: 16px;
}

.e-3bc639c8 .filter > .filter-select
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-3);
	font-size: 14px;
	cursor: pointer;
}

.e-3bc639c8 .filter-select > .filter-text
{
	white-space: nowrap;
}

.e-3bc639c8 .filter-select > i
{
	font-size: 20px;
	line-height: 1;
	color: var(--ot-text-3);
}

/* ===== TABS (destinations, active = orange pill) ===== */

.e-3bc639c8 .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 20px;
}

.e-3bc639c8 .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	padding: 8px 18px;
	background: transparent;
	border: none;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease;
}

.e-3bc639c8 .tabs > .tab:hover
{
	color: var(--ot-orange);
}

.e-3bc639c8 .tabs > .tab.active
{
	background: var(--ot-orange);
	color: white;
	font-weight: 700;
}

.e-3bc639c8 .tabs > .tab.active:hover
{
	color: white;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-3bc639c8 .stage
{
	position: relative;
	outline: none;
}

.e-3bc639c8 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-3bc639c8 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-3bc639c8 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-3bc639c8 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 40, 70, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-3bc639c8 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(20, 40, 70, 0.16);
}

/* ===== CARD IMAGE (inset with a small white frame, rounded) ===== */

.e-3bc639c8 .card > .card-image-wrap
{
	position: relative;
	display: block;
	padding: 8px 8px 0;
}

.e-3bc639c8 .card-image-wrap > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-3bc639c8 .card:hover .card-image
{
	transform: scale(1.04);
}

.e-3bc639c8 .card-image-wrap > .badge
{
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	max-width: calc(100% - 32px);
	padding: 4px 12px;
	background: white;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-shadow: 0 4px 12px rgba(20, 40, 70, 0.12);
}

/* ===== CARD BODY ===== */

.e-3bc639c8 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 16px 16px;
}

.e-3bc639c8 .card-body > .location
{
	display: flex;
	align-items: center;
	gap: 4px;
	min-width: 0;
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-3bc639c8 .card-body > .location > i
{
	flex-shrink: 0;
	font-size: 15px;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-3bc639c8 .location > .location-text
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}

.e-3bc639c8 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.5em;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	text-transform: uppercase;
	letter-spacing: 0.01em;
	color: var(--ot-text-1);
}

/* ===== CATEGORY (stars OR colourful chips) ===== */

.e-3bc639c8 .card-body > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.e-3bc639c8 .stars > .star
{
	font-size: 18px;
	line-height: 1;
	color: #d9dde3;
	font-variation-settings: 'FILL' 1;
}

.e-3bc639c8 .stars > .star.on
{
	color: #f5b301;
}

.e-3bc639c8 .card-body > .chips
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.e-3bc639c8 .chips > .chip
{
	display: block;
	width: 20px;
	height: 10px;
	border-radius: 3px;
}

.e-3bc639c8 .chips > .chip:nth-child(1) { background: linear-gradient(135deg, #ff6a3d, #ffb03a); }
.e-3bc639c8 .chips > .chip:nth-child(2) { background: linear-gradient(135deg, #ffb03a, #f5d020); }
.e-3bc639c8 .chips > .chip:nth-child(3) { background: linear-gradient(135deg, #38c172, #7bd389); }
.e-3bc639c8 .chips > .chip:nth-child(4) { background: linear-gradient(135deg, #2f9fe0, #56c6f0); }
.e-3bc639c8 .chips > .chip:nth-child(5) { background: linear-gradient(135deg, #7b6cf6, #b06ff0); }

/* ===== PRICE ===== */

.e-3bc639c8 .card-body > .price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: 4px;
}

.e-3bc639c8 .price-block > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-3bc639c8 .price-block > .price-row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 4px 10px;
}

.e-3bc639c8 .price-row > .price-main
{
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.e-3bc639c8 .price-main > .price-old
{
	font-size: 13px;
	line-height: 1.3;
	color: var(--ot-text-3);
	text-decoration: line-through;
}

.e-3bc639c8 .price-main > .price-new
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	color: #2f9fe0;
}

.e-3bc639c8 .price-row > .service
{
	font-size: 12px;
	color: var(--ot-text-3);
	white-space: nowrap;
}

/* ===== SPACER (stretches so the bottom row pins to the base) ===== */

.e-3bc639c8 .card-body > .spacer
{
	flex: 1;
	min-height: 12px;
}

/* ===== FOOT (divider + dates left, rating/award right, pinned to bottom) ===== */

.e-3bc639c8 .card-body > .foot
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.e-3bc639c8 .foot > .divider
{
	display: block;
	width: 100%;
	height: 1px;
	background: var(--ot-bg-3-border);
}

.e-3bc639c8 .foot > .foot-row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 12px;
}

.e-3bc639c8 .foot-row > .foot-left
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-3bc639c8 .foot-left > .foot-dates
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-3bc639c8 .foot-left > .foot-occupancy
{
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-3bc639c8 .foot-row > .foot-right
{
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

/* ===== TRIPADVISOR (label + green circles) ===== */

.e-3bc639c8 .foot-right > .tripadvisor
{
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 3px;
}

.e-3bc639c8 .tripadvisor > .tripadvisor-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--ot-text-2);
}

.e-3bc639c8 .tripadvisor > .circles
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.e-3bc639c8 .circles > .circle
{
	display: block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: transparent;
	border: 1.5px solid #34a853;
	box-sizing: border-box;
}

.e-3bc639c8 .circles > .circle.on
{
	background: #34a853;
}

/* ===== AWARD (orange-blue pill) ===== */

.e-3bc639c8 .foot-right > .award
{
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	background: linear-gradient(135deg, var(--ot-orange), #2f9fe0);
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: white;
	white-space: nowrap;
}

/* ===== ARROWS (small white circle, just outside edges, centred on image) ===== */

.e-3bc639c8 .arrow
{
	position: absolute;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	z-index: 3;
	box-shadow: 0 6px 18px rgba(20, 40, 70, 0.18);
	transition: background 200ms ease, transform 200ms ease, color 200ms ease;
}

.e-3bc639c8 .arrow-prev
{
	left: -18px;
}

.e-3bc639c8 .arrow-next
{
	right: -18px;
}

.e-3bc639c8 .arrow:hover
{
	background: var(--ot-orange);
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-3bc639c8 .arrow > i
{
	font-size: 20px;
}

/* ===== DOTS (pagination, active orange) ===== */

.e-3bc639c8 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 20px;
}

.e-3bc639c8 .dots > .dot
{
	display: block;
	width: 9px;
	height: 9px;
	padding: 0;
	background: #f2d3b8;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-3bc639c8 .dots > .dot:hover
{
	transform: scale(1.15);
}

.e-3bc639c8 .dots > .dot.active
{
	background: var(--ot-orange);
	transform: scale(1.15);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-3bc639c8 .arrow { width: 36px; height: 36px; }
}

@media (max-width: 640px)
{
	.e-3bc639c8 .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.e-3bc639c8 .cell { padding: 6px 8px; }
	.e-3bc639c8 .arrow { width: 34px; height: 34px; left: -8px; }
	.e-3bc639c8 .arrow-next { right: -8px; }
}

/* ===== END: section-hotel-showcase-1 ===== */
/* ===== BEGIN: section-hotel-slider-1 ===== */

.e-5c61d844
{
	display: block;
	width: 100%;
}

.e-5c61d844 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-5c61d844 > .holder > .head
{
	margin-bottom: 24px;
}

.e-5c61d844 .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #0d3b66;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-5c61d844 .stage
{
	position: relative;
	outline: none;
}

.e-5c61d844 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-5c61d844 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-5c61d844 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-5c61d844 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(13, 59, 102, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5c61d844 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(13, 59, 102, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-5c61d844 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== CARD BODY ===== */

.e-5c61d844 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 16px 16px;
}

.e-5c61d844 .card-body > .title-row
{
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.e-5c61d844 .title-row > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	flex: 1;
	min-width: 0;
	min-height: 2.5em;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: #0d3b66;
}

.e-5c61d844 .title-row > .stars
{
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	gap: 1px;
	white-space: nowrap;
}

.e-5c61d844 .title-row > .stars > i
{
	font-size: 16px;
	line-height: 1;
	color: #0d3b66;
	font-variation-settings: 'FILL' 1;
}

.e-5c61d844 .card-body > .location
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	color: var(--ot-text-3);
}

/* ===== DETAILS (pinned toward bottom, gap above stretches) ===== */

.e-5c61d844 .card-body > .details
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: auto;
	padding-top: 4px;
}

.e-5c61d844 .details > .divider
{
	display: block;
	width: 100%;
	height: 1px;
	background: var(--ot-bg-3-border);
}

.e-5c61d844 .details > .detail-row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.e-5c61d844 .detail-row > .detail
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-5c61d844 .detail-row > .detail > i
{
	font-size: 16px;
	line-height: 1;
	color: #0d3b66;
}

.e-5c61d844 .detail-row > .detail > span
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== FOOTER (price left, outline button right, pinned to bottom) ===== */

.e-5c61d844 .card-body > .footer
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-top: 12px;
}

.e-5c61d844 .footer > .price-block
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
}

.e-5c61d844 .price-block > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-5c61d844 .price-block > .price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: #0d3b66;
}

.e-5c61d844 .footer > .detaljnije
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 7px 16px;
	background: transparent;
	border: 1px solid #0d3b66;
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	color: #0d3b66;
	white-space: nowrap;
	transition: background 200ms ease, color 200ms ease;
}

.e-5c61d844 .card:hover .footer > .detaljnije,
.e-5c61d844 .footer > .detaljnije:hover
{
	background: #0d3b66;
	color: white;
}

/* ===== ARROWS (small white circle, blue icon, just outside edges, centred on image) ===== */

.e-5c61d844 .arrow
{
	position: absolute;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: #0d3b66;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 6px 18px rgba(13, 59, 102, 0.18);
	transition: background 200ms ease, transform 200ms ease, color 200ms ease;
}

.e-5c61d844 .arrow-prev
{
	left: -18px;
}

.e-5c61d844 .arrow-next
{
	right: -18px;
}

.e-5c61d844 .arrow:hover
{
	background: #0d3b66;
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-5c61d844 .arrow > i
{
	font-size: 20px;
}

/* ===== PROGRESS BAR ===== */

.e-5c61d844 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 22px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-5c61d844 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #0d3b66;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5c61d844 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-5c61d844 .head > .title { font-size: 24px; }
	.e-5c61d844 .cell { padding: 6px 8px; }
	.e-5c61d844 .arrow { width: 34px; height: 34px; left: -10px; }
	.e-5c61d844 .arrow-next { right: -10px; }
	.e-5c61d844 .progress { max-width: 78%; }
}

/* ===== END: section-hotel-slider-1 ===== */
/* ===== BEGIN: section-hotel-slider-2 ===== */

.e-5c61d843
{
	display: block;
	width: 100%;
}

.e-5c61d843 > .holder
{
	width: 100%;
}

/* ===== HEADER ===== */

.e-5c61d843 > .holder > .head
{
	margin-bottom: 24px;
}

.e-5c61d843 .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #0d3b66;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-5c61d843 .stage
{
	position: relative;
	outline: none;
}

.e-5c61d843 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-5c61d843 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-5c61d843 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-5c61d843 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(13, 59, 102, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5c61d843 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(13, 59, 102, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-5c61d843 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== CARD BODY ===== */

.e-5c61d843 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 16px 16px;
}

/* ===== NAME + STARS (inline flow: dugacak naziv se prelama u dva reda, zvezdice se prelamaju zajedno sa nazivom u red ispod, ne preko ivice; bez zvezdica nema rezervisanog praznog mesta) ===== */

.e-5c61d843 .card-body > .name-block
{
	display: block;
	line-height: 1.25;
}

.e-5c61d843 .name-block > .name
{
	font-size: 18px;
	font-weight: 800;
	color: #0d3b66;
}

.e-5c61d843 .name-block > .stars
{
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	gap: 1px;
	margin-left: 6px;
	white-space: nowrap;
}

.e-5c61d843 .name-block > .stars > i
{
	font-size: 16px;
	line-height: 1;
	color: #0d3b66;
	font-variation-settings: 'FILL' 1;
}

.e-5c61d843 .card-body > .location
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	color: var(--ot-text-3);
}

/* ===== DETAILS (pinned toward bottom, gap above stretches) ===== */

.e-5c61d843 .card-body > .details
{
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: auto;
	padding-top: 4px;
}

.e-5c61d843 .details > .divider
{
	display: block;
	width: 100%;
	height: 1px;
	background: var(--ot-bg-3-border);
}

.e-5c61d843 .details > .detail-row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.e-5c61d843 .detail-row > .detail
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-5c61d843 .detail-row > .detail > i
{
	font-size: 16px;
	line-height: 1;
	color: #0d3b66;
}

.e-5c61d843 .detail-row > .detail > span
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== FOOTER (price left, outline button right, pinned to bottom) ===== */

.e-5c61d843 .card-body > .footer
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-top: 12px;
}

.e-5c61d843 .footer > .price-block
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
}

.e-5c61d843 .price-block > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-5c61d843 .price-block > .price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: #0d3b66;
}

.e-5c61d843 .footer > .detaljnije
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 7px 16px;
	background: transparent;
	border: 1px solid #0d3b66;
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	color: #0d3b66;
	white-space: nowrap;
	transition: background 200ms ease, color 200ms ease;
}

.e-5c61d843 .card:hover .footer > .detaljnije,
.e-5c61d843 .footer > .detaljnije:hover
{
	background: #0d3b66;
	color: white;
}

/* ===== ARROWS (small white circle, blue icon, just outside edges, centred on image) ===== */

.e-5c61d843 .arrow
{
	position: absolute;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: #0d3b66;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 6px 18px rgba(13, 59, 102, 0.18);
	transition: background 200ms ease, transform 200ms ease, color 200ms ease;
}

.e-5c61d843 .arrow-prev
{
	left: -18px;
}

.e-5c61d843 .arrow-next
{
	right: -18px;
}

.e-5c61d843 .arrow:hover
{
	background: #0d3b66;
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-5c61d843 .arrow > i
{
	font-size: 20px;
}

/* ===== PROGRESS BAR ===== */

.e-5c61d843 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 22px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-5c61d843 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #0d3b66;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5c61d843 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-5c61d843 .head > .title { font-size: 24px; }
	.e-5c61d843 .cell { padding: 6px 8px; }
	.e-5c61d843 .arrow { width: 34px; height: 34px; left: -10px; }
	.e-5c61d843 .arrow-next { right: -10px; }
	.e-5c61d843 .progress { max-width: 78%; }
}

/* ===== END: section-hotel-slider-2 ===== */
/* ===== BEGIN: section-hotel-slider-3 ===== */

.e-5c61d842
{
	display: block;
	width: 100%;
}

/* ===== HOLDER (very-light-grey section background so white cards stand out) ===== */

.e-5c61d842 > .holder
{
	width: 100%;
	background: #f5f6f8;
	padding: 40px 24px;
	box-sizing: border-box;
	border-radius: var(--ot-radius-l);
}

/* ===== HEADER ===== */

.e-5c61d842 > .holder > .head
{
	margin-bottom: 24px;
}

.e-5c61d842 .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #0d3b66;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-5c61d842 .stage
{
	position: relative;
	outline: none;
}

.e-5c61d842 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-5c61d842 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height) ===== */

.e-5c61d842 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	max-width: calc(100% / var(--per-view, 3));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-5c61d842 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(13, 59, 102, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5c61d842 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(13, 59, 102, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-5c61d842 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-5c61d842 .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD BODY (white, tidy padding; flex:1 so price bar pins to bottom) ===== */

.e-5c61d842 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 16px 16px;
}

/* ===== LOCATION PATH (small grey, dot separated) ===== */

.e-5c61d842 .card-body > .location
{
	font-size: 13px;
	line-height: 1.35;
	color: var(--ot-text-3);
}

/* ===== NAME (bold dark blue, may wrap two lines) ===== */

.e-5c61d842 .card-body > .name
{
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: #0d3b66;
}

/* ===== STARS (five turquoise; filled + outline) ===== */

.e-5c61d842 .card-body > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.e-5c61d842 .stars > i
{
	font-size: 18px;
	line-height: 1;
	color: #14b8a6;
}

.e-5c61d842 .stars > i.filled
{
	font-variation-settings: 'FILL' 1;
}

.e-5c61d842 .stars > i.outline
{
	font-variation-settings: 'FILL' 0;
}

/* ===== OFFER DETAILS (dark, dot separated) ===== */

.e-5c61d842 .card-body > .details
{
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--ot-text-1);
}

/* ===== RECOMMEND STRIP (two joined parts as one bar) ===== */

.e-5c61d842 .card-body > .recommend
{
	display: inline-flex;
	align-items: stretch;
	align-self: flex-start;
	max-width: 100%;
	margin-top: 2px;
}

.e-5c61d842 .recommend > .pill
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	background: #0d3b66;
	border: 1px solid #0d3b66;
	border-radius: 999px 0 0 999px;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.2;
	color: white;
	white-space: nowrap;
}

.e-5c61d842 .recommend > .pill > i
{
	font-size: 15px;
	line-height: 1;
	font-variation-settings: 'FILL' 1;
}

.e-5c61d842 .recommend > .reviews
{
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-left: none;
	border-radius: 0 999px 999px 0;
	font-size: 12px;
	line-height: 1.2;
	color: var(--ot-text-3);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== PRICE BAR (bottom, very-light-grey, thin top divider, button right) ===== */

.e-5c61d842 .card > .pricebar
{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-top: auto;
	padding: 12px 16px;
	background: #eef0f3;
	border-top: 1px solid var(--ot-bg-3-border);
}

.e-5c61d842 .pricebar > .price-button
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	padding: 8px 16px;
	background: #0d3b66;
	border-radius: var(--ot-radius-m);
	line-height: 1;
	transition: background 200ms ease;
}

.e-5c61d842 .card:hover .pricebar > .price-button
{
	background: #0a2e50;
}

.e-5c61d842 .price-button > .price-prefix
{
	font-size: 12px;
	color: rgba(255, 255, 255, 0.85);
}

.e-5c61d842 .price-button > .price
{
	font-size: 20px;
	font-weight: 800;
	color: white;
}

/* ===== ARROW (single small white circle, blue icon, just past right edge, centred on image) ===== */

.e-5c61d842 .arrow
{
	position: absolute;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	color: #0d3b66;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 6px 18px rgba(13, 59, 102, 0.18);
	transition: background 200ms ease, transform 200ms ease, color 200ms ease;
}

.e-5c61d842 .arrow-next
{
	right: -18px;
}

.e-5c61d842 .arrow:hover
{
	background: #0d3b66;
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-5c61d842 .arrow > i
{
	font-size: 20px;
}

/* ===== DOTS (centred pagination) ===== */

.e-5c61d842 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 24px;
}

.e-5c61d842 .dots > .dot
{
	width: 10px;
	height: 10px;
	padding: 0;
	background: var(--ot-bg-3);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-5c61d842 .dots > .dot:hover
{
	transform: scale(1.15);
}

.e-5c61d842 .dots > .dot.active
{
	background: #0d3b66;
}

/* ===== SHOW-ALL BUTTON (centred solid dark-blue) ===== */

.e-5c61d842 .show-all-row
{
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.e-5c61d842 .show-all
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 28px;
	background: #0d3b66;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	color: white;
	text-decoration: none;
	transition: background 200ms ease, transform 200ms ease;
}

.e-5c61d842 .show-all:hover
{
	background: #0a2e50;
	transform: translateY(-2px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5c61d842 > .holder { padding: 32px 20px; }
	.e-5c61d842 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-5c61d842 > .holder { padding: 24px 14px; }
	.e-5c61d842 .head > .title { font-size: 24px; }
	.e-5c61d842 .cell { padding: 6px 8px; }
	.e-5c61d842 .arrow { width: 34px; height: 34px; right: -10px; }
}

/* ===== END: section-hotel-slider-3 ===== */
/* ===== BEGIN: section-hotel-slider-intro-1 ===== */

.e-35e2945b
{
	display: block;
	width: 100%;
}

.e-35e2945b > .holder
{
	width: 100%;
}

/* ===== INTRO (left aligned, dark bold title + tight label list + cta link) ===== */

.e-35e2945b > .holder > .intro
{
	margin-bottom: 22px;
}

.e-35e2945b .intro > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

.e-35e2945b .intro > .intro-list
{
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
}

.e-35e2945b .intro-list > .intro-row
{
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--ot-text-1);
}

.e-35e2945b .intro-row > .intro-label
{
	font-weight: 700;
}

.e-35e2945b .intro-row > .intro-inline-link
{
	color: #17a2b8;
	font-weight: 600;
	text-decoration: underline;
}

.e-35e2945b .intro-row > .intro-inline-link:hover
{
	color: #128295;
}

.e-35e2945b .intro > .intro-cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	color: #17a2b8;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}

.e-35e2945b .intro-cta > span
{
	text-decoration: underline;
}

.e-35e2945b .intro-cta > i
{
	font-size: 20px;
	line-height: 1;
}

.e-35e2945b .intro-cta:hover
{
	color: #128295;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-35e2945b .stage
{
	position: relative;
	outline: none;
}

.e-35e2945b .viewport
{
	position: relative;
	overflow: hidden;
	padding: 8px 0;
}

.e-35e2945b .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height, footer pinned to bottom) ===== */

.e-35e2945b .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-35e2945b .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(15, 40, 70, 0.07);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-35e2945b .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 40, 70, 0.16);
}

/* ===== CARD IMAGE (clean, no overlay, rounded top via card overflow) ===== */

.e-35e2945b .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== CARD BODY (flex column so footer pins to the base) ===== */

.e-35e2945b .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 6px;
	padding: 14px 16px 16px;
}

/* ===== RATING ROW (red stars + optional TripAdvisor owl and green circles) ===== */

.e-35e2945b .card-body > .rating-row
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	min-height: 18px;
}

.e-35e2945b .rating-row > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
}

.e-35e2945b .rating-row > .stars > i
{
	font-size: 16px;
	line-height: 1;
	color: var(--ot-red);
	font-variation-settings: 'FILL' 1;
}

.e-35e2945b .rating-row > .ta
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.e-35e2945b .ta > .ta-owl
{
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #00aa6c;
	position: relative;
}

.e-35e2945b .ta > .ta-owl::before,
.e-35e2945b .ta > .ta-owl::after
{
	content: '';
	position: absolute;
	top: 4px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: white;
}

.e-35e2945b .ta > .ta-owl::before
{
	left: 3px;
}

.e-35e2945b .ta > .ta-owl::after
{
	right: 3px;
}

.e-35e2945b .ta > .ta-circles
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.e-35e2945b .ta-circles > .ta-dot
{
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 1px solid #00aa6c;
	box-sizing: border-box;
}

.e-35e2945b .ta-circles > .ta-dot.ta-full
{
	background: #00aa6c;
}

.e-35e2945b .ta-circles > .ta-dot.ta-half
{
	background: linear-gradient(90deg, #00aa6c 0 50%, transparent 50% 100%);
}

.e-35e2945b .ta-circles > .ta-dot.ta-empty
{
	background: transparent;
}

/* ===== NAME / LOCATION / PACKAGE ===== */

.e-35e2945b .card-body > .name
{
	font-size: 16px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-35e2945b .card-body > .location
{
	font-size: 13px;
	color: var(--ot-text-2);
}

.e-35e2945b .card-body > .package-info
{
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-1);
}

/* ===== FOOTER (divider + bottom block pinned to base, space above stretches) ===== */

.e-35e2945b .card-body > .footer
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
	padding-top: 12px;
}

.e-35e2945b .footer > .divider
{
	display: block;
	height: 1px;
	width: 100%;
	background: var(--ot-bg-3-border);
}

.e-35e2945b .footer > .package-type
{
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-35e2945b .footer > .price-row
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
}

.e-35e2945b .price-row > .price-block
{
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	min-width: 0;
}

.e-35e2945b .price-block > .price-prefix
{
	font-size: 12px;
	color: var(--ot-text-2);
	white-space: nowrap;
}

.e-35e2945b .price-block > .price
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-35e2945b .price-block > .price-suffix
{
	font-size: 10px;
	font-weight: 500;
	color: var(--ot-text-2);
	white-space: nowrap;
}

.e-35e2945b .price-row > .price-chevron
{
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-1);
	flex: 0 0 auto;
}

/* ===== PROTECTION PILL (light grey bg, dark text) ===== */

.e-35e2945b .footer > .protection
{
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	gap: 5px;
	padding: 4px 10px;
	background: var(--ot-bg-3);
	border-radius: 100px;
	font-size: 11px;
	color: var(--ot-text-1);
}

.e-35e2945b .protection > i
{
	font-size: 14px;
	line-height: 1;
}

/* ===== ARROW (round white, dark chevron, right, vertically centered) ===== */

.e-35e2945b .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: white;
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(15, 40, 70, 0.18);
	transition: background 240ms, color 240ms, transform 240ms;
}

.e-35e2945b .arrow:hover
{
	transform: translateY(-50%) scale(1.06);
}

.e-35e2945b .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

.e-35e2945b .arrow-next
{
	right: 12px;
}

/* ===== BOTTOM LINK (red, bold, right aligned, double arrow) ===== */

.e-35e2945b > .holder > .bottom
{
	display: flex;
	justify-content: flex-end;
	margin-top: 18px;
}

.e-35e2945b .bottom > .bottom-link
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--ot-red);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}

.e-35e2945b .bottom > .bottom-link:hover
{
	text-decoration: underline;
}

.e-35e2945b .bottom-link > .bottom-arrows
{
	font-weight: 800;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-35e2945b .intro > .title { font-size: 26px; }
}

@media (max-width: 640px)
{
	.e-35e2945b .intro > .title { font-size: 22px; }
	.e-35e2945b .intro-list > .intro-row { font-size: 14px; }
	.e-35e2945b .cell { padding: 6px 8px; }
	.e-35e2945b .card-body > .name { font-size: 15px; }
	.e-35e2945b .price-block > .price { font-size: 20px; }
	.e-35e2945b .arrow { width: 40px; height: 40px; }
}

/* ===== END: section-hotel-slider-intro-1 ===== */
/* ===== BEGIN: section-hotel-tabs-1 ===== */

.e-186a0d9
{
	display: block;
	width: 100%;
}

.e-186a0d9 > .holder
{
	width: 100%;
}

/* ===== TABS (card-style, wrap onto two rows, thin rule below) ===== */

.e-186a0d9 > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding-bottom: 20px;
	margin-bottom: 28px;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-186a0d9 .tabs > .tab
{
	flex-shrink: 0;
	padding: 9px 16px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.1;
	color: #0b2e6e;
	cursor: pointer;
	white-space: nowrap;
	transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.e-186a0d9 .tabs > .tab:hover
{
	border-color: #0b2e6e;
}

.e-186a0d9 .tabs > .tab.active
{
	background: #0b2e6e;
	border-color: #0b2e6e;
	color: white;
}

/* ===== GRID (3 columns x 2 rows, equal cells) ===== */

.e-186a0d9 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-186a0d9 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-186a0d9 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (full width, clips ribbon + badges) ===== */

.e-186a0d9 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
}

/* ===== RIBBON (diagonal magenta band over top-right corner) ===== */

.e-186a0d9 .card-image > .ribbon
{
	position: absolute;
	top: 0;
	right: 0;
	width: 128px;
	height: 128px;
	overflow: hidden;
	pointer-events: none;
	z-index: 2;
}

.e-186a0d9 .ribbon > .ribbon-text
{
	position: absolute;
	top: 26px;
	right: -46px;
	display: block;
	width: 180px;
	padding: 6px 0;
	background: #e0218a;
	color: white;
	font-size: 12px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: 0.03em;
	text-align: center;
	text-transform: uppercase;
	transform: rotate(45deg);
	box-shadow: 0 2px 6px rgba(20, 18, 16, 0.25);
}

/* ===== BADGES (orange pills stacked bottom-left) ===== */

.e-186a0d9 .card-image > .badges
{
	position: absolute;
	left: 10px;
	bottom: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	max-width: calc(100% - 20px);
	z-index: 1;
}

.e-186a0d9 .badges > .badge
{
	max-width: 100%;
	padding: 4px 10px;
	background: #f5811f;
	border-radius: 999px;
	font-size: 10px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0.02em;
	color: white;
	text-transform: uppercase;
	box-shadow: 0 2px 6px rgba(20, 18, 16, 0.2);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== CARD BODY ===== */

.e-186a0d9 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 16px;
}

.e-186a0d9 .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.4em;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
	color: #0b2e6e;
}

/* ===== LOCATION (grey breadcrumb, chevron separated, wraps) ===== */

.e-186a0d9 .location
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 4px;
	font-size: 13px;
	line-height: 1.35;
	color: var(--ot-text-3);
}

.e-186a0d9 .location > .crumb
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.e-186a0d9 .location .sep
{
	color: var(--ot-text-3);
	opacity: 0.7;
}

/* ===== BOTTOM GROUP (pinned to card bottom) ===== */

.e-186a0d9 .card-body > .bottom
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
	padding-top: 10px;
}

.e-186a0d9 .price-note
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-186a0d9 .info-bar
{
	display: block;
	padding: 8px 12px;
	background: #0b2e6e;
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0.02em;
	color: white;
	text-transform: uppercase;
}

/* ===== PRICE (bottom, right aligned: struck-through old + big new) ===== */

.e-186a0d9 .price-row
{
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 10px;
}

.e-186a0d9 .price-row > .price-old
{
	font-size: 15px;
	font-weight: 600;
	color: var(--ot-red);
	text-decoration: line-through;
}

.e-186a0d9 .price-row > .price-new
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
	color: #0b2e6e;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-186a0d9 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-186a0d9 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-186a0d9 > .holder > .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 16px;
		margin-bottom: 22px;
		-webkit-overflow-scrolling: touch;
	}
}

/* ===== END: section-hotel-tabs-1 ===== */
/* ===== BEGIN: section-info-banners-1 ===== */

.e-4b237236
{
	display: block;
	width: 100%;
	--ib-navy: #16294d;
	--ib-grey: #6b7280;
	--ib-photo: #eceae6;
}

.e-4b237236 > .holder
{
	display: block;
	width: 100%;
}

/* ===== NASLOV (sans-serif se forsira jer sites tema gura serif na h1-h6) ===== */

.e-4b237236 > .holder > .title
{
	margin: 0 0 24px 0;
	padding: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	line-height: 1.15;
	font-weight: 800;
	color: var(--ib-navy);
	text-align: left;
}

/* ===== NIZ BANERA ===== */

/* grid-auto-rows: 1fr izjednacava visine svih banera, i kad su opisi razlicite duzine. */

.e-4b237236 > .holder > .list
{
	display: grid;
	grid-template-columns: 1fr;
	grid-auto-rows: 1fr;
	gap: 20px;
}

.e-4b237236 > .holder > .list > .banner
{
	display: flex;
	align-items: stretch;
	width: 100%;
	height: 100%;
	min-height: 260px;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
	overflow: hidden;
	text-decoration: none;
	transition: box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-4b237236 > .holder > .list > .banner:hover
{
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(16, 24, 40, 0.14);
}

/* ===== LEVA KOLONA (fotografija preko cele visine banera) ===== */

.e-4b237236 > .holder > .list > .banner > .media
{
	position: relative;
	display: block;
	flex: 0 0 45%;
	max-width: 45%;
	overflow: hidden;
	background: var(--ib-photo);
}

.e-4b237236 > .holder > .list > .banner > .media > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-4b237236 > .holder > .list > .banner:hover > .media > .media-image
{
	transform: scale(1.04);
}

/* ===== DESNA KOLONA (tekst vertikalno centriran) ===== */

.e-4b237236 > .holder > .list > .banner > .body
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	flex: 1 1 auto;
	min-width: 0;
	padding: 30px 34px;
}

.e-4b237236 > .holder > .list > .banner > .body > .b-title
{
	display: block;
	font-family: var(--ot-font-primary);
	font-size: 24px;
	line-height: 1.25;
	font-weight: 800;
	color: var(--ib-navy);
}

.e-4b237236 > .holder > .list > .banner > .body > .b-text
{
	display: block;
	margin: 12px 0 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ib-grey);
}

/* ===== STRELICA U DONJEM DESNOM UGLU TEKSTA ===== */

.e-4b237236 > .holder > .list > .banner > .body > .b-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	align-self: flex-end;
	margin: 20px 0 0 0;
	font-size: 15px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--ib-navy);
}

.e-4b237236 > .holder > .list > .banner > .body > .b-link > i
{
	font-size: 20px;
	line-height: 1;
	transition: transform var(--ot-transition);
}

.e-4b237236 > .holder > .list > .banner:hover > .body > .b-link > i
{
	transform: translateX(3px);
}

/* ===== TABLET (uza fotografija, tekst i dalje desno) ===== */

@media (max-width: 1024px)
{
	.e-4b237236 > .holder > .title
	{
		font-size: 28px;
	}

	.e-4b237236 > .holder > .list > .banner
	{
		min-height: 220px;
	}

	.e-4b237236 > .holder > .list > .banner > .media
	{
		flex: 0 0 36%;
		max-width: 36%;
	}

	.e-4b237236 > .holder > .list > .banner > .body
	{
		padding: 24px 26px;
	}

	.e-4b237236 > .holder > .list > .banner > .body > .b-title
	{
		font-size: 21px;
	}
}

/* ===== TELEFON (jedna kolona, fotografija pune sirine na vrhu) ===== */

@media (max-width: 640px)
{
	.e-4b237236 > .holder > .list > .banner
	{
		flex-direction: column;
		min-height: 0;
	}

	/* flex-basis prati osu, pa se u koloni mora resetovati i zameniti visinom. */

	.e-4b237236 > .holder > .list > .banner > .media
	{
		flex: 0 0 auto;
		max-width: none;
		width: 100%;
		height: 190px;
	}

	.e-4b237236 > .holder > .list > .banner > .body
	{
		padding: 20px 22px 22px 22px;
	}

	.e-4b237236 > .holder > .list > .banner > .body > .b-title
	{
		font-size: 20px;
	}

	.e-4b237236 > .holder > .list > .banner > .body > .b-link
	{
		margin-top: 16px;
	}
}

/* ===== END: section-info-banners-1 ===== */
/* ===== BEGIN: section-inquiry-banner-1 ===== */

.e-202c02ec
{
	display: block;
	width: 100%;
	--ib-navy: #141e5a;
	--ib-blue: #2f6feb;
	--ib-blue-soft: rgba(47, 111, 235, 0.08);
	--ib-grey: #5c6672;
	--ib-dot: rgba(47, 111, 235, 0.55);
	--ib-teal: #1ca7d0;
	--ib-green: #27ae60;
	--ib-yellow: #f5d94e;
}

.e-202c02ec > .holder
{
	width: 100%;
}

/* ===== BANER (beli blok sa zaobljenim uglovima) ===== */

.e-202c02ec > .holder > .banner
{
	position: relative;
	display: flex;
	align-items: stretch;
	overflow: hidden;
	min-height: 300px;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 2px 14px rgba(20, 30, 90, 0.08);
}

/* ===== VIZUAL (leva trecina: talasi pa fotografija preko njih) ===== */

.e-202c02ec > .holder > .banner > .visual
{
	position: relative;
	flex: 0 0 30%;
	align-self: stretch;
}

/* Organski talas je isti idiom kao na promo i kontakt baneru: krug koji viri van ivice. */

.e-202c02ec > .holder > .banner > .visual > .wave
{
	position: absolute;
	z-index: 1;
	display: block;
	border-radius: 50%;
}

.e-202c02ec > .holder > .banner > .visual > .wave-blue
{
	top: -52px;
	left: -76px;
	width: 224px;
	height: 224px;
	background: var(--ib-blue);
	opacity: 0.9;
}

.e-202c02ec > .holder > .banner > .visual > .wave-teal
{
	bottom: -60px;
	left: -110px;
	width: 194px;
	height: 194px;
	background: var(--ib-teal);
	opacity: 0.85;
}

.e-202c02ec > .holder > .banner > .visual > .wave-green
{
	bottom: -70px;
	left: 34px;
	width: 128px;
	height: 128px;
	background: var(--ib-green);
	opacity: 0.75;
}

.e-202c02ec > .holder > .banner > .visual > .wave-yellow
{
	top: 44%;
	left: -34px;
	width: 96px;
	height: 96px;
	background: var(--ib-yellow);
	opacity: 0.9;
}

/* Maska gasi desnu ivicu fotografije prema beloj pozadini a levu prema talasima, tako da se oni vide iza nje i nigde nema tvrdog reza. */

.e-202c02ec > .holder > .banner > .visual > .photo
{
	position: absolute;
	z-index: 2;
	top: 0;
	bottom: 0;
	left: 0;
	display: block;
	width: 88%;
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 34%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 34%, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
}

/* ===== TELO (tekst u sredini, dugme desno — sve vertikalno centrirano) ===== */

.e-202c02ec > .holder > .banner > .body
{
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: 40px;
	padding: 40px 44px 40px 20px;
}

.e-202c02ec > .holder > .banner > .body > .text
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 12px;
}

/* Sites app gura serif na sve naslove, pa se sans-serif ovde postavlja eksplicitno. */

.e-202c02ec .text > .title
{
	margin: 0;
	max-width: 560px;
	font-family: var(--ot-font-primary);
	font-size: 29px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--ib-navy);
}

.e-202c02ec .text > .lead
{
	margin: 0;
	max-width: 560px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ib-grey);
}

/* ===== LISTA PREDNOSTI (tacka + tekst) ===== */

.e-202c02ec .text > .bullets
{
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: 6px;
}

.e-202c02ec .bullets > .bullet
{
	position: relative;
	padding-left: 18px;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ib-grey);
}

.e-202c02ec .bullets > .bullet::before
{
	position: absolute;
	top: 8px;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--ib-dot);
	content: '';
}

/* ===== AKCIJA (outline dugme pa sitna nota pod njim) ===== */

.e-202c02ec > .holder > .banner > .body > .action
{
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.e-202c02ec .action > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 30px;
	border: 1.5px solid var(--ib-blue);
	border-radius: 10px;
	background: transparent;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	color: var(--ib-blue);
	transition: background var(--ot-transition);
}

.e-202c02ec .action > .button:hover
{
	background: var(--ib-blue-soft);
}

.e-202c02ec .action > .note
{
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	text-align: center;
	color: var(--ib-grey);
}

/* ===== TABLET (uza slika, dugme ispod teksta) ===== */

@media (max-width: 1024px)
{
	.e-202c02ec > .holder > .banner
	{
		min-height: 260px;
	}

	.e-202c02ec > .holder > .banner > .visual
	{
		flex: 0 0 24%;
	}

	.e-202c02ec > .holder > .banner > .body
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 22px;
		padding: 32px 32px 32px 16px;
	}

	.e-202c02ec > .holder > .banner > .body > .text
	{
		width: 100%;
	}

	.e-202c02ec .text > .title
	{
		font-size: 25px;
	}

	.e-202c02ec > .holder > .banner > .body > .action
	{
		align-items: flex-start;
	}

	.e-202c02ec .action > .note
	{
		text-align: left;
	}

	.e-202c02ec > .holder > .banner > .visual > .wave-blue
	{
		top: -44px;
		left: -64px;
		width: 174px;
		height: 174px;
	}

	.e-202c02ec > .holder > .banner > .visual > .wave-teal
	{
		bottom: -50px;
		left: -88px;
		width: 152px;
		height: 152px;
	}

	.e-202c02ec > .holder > .banner > .visual > .wave-green
	{
		bottom: -56px;
		left: 84px;
		width: 100px;
		height: 100px;
	}

	.e-202c02ec > .holder > .banner > .visual > .wave-yellow
	{
		left: -26px;
		width: 74px;
		height: 74px;
	}
}

/* ===== MOBILNI (slika kao uska traka iznad teksta, dugme pune sirine na dnu) ===== */

@media (max-width: 768px)
{
	.e-202c02ec > .holder > .banner
	{
		flex-direction: column;
		min-height: 0;
	}

	.e-202c02ec > .holder > .banner > .body
	{
		gap: 20px;
		padding: 24px 22px 30px;
	}

	.e-202c02ec .text > .title
	{
		max-width: none;
		font-size: 22px;
	}

	.e-202c02ec .text > .lead
	{
		max-width: none;
		font-size: 15px;
	}

	.e-202c02ec > .holder > .banner > .body > .action
	{
		align-items: center;
		width: 100%;
	}

	.e-202c02ec .action > .button
	{
		width: 100%;
	}

	.e-202c02ec .action > .note
	{
		text-align: center;
	}

	/* Traka drzi talas u sebi jer on ovde vise ne ide preko banera nego preko teksta. */

	.e-202c02ec > .holder > .banner > .visual
	{
		order: -1;
		overflow: hidden;
		flex: 0 0 auto;
		height: 140px;
	}

	/* Na uskom ekranu ostaje samo jedan dekorativni talas, ostali se gase. */

	.e-202c02ec > .holder > .banner > .visual > .wave-teal,
	.e-202c02ec > .holder > .banner > .visual > .wave-green,
	.e-202c02ec > .holder > .banner > .visual > .wave-yellow
	{
		display: none;
	}

	/* Talas sedi u donjem levom uglu trake, tamo gde je fotografija vec prozirna. */

	.e-202c02ec > .holder > .banner > .visual > .wave-blue
	{
		top: auto;
		bottom: -64px;
		left: -48px;
		width: 154px;
		height: 154px;
	}

	.e-202c02ec > .holder > .banner > .visual > .photo
	{
		right: 0;
		width: auto;
		background-position: center 40%;
		-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 44%, rgba(0, 0, 0, 0) 100%);
		mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 44%, rgba(0, 0, 0, 0) 100%);
	}
}

/* ===== END: section-inquiry-banner-1 ===== */
/* ===== BEGIN: section-inspire-1 ===== */

.e-495bc1c0
{
	display: block;
	width: 100%;
}

.e-495bc1c0 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== SECTION HEAD (left-aligned, light-blue, semi-bold) ===== */

.e-495bc1c0 .section-head
{
	margin: 0 0 24px;
	padding: 0 8px;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ot-brand);
}

/* ===== STAGE ===== */

.e-495bc1c0 .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-495bc1c0 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 0;
}

.e-495bc1c0 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL ===== */

.e-495bc1c0 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 0 12px;
	box-sizing: border-box;
}

/* ===== CARD (white, rounded, soft shadow, equal height) ===== */

.e-495bc1c0 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--ot-bg-1);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-495bc1c0 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
}

/* ===== CARD IMAGE (full width top, rounded top corners) ===== */

.e-495bc1c0 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 16 / 11;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l) var(--ot-radius-l) 0 0;
}

/* ===== WAVE (two layers: light-blue band over image + white wave into body) ===== */
/* White wave is the top layer (crest ~y48), light-blue wave sits behind (crest ~y30) so only a thin blue sliver shows above the white crest. */

.e-495bc1c0 .card > .wave
{
	display: block;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 46px;
	margin-top: -46px;
	background-image:
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,48 C200,23 400,73 600,48 C800,23 1000,73 1200,48 L1200,100 L0,100 Z' fill='%23ffffff'/></svg>"),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,30 C200,5 400,55 600,30 C800,5 1000,55 1200,30 L1200,100 L0,100 Z' fill='%238fc9f2'/></svg>");
	background-position: bottom, bottom;
	background-size: 100% 100%, 100% 100%;
	background-repeat: no-repeat, no-repeat;
}

/* ===== CARD BODY (title + description, white, grows to keep equal height) ===== */

.e-495bc1c0 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 4px 22px 26px;
	background: var(--ot-bg-1);
	border-radius: 0 0 var(--ot-radius-l) var(--ot-radius-l);
}

/* ===== CARD TITLE (two lines, two-tone blue) ===== */

.e-495bc1c0 .card-title
{
	display: flex;
	flex-direction: column;
}

.e-495bc1c0 .title-top
{
	font-size: 21px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: #0d3b66;
}

.e-495bc1c0 .title-bottom
{
	font-size: 21px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: var(--ot-brand);
}

/* ===== CARD DESCRIPTION (dark, roomy, multi-line) ===== */

.e-495bc1c0 .card-desc
{
	margin-top: 18px;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== DOTS (centered, active filled blue, inactive white with blue ring) ===== */

.e-495bc1c0 .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 28px;
}

.e-495bc1c0 .dot
{
	width: 11px;
	height: 11px;
	padding: 0;
	background: var(--ot-bg-1);
	border: 1.5px solid var(--ot-brand);
	border-radius: 50%;
	cursor: pointer;
	transition: background 240ms ease, transform 240ms ease;
}

.e-495bc1c0 .dot:hover
{
	transform: scale(1.15);
}

.e-495bc1c0 .dot.is-active
{
	background: var(--ot-brand);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-495bc1c0 .section-head { font-size: 24px; }
	.e-495bc1c0 .cell { padding: 0 10px; }
}

@media (max-width: 640px)
{
	.e-495bc1c0 .section-head { font-size: 21px; }
	.e-495bc1c0 .cell { padding: 0 8px; }
	.e-495bc1c0 .card > .card-body { padding: 4px 18px 22px; }
}

/* ===== END: section-inspire-1 ===== */
/* ===== BEGIN: section-inspire-bento-1 (inspiracijska bento mreža destinacija) ===== */

.e-54dd4547
{
	display: block;
	width: 100%;
}

.e-54dd4547 > .holder
{
	width: 100%;
}

/* ===== BENTO (velika kartica levo + 2×2 mreža desno, jednak razmak) ===== */

.e-54dd4547 .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.e-54dd4547 .grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: 1fr;
	gap: 18px;
}

/* ===== CARD (klikabilan link, full-cover slika, zaobljeni uglovi, hover) ===== */

.e-54dd4547 .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 18px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-54dd4547 .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-54dd4547 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.e-54dd4547 .card:hover::before
{
	transform: scale(1.07);
}

.e-54dd4547 .card-big
{
	grid-column: 1;
	grid-row: 1;
	min-height: 420px;
}

.e-54dd4547 .card-small
{
	min-height: 190px;
}

/* ===== OVERLAY (velika kartica vrlo blag, male kartice preliv pri dnu) ===== */

.e-54dd4547 .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-54dd4547 .card-big > .overlay
{
	background: linear-gradient(to right, rgba(6, 10, 20, 0.28) 0%, rgba(6, 10, 20, 0.10) 45%, rgba(6, 10, 20, 0) 80%);
}

.e-54dd4547 .card-small > .overlay
{
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 45%, rgba(6, 10, 20, 0.72) 100%);
}

/* ===== TITLE (veliki beli, lakši font, levo i vertikalno centriran) ===== */

.e-54dd4547 .card-big > .title
{
	position: absolute;
	left: 34px;
	right: 34px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	max-width: 80%;
	font-size: 40px;
	font-weight: 300;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #ffffff;
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
}

/* ===== NAME (naziv destinacije, dole levo, bold) ===== */

.e-54dd4547 .card-small > .name
{
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 14px;
	z-index: 2;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.15;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-54dd4547 .bento
	{
		grid-template-columns: 1fr;
	}

	.e-54dd4547 .card-big
	{
		min-height: 300px;
	}

	.e-54dd4547 .card-big > .title { font-size: 34px; }
}

@media (max-width: 640px)
{
	.e-54dd4547 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-54dd4547 .card-big
	{
		min-height: 260px;
	}

	.e-54dd4547 .card-small
	{
		min-height: 200px;
	}

	.e-54dd4547 .card-big > .title { font-size: 28px; }
	.e-54dd4547 .card-small > .name { font-size: 17px; }
}

/* ===== END: section-inspire-bento-1 ===== */
/* ===== BEGIN: section-inspire-bento-2 (inspiracijski hero + grid) ===== */

.e-54dd4546
{
	display: block;
	width: 100%;
}

.e-54dd4546 > .holder
{
	width: 100%;
}

/* ===== BENTO (velika kartica levo + 2x2 mreza desno, jednak razmak) ===== */

.e-54dd4546 .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.e-54dd4546 .grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: 1fr;
	gap: 16px;
}

/* ===== CARD (klikabilan link, full-cover slika, zaobljeni uglovi, hover) ===== */

.e-54dd4546 .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-54dd4546 .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-54dd4546 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.e-54dd4546 .card:hover::before
{
	transform: scale(1.07);
}

.e-54dd4546 .card-big
{
	grid-column: 1;
	grid-row: 1;
	min-height: 420px;
}

.e-54dd4546 .card-small
{
	min-height: 190px;
}

/* ===== OVERLAY (blag tamni preliv radi citljivosti teksta) ===== */

.e-54dd4546 .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-54dd4546 .card-big > .overlay
{
	background: linear-gradient(to right, rgba(6, 10, 20, 0.52) 0%, rgba(6, 10, 20, 0.24) 55%, rgba(6, 10, 20, 0.04) 100%);
}

.e-54dd4546 .card-small > .overlay
{
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 42%, rgba(6, 10, 20, 0.74) 100%);
}

/* ===== VELIKA KARTICA (naslov levo, vertikalno centriran, plavo dugme ispod) ===== */

.e-54dd4546 .card-big > .content
{
	position: absolute;
	left: 34px;
	right: 34px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
}

.e-54dd4546 .card-big > .content > .title
{
	max-width: 86%;
	font-family: var(--ot-font-primary);
	font-size: 40px;
	font-weight: 800;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: #ffffff;
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
}

.e-54dd4546 .card-big > .content > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 26px;
	border-radius: 999px;
	background-color: #2f6feb;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	color: #ffffff;
	box-shadow: 0 6px 18px rgba(47, 111, 235, 0.34);
	transition: background-color var(--ot-transition), box-shadow var(--ot-transition);
}

.e-54dd4546 .card-big:hover > .content > .cta
{
	background-color: #2359c9;
	box-shadow: 0 10px 24px rgba(35, 89, 201, 0.42);
}

/* ===== MALE KARTICE (naziv + napomena, dole levo, ista pozicija na sve cetiri) ===== */

.e-54dd4546 .card-small > .content
{
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 14px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
}

.e-54dd4546 .card-small > .content > .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.18;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

.e-54dd4546 .card-small > .content > .note
{
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	color: rgba(255, 255, 255, 0.86);
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-54dd4546 .bento
	{
		grid-template-columns: 1fr;
	}

	.e-54dd4546 .card-big
	{
		min-height: 320px;
	}

	.e-54dd4546 .card-big > .content > .title { font-size: 34px; }
}

@media (max-width: 640px)
{
	.e-54dd4546 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-54dd4546 .card-big
	{
		min-height: 260px;
	}

	.e-54dd4546 .card-small
	{
		min-height: 200px;
	}

	.e-54dd4546 .card-big > .content
	{
		left: 20px;
		right: 20px;
		gap: 16px;
	}

	.e-54dd4546 .card-big > .content > .title { font-size: 28px; }
	.e-54dd4546 .card-small > .content > .name { font-size: 17px; }
}

/* ===== END: section-inspire-bento-2 ===== */
/* ===== BEGIN: section-interest-slider-1 ===== */

.e-753bcb4a
{
	display: block;
	width: 100%;
}

.e-753bcb4a > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (centered dark-grey subtitle) ===== */

.e-753bcb4a > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 32px;
}

.e-753bcb4a .head > .subtitle
{
	margin: 0;
	max-width: 640px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== STAGE (green strap sits behind the lower part of the cards) ===== */

.e-753bcb4a .stage
{
	position: relative;
	padding: 46px 0 30px;
}

.e-753bcb4a .stage > .strap
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 62%;
	background: #0f7a55;
	border-radius: var(--ot-radius-l);
	z-index: 0;
}

/* ===== VIEWPORT + TRACK ===== */

.e-753bcb4a .viewport
{
	position: relative;
	z-index: 1;
	overflow: hidden;
	padding: 0 24px;
}

.e-753bcb4a .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (tall portrait, full-cover image) ===== */

.e-753bcb4a .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4.2));
	max-width: calc(100% / var(--per-view, 4.2));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-753bcb4a .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.4;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.22);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-753bcb4a .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-753bcb4a .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-753bcb4a .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== DARK BOTTOM GRADIENT (readability) ===== */

.e-753bcb4a .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(12, 12, 14, 0.86) 0%, rgba(12, 12, 14, 0.42) 34%, rgba(12, 12, 14, 0) 62%);
}

/* ===== CARD BODY (title + pill button, bottom) ===== */

.e-753bcb4a .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: 22px 22px 24px;
}

.e-753bcb4a .card-title
{
	font-weight: 800;
	font-size: 26px;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: white;
}

.e-753bcb4a .card-btn
{
	display: inline-flex;
	align-items: center;
	padding: 10px 18px;
	background: #1c1f26;
	border-radius: 100px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: white;
	transition: background 240ms ease, transform 240ms ease;
}

.e-753bcb4a .card:hover .card-btn
{
	background: black;
	transform: translateY(-2px);
}

/* ===== CONTROLS (arrows left, progress bar right — over the green strap) ===== */

.e-753bcb4a .controls
{
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 26px;
	padding: 0 24px;
}

.e-753bcb4a .controls > .arrows
{
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.e-753bcb4a .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: #1c1f26;
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	transition: background 240ms ease, transform 240ms ease;
}

.e-753bcb4a .arrow:hover
{
	background: black;
	transform: translateY(-2px);
}

.e-753bcb4a .arrow > i
{
	font-size: 22px;
}

.e-753bcb4a .controls > .progress
{
	position: relative;
	flex: 1 1 auto;
	height: 4px;
	background: rgba(255, 255, 255, 0.35);
	border-radius: 100px;
	overflow: hidden;
}

.e-753bcb4a .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: white;
	border-radius: 100px;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-753bcb4a .head > .subtitle { font-size: 19px; }
	.e-753bcb4a .card-title { font-size: 23px; }
	.e-753bcb4a .stage > .strap { height: 58%; }
}

@media (max-width: 640px)
{
	.e-753bcb4a > .holder > .head { margin-bottom: 24px; }
	.e-753bcb4a .head > .subtitle { font-size: 17px; }
	.e-753bcb4a .viewport { padding: 0 14px; }
	.e-753bcb4a .controls { padding: 0 14px; gap: 16px; }
	.e-753bcb4a .card-title { font-size: 21px; }
	.e-753bcb4a .arrow { width: 42px; height: 42px; }
}

/* ===== END: section-interest-slider-1 ===== */
/* ===== BEGIN: section-interest-slider-2 (usklađeno sa section-popular-destinations-1) ===== */

.e-753bcb4b
{
	display: block;
	width: 100%;
}

.e-753bcb4b > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (left aligned, serif dark-blue naslov — kao sekcija A) ===== */

.e-753bcb4b > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	margin-bottom: 32px;
}

.e-753bcb4b .head > .subtitle
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #10285c;
}

/* ===== STAGE (tamno plava traka stoji iza donjeg dela kartica) ===== */

.e-753bcb4b .stage
{
	position: relative;
	padding: 46px 0 30px;
}

.e-753bcb4b .stage > .strap
{
	position: absolute;
	left: calc(50% - 50vw);
	right: calc(50% - 50vw);
	bottom: 0;
	height: 62%;
	background: #10285c;
	border-radius: 0;
	z-index: 0;
}

/* ===== VIEWPORT + TRACK (ivice poravnate sa sekcijom A — bez bočnog paddinga) ===== */

.e-753bcb4b .viewport
{
	position: relative;
	z-index: 1;
	overflow: hidden;
	padding: 0;
}

.e-753bcb4b .track
{
	display: flex;
	margin: 0 -12px;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (visoka portret, full-cover slika) ===== */

.e-753bcb4b .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4.2));
	max-width: calc(100% / var(--per-view, 4.2));
	padding: 0 12px;
	box-sizing: border-box;
}

.e-753bcb4b .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.4;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 10px 28px rgba(16, 40, 92, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-753bcb4b .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 42px rgba(16, 40, 92, 0.22);
}

.e-753bcb4b .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-753bcb4b .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== DARK BOTTOM GRADIENT (readability) ===== */

.e-753bcb4b .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(12, 12, 14, 0.86) 0%, rgba(12, 12, 14, 0.42) 34%, rgba(12, 12, 14, 0) 62%);
}

/* ===== CARD BODY (title + pill button, bottom) ===== */

.e-753bcb4b .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: 22px 22px 24px;
}

.e-753bcb4b .card-title
{
	font-weight: 800;
	font-size: 26px;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: white;
}

/* Dugme — narandžasto sa belim tekstom (akcentna boja sekcije A) */

.e-753bcb4b .card-btn
{
	display: inline-flex;
	align-items: center;
	padding: 10px 18px;
	background: var(--ot-orange);
	border-radius: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: white;
	transition: background 240ms ease, transform 240ms ease;
}

.e-753bcb4b .card:hover .card-btn
{
	background: var(--ot-orange-hover);
	transform: translateY(-2px);
}

/* ===== CONTROLS (strelice levo, progress desno — preko tamno plave trake) ===== */

.e-753bcb4b .controls
{
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 26px;
	padding: 0;
}

.e-753bcb4b .controls > .arrows
{
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

/* Strelice — bela pozadina, tamno plava strelica */

.e-753bcb4b .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: white;
	border: 0;
	border-radius: 50%;
	color: #10285c;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(16, 40, 92, 0.24);
	transition: background 240ms ease, color 240ms ease, transform 240ms ease;
}

.e-753bcb4b .arrow:hover
{
	background: #10285c;
	color: white;
	transform: translateY(-2px);
}

.e-753bcb4b .arrow > i
{
	font-size: 22px;
}

.e-753bcb4b .controls > .progress
{
	position: relative;
	flex: 1 1 auto;
	height: 4px;
	background: rgba(255, 255, 255, 0.35);
	border-radius: 100px;
	overflow: hidden;
}

/* Progress fill — narandžast */

.e-753bcb4b .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--ot-orange);
	border-radius: 100px;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-753bcb4b .head > .subtitle { font-size: 28px; }
	.e-753bcb4b .card-title { font-size: 23px; }
	.e-753bcb4b .stage > .strap { height: 58%; }
}

@media (max-width: 640px)
{
	.e-753bcb4b > .holder > .head { margin-bottom: 24px; }
	.e-753bcb4b .head > .subtitle { font-size: 24px; }
	.e-753bcb4b .card-title { font-size: 21px; }
	.e-753bcb4b .arrow { width: 42px; height: 42px; }
}

/* ===== END: section-interest-slider-2 ===== */
/* ===== BEGIN: section-interests-1 ===== */

.e-45d9752f
{
	display: block;
	width: 100%;
}

.e-45d9752f > .holder
{
	width: 100%;
}

/* ===== HEADER (centered bold dark-blue title) ===== */

.e-45d9752f > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 40px;
}

.e-45d9752f .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

/* ===== GRID (6 equal cards, wraps down on smaller screens) ===== */

.e-45d9752f .grid
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
}

/* ===== CARD (single clickable unit) ===== */

.e-45d9752f .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: visible;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-45d9752f .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE (top, rounded top corners) ===== */

.e-45d9752f .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 4;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-top-left-radius: var(--ot-radius-l);
	border-top-right-radius: var(--ot-radius-l);
	overflow: hidden;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-45d9752f .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== BADGE (white rounded square straddling the image/cream seam) ===== */

.e-45d9752f .card-badge
{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: white;
	border-radius: 14px;
	box-shadow: 0 6px 16px rgba(20, 18, 16, 0.18);
}

.e-45d9752f .card-badge > i
{
	font-size: 24px;
	line-height: 1;
	color: var(--ot-brand);
}

/* ===== CARD BODY (cream lower block with centered bold title) ===== */

.e-45d9752f .card > .card-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	text-align: center;
	padding: 34px 14px 18px;
	background: #f6efe2;
	border-bottom-left-radius: var(--ot-radius-l);
	border-bottom-right-radius: var(--ot-radius-l);
}

.e-45d9752f .card-name
{
	font-weight: 700;
	font-size: 15px;
	line-height: 1.3;
	color: var(--ot-brand);
}

/* ===== RESPONSIVE (3 per row on tablet, 2 per row on mobile) ===== */

@media (max-width: 1024px)
{
	.e-45d9752f .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-45d9752f .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.e-45d9752f .head > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-interests-1 ===== */
/* ===== BEGIN: section-lastminute-1 ===== */

.e-7c404c4c
{
	display: block;
	width: 100%;
}

.e-7c404c4c > .holder
{
	width: 100%;
}

/* ===== HEADER (centered title + pill tabs + subtitle) ===== */

.e-7c404c4c > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
	margin-bottom: 28px;
}

.e-7c404c4c .head > .head-top
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 20px;
}

.e-7c404c4c .head-top > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-7c404c4c .head-top > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.e-7c404c4c .tabs > .tab
{
	margin: 0;
	padding: 8px 18px;
	border: 1px solid var(--ot-brand-border);
	border-radius: 999px;
	background: transparent;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	color: var(--ot-brand);
	transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.e-7c404c4c .tabs > .tab:hover
{
	background: var(--ot-brand-opacity);
}

.e-7c404c4c .tabs > .tab.active
{
	border-color: var(--ot-brand);
	background: var(--ot-brand);
	color: #ffffff;
}

.e-7c404c4c .head > .subtitle
{
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== LIST (vertical stack of departure cards) ===== */

.e-7c404c4c .list
{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.e-7c404c4c .row
{
	border-radius: var(--ot-radius-l);
	background: #ffffff;
	box-shadow: 0 1px 3px rgba(16, 32, 64, 0.06);
	transition: box-shadow 240ms ease, background 240ms ease;
}

.e-7c404c4c .row:hover
{
	box-shadow: 0 6px 18px rgba(16, 32, 64, 0.12);
}

/* ===== ROW MAIN (horizontal columns on desktop) ===== */

.e-7c404c4c .row-main
{
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100%;
	margin: 0;
	padding: 18px 22px;
	border: none;
	background: transparent;
	text-align: left;
	cursor: pointer;
	font: inherit;
}

.e-7c404c4c .row-main > .col
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--ot-text-2);
}

.e-7c404c4c .col-date
{
	flex: 0 0 auto;
	min-width: 160px;
	font-weight: 700;
	color: var(--ot-brand);
}

.e-7c404c4c .col-route
{
	flex: 1 1 auto;
	min-width: 0;
}

.e-7c404c4c .col-route > .from
{
	color: var(--ot-text-2);
}

.e-7c404c4c .col-route > .dest
{
	font-weight: 700;
	color: var(--ot-brand);
}

.e-7c404c4c .col-temp,
.e-7c404c4c .col-duration
{
	flex: 0 0 auto;
	white-space: nowrap;
}

.e-7c404c4c .col-price
{
	flex: 0 0 auto;
	white-space: nowrap;
}

.e-7c404c4c .col-price > .price-amount
{
	font-weight: 700;
	color: var(--ot-brand);
}

.e-7c404c4c .col-discount
{
	flex: 0 0 auto;
}

.e-7c404c4c .col-discount > .pill
{
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--ot-red);
	font-weight: 700;
	font-size: 13px;
	line-height: 1;
	color: #ffffff;
}

.e-7c404c4c .col-chev
{
	flex: 0 0 auto;
	margin-left: auto;
}

/* ===== ICONS (colored) ===== */

.e-7c404c4c .ic
{
	font-size: 20px;
	line-height: 1;
}

.e-7c404c4c .ic-plane
{
	color: var(--ot-brand);
}

.e-7c404c4c .ic-sun
{
	color: var(--ot-orange);
}

.e-7c404c4c .ic-waves
{
	color: var(--ot-blue);
}

.e-7c404c4c .col-chev > .chev
{
	font-size: 24px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-7c404c4c .row.open .col-chev > .chev
{
	transform: rotate(180deg);
}

/* ===== DETAIL (smooth expand via grid-template-rows) ===== */

.e-7c404c4c .detail-wrap
{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 300ms ease;
}

.e-7c404c4c .row.open .detail-wrap
{
	grid-template-rows: 1fr;
}

.e-7c404c4c .detail
{
	overflow: hidden;
}

.e-7c404c4c .detail-text
{
	margin: 0;
	padding: 0 22px 20px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE (wrap row data on mobile) ===== */

@media (max-width: 768px)
{
	.e-7c404c4c .head-top > .title
	{
		font-size: 24px;
	}

	.e-7c404c4c .row-main
	{
		flex-wrap: wrap;
		gap: 10px 16px;
		padding: 16px 18px;
	}

	.e-7c404c4c .col-date
	{
		min-width: 0;
		flex: 1 1 100%;
	}

	.e-7c404c4c .col-route
	{
		flex: 1 1 100%;
	}

	.e-7c404c4c .row
	{
		position: relative;
	}

	.e-7c404c4c .col-chev
	{
		position: absolute;
		top: 16px;
		right: 18px;
	}
}

/* ===== END: section-lastminute-1 ===== */
/* ===== BEGIN: section-lastminute-bento-1 (tamna bento mreža destinacija) ===== */

.e-2ce02c45
{
	display: block;
	width: 100%;
}

.e-2ce02c45 > .holder
{
	width: 100%;
}

/* ===== HEADER (levo poravnat, beli naslov + svetlo sivi podnaslov) ===== */

.e-2ce02c45 > .holder > .head
{
	margin-bottom: 26px;
}

.e-2ce02c45 .title
{
	margin: 0;
	font-size: 30px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #ffffff;
}

.e-2ce02c45 .subtitle
{
	margin: 8px 0 0;
	font-size: 16px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.62);
}

/* ===== BENTO (velika kartica levo + 2×2 mreža desno, jednak razmak) ===== */

.e-2ce02c45 .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.e-2ce02c45 .grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: 1fr;
	gap: 18px;
}

/* ===== CARD (klikabilan link, full-cover slika, zaobljeni uglovi, hover) ===== */

.e-2ce02c45 .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 18px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.40);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-2ce02c45 .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-2ce02c45 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 22px 46px rgba(0, 0, 0, 0.52);
}

.e-2ce02c45 .card:hover::before
{
	transform: scale(1.07);
}

.e-2ce02c45 .card-big
{
	grid-column: 1;
	grid-row: 1;
	min-height: 400px;
}

.e-2ce02c45 .card-small
{
	min-height: 190px;
}

/* ===== OVERLAY (tamni preliv gore i dole radi čitljivosti) ===== */

.e-2ce02c45 .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0.45) 0%, rgba(6, 10, 20, 0) 32%, rgba(6, 10, 20, 0) 52%, rgba(6, 10, 20, 0.82) 100%);
}

/* ===== TOP (cena + opciona oznaka, gore desno) ===== */

.e-2ce02c45 .card > .top
{
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 6px;
	max-width: calc(100% - 24px);
}

.e-2ce02c45 .price
{
	display: inline-block;
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	background: rgba(12, 18, 32, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.e-2ce02c45 .promo,
.e-2ce02c45 .deal
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 11px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	border-radius: 999px;
	color: #ffffff;
}

.e-2ce02c45 .promo
{
	background: rgba(224, 49, 49, 0.92);
}

.e-2ce02c45 .deal
{
	background: rgba(47, 158, 68, 0.92);
}

.e-2ce02c45 .promo > i,
.e-2ce02c45 .deal > i
{
	font-size: 15px;
}

/* ===== NAME (naziv destinacije, dole levo) ===== */

.e-2ce02c45 .card > .name
{
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 14px;
	z-index: 2;
	font-weight: 800;
	line-height: 1.15;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

.e-2ce02c45 .card-big > .name
{
	font-size: 34px;
	letter-spacing: -0.01em;
}

.e-2ce02c45 .card-small > .name
{
	font-size: 18px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2ce02c45 .bento
	{
		grid-template-columns: 1fr;
	}

	.e-2ce02c45 .card-big
	{
		min-height: 300px;
	}

	.e-2ce02c45 .title { font-size: 26px; }
	.e-2ce02c45 .card-big > .name { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-2ce02c45 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-2ce02c45 .card-big
	{
		min-height: 260px;
	}

	.e-2ce02c45 .card-small
	{
		min-height: 200px;
	}

	.e-2ce02c45 .title { font-size: 23px; }
	.e-2ce02c45 .subtitle { font-size: 15px; }
	.e-2ce02c45 .card-big > .name { font-size: 26px; }
}

/* ===== END: section-lastminute-bento-1 ===== */
/* ===== BEGIN: section-lastminute-cards-1 ===== */

.e-5b242c22
{
	display: block;
	width: 100%;
}

.e-5b242c22 > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark-blue title left, blue see-all link right) ===== */

.e-5b242c22 > .holder > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 28px;
}

.e-5b242c22 .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

.e-5b242c22 .head > .more
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
	color: var(--ot-blue);
	transition: gap 220ms ease, color 220ms ease;
}

.e-5b242c22 .head > .more:hover
{
	gap: 10px;
	color: var(--ot-blue-hover);
}

.e-5b242c22 .head > .more > i
{
	font-size: 20px;
	line-height: 1;
}

/* ===== GRID (row of 4 equal cards) ===== */

.e-5b242c22 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-5b242c22 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.07);
	padding: 12px;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-5b242c22 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE (inset, rounded, with heart) ===== */

.e-5b242c22 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
}

.e-5b242c22 .card-image > .fav
{
	position: absolute;
	right: 10px;
	bottom: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	background: white;
	border-radius: 50%;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.18);
	cursor: pointer;
	transition: transform 200ms ease;
}

.e-5b242c22 .card-image > .fav:hover
{
	transform: scale(1.1);
}

.e-5b242c22 .card-image > .fav > i
{
	font-size: 20px;
	line-height: 1;
	color: var(--ot-text-2);
	font-variation-settings: 'FILL' 0;
	transition: color 200ms ease;
}

.e-5b242c22 .card-image > .fav.on > i
{
	color: var(--ot-red);
	font-variation-settings: 'FILL' 1;
}

/* ===== CARD BODY ===== */

.e-5b242c22 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 4px 4px;
}

.e-5b242c22 .location
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-5b242c22 .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.4em;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--ot-brand);
}

.e-5b242c22 .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-5b242c22 .stars > i
{
	font-size: 16px;
	font-variation-settings: 'FILL' 1;
}

/* ===== DETAILS (2 columns x 3 rows, framed by thin lines) ===== */

.e-5b242c22 .details
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 12px;
	margin-top: 4px;
	padding: 12px 0;
	border-top: 1px solid var(--ot-bg-3-border);
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-5b242c22 .detail
{
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-5b242c22 .detail > i
{
	flex-shrink: 0;
	font-size: 16px;
	color: var(--ot-blue);
}

.e-5b242c22 .detail > span
{
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== FOOTER (score box + per-person price, bottom aligned) ===== */

.e-5b242c22 .footer
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 12px;
}

.e-5b242c22 .score-box
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 6px 12px;
	background: #e8f6ec;
	border-radius: var(--ot-radius-m);
	text-align: center;
}

.e-5b242c22 .score-box > .score
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
	color: #1f7a3d;
}

.e-5b242c22 .score-box > .score-label
{
	font-size: 10px;
	color: #2f8a4d;
}

.e-5b242c22 .price-main
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 1px;
	text-align: right;
}

.e-5b242c22 .price-main > .price-per
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-5b242c22 .price-main > .price
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-brand);
}

/* ===== BUTTON (full-width yellow, dark bold text) ===== */

.e-5b242c22 .button
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: 14px;
	padding: 12px 16px;
	background: #f5c518;
	border-radius: var(--ot-radius-m);
	font-size: 14px;
	font-weight: 700;
	color: #1a1a1a;
	transition: background 220ms ease;
}

.e-5b242c22 .card:hover .button
{
	background: #e0b30f;
}

.e-5b242c22 .button > i
{
	font-size: 18px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5b242c22 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-5b242c22 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-5b242c22 > .holder > .head
	{
		margin-bottom: 22px;
	}

	.e-5b242c22 .head > .title
	{
		font-size: 26px;
	}
}

@media (max-width: 360px)
{
	.e-5b242c22 .details
	{
		grid-template-columns: 1fr;
	}
}

/* ===== END: section-lastminute-cards-1 ===== */
/* ===== BEGIN: section-lastminute-columns-1 ===== */

.e-4f7ee4a4
{
	display: block;
	width: 100%;
	--lm-navy: #141e5a;
	--lm-navy-soft: #4a5480;
	--lm-blue: #2f6feb;
	--lm-yellow: #ffd400;
	--lm-line: #e8eaf1;
	--lm-grey: #7c8398;
}

.e-4f7ee4a4 > .holder
{
	width: 100%;
}

/* ===== NASLOV (sans-serif se forsira jer sites tema gura serif na h1-h6) ===== */

.e-4f7ee4a4 > .holder > .head
{
	margin: 0 0 18px 0;
}

.e-4f7ee4a4 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.5px;
	color: var(--lm-navy);
}

.e-4f7ee4a4 > .holder > .head > .subtitle
{
	margin: 8px 0 0 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--lm-navy-soft);
}

/* ===== FILTER RED (labela + pilule) ===== */

.e-4f7ee4a4 > .holder > .filters
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 22px 0;
}

.e-4f7ee4a4 > .holder > .filters > .filter-label
{
	margin-right: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--lm-navy);
}

.e-4f7ee4a4 > .holder > .filters > .filter
{
	display: inline-flex;
	align-items: center;
	padding: 8px 18px;
	border: 1px solid var(--lm-line);
	border-radius: 999px;
	background: #ffffff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--lm-grey);
	text-decoration: none;
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}

.e-4f7ee4a4 > .holder > .filters > .filter:hover
{
	border-color: #c9cfe0;
	color: var(--lm-navy);
}

.e-4f7ee4a4 > .holder > .filters > .filter.active
{
	border-color: var(--lm-blue);
	color: var(--lm-blue);
}

/* ===== MREZA (tri jednake kolone iste visine) ===== */

.e-4f7ee4a4 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 24px;
}

.e-4f7ee4a4 > .holder > .grid > .column
{
	display: flex;
	flex-direction: column;
	padding: 20px 18px;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 2px 14px rgba(20, 30, 90, 0.07);
}

/* ===== OBOJENA KOLONA (opciono; ink klasa se racuna iz svetline boje) ===== */

.e-4f7ee4a4 .column.is-ink-light .col-title,
.e-4f7ee4a4 .column.is-ink-light .city
{
	color: #ffffff;
}

.e-4f7ee4a4 .column.is-ink-light .col-dates,
.e-4f7ee4a4 .column.is-ink-light .country,
.e-4f7ee4a4 .column.is-ink-light .price-unit,
.e-4f7ee4a4 .column.is-ink-light .pin
{
	color: rgba(255, 255, 255, 0.86);
}

.e-4f7ee4a4 .column.is-ink-light .row
{
	border-top-color: rgba(255, 255, 255, 0.28);
}

.e-4f7ee4a4 .column.is-ink-light .row:hover
{
	background: rgba(255, 255, 255, 0.12);
}

.e-4f7ee4a4 .column.is-ink-dark .col-dates,
.e-4f7ee4a4 .column.is-ink-dark .country,
.e-4f7ee4a4 .column.is-ink-dark .price-unit,
.e-4f7ee4a4 .column.is-ink-dark .pin
{
	color: rgba(20, 30, 90, 0.78);
}

.e-4f7ee4a4 .column.is-ink-dark .row
{
	border-top-color: rgba(20, 30, 90, 0.20);
}

.e-4f7ee4a4 .column.is-ink-dark .row:hover
{
	background: rgba(255, 255, 255, 0.34);
}

.e-4f7ee4a4 .column.is-ink-dark .price-pill
{
	background: #ffffff;
}

/* ===== ZAGLAVLJE KOLONE (fiksna visina drzi naslove u istoj liniji) ===== */

.e-4f7ee4a4 .col-head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 58px;
	padding: 0 0 14px 0;
	text-align: center;
}

.e-4f7ee4a4 .col-title
{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--lm-navy);
}

.e-4f7ee4a4 .col-dates
{
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--lm-grey);
}

/* ===== REDOVI (fiksna visina drzi redove poravnate izmedju kolona) ===== */

.e-4f7ee4a4 .rows
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.e-4f7ee4a4 .row
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 64px;
	padding: 0 4px;
	border-top: 1px solid var(--lm-line);
	text-decoration: none;
	transition: background .2s ease;
}

.e-4f7ee4a4 .rows > .row:first-child
{
	border-top: none;
}

.e-4f7ee4a4 .row:hover
{
	background: #f7f8fc;
}

/* ===== LEVA STRANA (pin + mesto i zemlja) ===== */

.e-4f7ee4a4 .place
{
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.e-4f7ee4a4 .pin
{
	flex: 0 0 auto;
	font-family: 'Material Symbols Rounded';
	font-size: 20px;
	font-style: normal;
	line-height: 1;
	color: var(--lm-grey);
}

.e-4f7ee4a4 .place-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-4f7ee4a4 .city
{
	overflow: hidden;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--lm-navy);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-4f7ee4a4 .country
{
	font-size: 13px;
	font-weight: 400;
	line-height: 1.25;
	color: var(--lm-navy-soft);
}

/* ===== DESNA STRANA (zuta pilula sa cenom) ===== */

.e-4f7ee4a4 .price
{
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 6px;
}

.e-4f7ee4a4 .price-pill
{
	display: inline-flex;
	align-items: center;
	padding: 7px 14px;
	border-radius: 999px;
	background: var(--lm-yellow);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	color: #1a1a1a;
	white-space: nowrap;
}

.e-4f7ee4a4 .price-unit
{
	font-size: 12px;
	font-weight: 400;
	color: var(--lm-grey);
	white-space: nowrap;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-4f7ee4a4 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-4f7ee4a4 > .holder > .head > .title
	{
		font-size: 30px;
	}
}

@media (max-width: 640px)
{
	.e-4f7ee4a4 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-4f7ee4a4 > .holder > .head > .title
	{
		font-size: 26px;
	}

	.e-4f7ee4a4 .price-pill
	{
		padding: 6px 12px;
		font-size: 13px;
	}
}

/* ===== END: section-lastminute-columns-1 ===== */
/* ===== BEGIN: section-lastminute-list-1 ===== */

.e-3794ec79
{
	display: block;
	width: 100%;
	--lm-red: #e4002b;
	--lm-red-hover: #c30025;
	--lm-orange: #f5901e;
	--lm-dark: #1f2937;
	--lm-grey: #6b7280;
	--lm-line: #e6e2da;
	--lm-pill: #f1ede5;
}

.e-3794ec79 > .holder
{
	width: 100%;
}

/* ===== NASLOV (opcioni) ===== */

.e-3794ec79 > .holder > .head
{
	margin-bottom: 24px;
	text-align: left;
}

.e-3794ec79 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--lm-dark);
}

/* ===== LISTA (kartice pune sirine, jedna ispod druge) ===== */

.e-3794ec79 > .holder > .list
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-3794ec79 > .holder > .list > .card
{
	display: flex;
	align-items: stretch;
	width: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
	overflow: hidden;
	transition: box-shadow var(--ot-transition), transform var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card:hover
{
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(16, 24, 40, 0.14);
}

/* ===== LEVA KOLONA (fotografija preko cele visine kartice) ===== */

.e-3794ec79 > .holder > .list > .card > .media
{
	position: relative;
	flex: 0 0 32%;
	min-height: 240px;
	overflow: hidden;
	background: #eceae6;
}

.e-3794ec79 > .holder > .list > .card > .media > .media-link
{
	position: absolute;
	inset: 0;
	display: block;
}

.e-3794ec79 > .holder > .list > .card > .media > .media-link > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card:hover > .media > .media-link > .media-image
{
	transform: scale(1.04);
}

.e-3794ec79 > .holder > .list > .card > .media > .badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	padding: 6px 13px;
	border-radius: 100px;
	background: var(--lm-red);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #ffffff;
}

.e-3794ec79 > .holder > .list > .card > .media > .heart
{
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.86);
	box-shadow: 0 2px 8px rgba(16, 24, 40, 0.18);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card > .media > .heart:hover
{
	background: #ffffff;
	transform: scale(1.08);
}

.e-3794ec79 > .holder > .list > .card > .media > .heart > i
{
	font-size: 19px;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .media > .heart.is-liked > i
{
	color: var(--lm-red);
}

.e-3794ec79 > .holder > .list > .card > .media > .dots
{
	position: absolute;
	right: 0;
	bottom: 12px;
	left: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
}

.e-3794ec79 > .holder > .list > .card > .media > .dots > .dot
{
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.55);
	cursor: pointer;
	transition: width var(--ot-transition), background var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card > .media > .dots > .dot.is-on
{
	width: 20px;
	background: #ffffff;
}

/* ===== DESNA KOLONA (info + cena) ===== */

.e-3794ec79 > .holder > .list > .card > .content
{
	display: flex;
	flex: 1;
	gap: 22px;
	min-width: 0;
	padding: 20px 22px;
}

.e-3794ec79 > .holder > .list > .card > .content > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-bottom: 6px;
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .stars > .star
{
	font-size: 15px;
	line-height: 1;
	color: var(--lm-orange);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .name
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--lm-dark);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .name:hover
{
	color: var(--lm-red);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .location
{
	margin-top: 4px;
	font-size: 14px;
	color: var(--lm-grey);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 14px;
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .features > .feature
{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .features > .feature > i
{
	font-size: 17px;
	color: var(--lm-red);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .when
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: auto;
	padding-top: 18px;
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .when > .when-date
{
	font-size: 15px;
	font-weight: 800;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .content > .info > .when > .when-board
{
	font-size: 13px;
	color: var(--lm-grey);
}

/* ===== CENA (dugme prikaceno za dno kolone) ===== */

.e-3794ec79 > .holder > .list > .card > .content > .price
{
	display: flex;
	flex: 0 0 214px;
	flex-direction: column;
	align-items: flex-end;
	padding-left: 20px;
	border-left: 1px solid var(--lm-line);
	text-align: right;
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .review
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .review > .review-label
{
	font-size: 13px;
	font-weight: 700;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .review > .review-score
{
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 8px;
	background: var(--lm-pill);
	font-size: 13px;
	font-weight: 800;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .discount
{
	display: inline-flex;
	align-items: center;
	margin-bottom: 6px;
	padding: 3px 10px;
	border-radius: 100px;
	background: var(--lm-red);
	font-size: 12px;
	font-weight: 800;
	color: #ffffff;
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .price-old
{
	font-size: 14px;
	color: var(--lm-grey);
	text-decoration: line-through;
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .price-new
{
	display: flex;
	align-items: center;
	gap: 5px;
	margin-top: 2px;
	font-size: 26px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--lm-dark);
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .price-new > i
{
	font-size: 16px;
	color: var(--lm-grey);
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .price-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: auto;
	padding: 0 30px;
	border-radius: 100px;
	background: var(--lm-red);
	font-size: 15px;
	font-weight: 800;
	color: #ffffff;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-3794ec79 > .holder > .list > .card > .content > .price > .price-button:hover
{
	background: var(--lm-red-hover);
}

/* ===== TABLET ===== */

@media (max-width: 1024px)
{
	.e-3794ec79 > .holder > .head > .title
	{
		font-size: 28px;
	}

	.e-3794ec79 > .holder > .list > .card > .media
	{
		flex: 0 0 26%;
	}

	.e-3794ec79 > .holder > .list > .card > .content
	{
		flex-direction: column;
		gap: 16px;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price
	{
		flex: 0 0 auto;
		flex-direction: row;
		align-items: center;
		justify-content: flex-end;
		gap: 12px;
		padding-top: 14px;
		padding-left: 0;
		border-top: 1px solid var(--lm-line);
		border-left: 0;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .review
	{
		margin-right: auto;
		margin-bottom: 0;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .discount
	{
		margin-bottom: 0;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .price-button
	{
		margin-top: 0;
	}
}

/* ===== MOBILNI ===== */

@media (max-width: 640px)
{
	.e-3794ec79 > .holder > .list > .card
	{
		flex-direction: column;
	}

	.e-3794ec79 > .holder > .list > .card > .media
	{
		flex: 0 0 auto;
		height: 210px;
		min-height: 0;
	}

	.e-3794ec79 > .holder > .list > .card > .content
	{
		padding: 18px;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .info > .name
	{
		font-size: 19px;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price
	{
		flex-direction: column;
		align-items: stretch;
		gap: 6px;
		text-align: left;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .review
	{
		margin-right: 0;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .discount
	{
		align-self: flex-start;
	}

	.e-3794ec79 > .holder > .list > .card > .content > .price > .price-button
	{
		margin-top: 10px;
		width: 100%;
	}
}

/* ===== END: section-lastminute-list-1 ===== */
/* ===== BEGIN: section-menu-hero-1 ===== */

.e-36663572
{
	display: block;
	width: 100%;
}

.e-36663572 > .holder
{
	width: 100%;
}

/* ===== MENU (bela traka na vrhu, preko cele sirine) ===== */

.e-36663572 .menu
{
	display: flex;
	align-items: center;
	gap: 28px;
	width: 100%;
	padding: 14px 40px;
	background: #ffffff;
	box-shadow: 0 1px 0 var(--ot-bg-3-border);
}

.e-36663572 .menu-logo
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	color: var(--ot-red);
	font-weight: 900;
	font-size: 26px;
	letter-spacing: -0.01em;
	text-decoration: none;
}

.e-36663572 .menu-logo > img
{
	display: block;
	height: 34px;
	width: auto;
}

.e-36663572 .menu-nav
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex: 1 1 auto;
	min-width: 0;
}

.e-36663572 .menu-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-36663572 .menu-link:hover
{
	color: var(--ot-red);
}

.e-36663572 .menu-link > i
{
	font-size: 20px;
}

.e-36663572 .menu-icons
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex: 0 0 auto;
}

.e-36663572 .menu-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	background: none;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-36663572 .menu-icon:hover
{
	color: var(--ot-red);
}

.e-36663572 .menu-icon > i
{
	font-size: 24px;
}

.e-36663572 .menu-account
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-36663572 .menu-account:hover
{
	color: var(--ot-red);
}

.e-36663572 .menu-account > i
{
	font-size: 24px;
}

.e-36663572 .menu-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	background: none;
	color: var(--ot-text-1);
	cursor: pointer;
}

.e-36663572 .menu-burger > i
{
	font-size: 28px;
}

/* ===== HERO (full-width, edge to edge, visok) ===== */

.e-36663572 .hero
{
	position: relative;
	width: 100%;
	min-height: 620px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
}

/* Vrlo blag preliv radi citljivosti teksta (bez jakog zatamnjenja). */

.e-36663572 .hero > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.10) 34%, rgba(0, 0, 0, 0.08) 62%, rgba(0, 0, 0, 0.28) 100%);
}

.e-36663572 .hero-content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 26px;
	width: min(94%, 1080px);
	margin: 0 auto;
	padding: 96px 0 72px;
}

.e-36663572 .hero-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 800;
	line-height: 1.08;
	font-size: 54px;
	text-shadow: 0 3px 20px rgba(0, 0, 0, 0.45);
}

/* ===== TAB-PREKIDAC (jedna pill grupa, tamni klizac) ===== */

.e-36663572 .tab-switch
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 100px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
	backdrop-filter: blur(6px);
}

.e-36663572 .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 22px;
	border: none;
	border-radius: 100px;
	background: transparent;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-36663572 .tab > i
{
	font-size: 20px;
}

.e-36663572 .tab:hover
{
	color: #0d1526;
}

.e-36663572 .tab.active
{
	background: #0d1526;
	color: #ffffff;
}

.e-36663572 .tab.active:hover
{
	color: #ffffff;
}

/* ===== SEARCH FORMA (bela kapsula, cetiri polja + crveno dugme) ===== */

.e-36663572 .search
{
	display: flex;
	align-items: stretch;
	gap: 0;
	width: min(100%, 980px);
	padding: 8px 8px 8px 12px;
	background: #ffffff;
	border-radius: 100px;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
}

.e-36663572 .field
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
	flex: 1 1 0;
	min-width: 0;
	padding: 10px 22px;
	text-align: left;
}

.e-36663572 .field-title
{
	font-weight: 700;
	font-size: 13px;
	color: var(--ot-text-1);
}

.e-36663572 .field-placeholder
{
	font-size: 14px;
	color: var(--ot-text-3);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-36663572 .divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	margin: 10px 0;
	background: var(--ot-bg-3-border);
}

.e-36663572 .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex: 0 0 auto;
	padding: 16px 30px;
	border: none;
	border-radius: 100px;
	background: var(--ot-red);
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-36663572 .search-button:hover
{
	background: var(--ot-red-hover);
	transform: translateY(-1px);
}

.e-36663572 .search-button > i
{
	font-size: 20px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-36663572 .menu
	{
		gap: 16px;
		padding: 12px 20px;
	}

	.e-36663572 .menu-nav
	{
		display: none;
	}

	.e-36663572 .menu-burger
	{
		display: inline-flex;
		order: 3;
		margin-left: auto;
	}

	.e-36663572 .menu-icons
	{
		order: 2;
		margin-left: auto;
		gap: 14px;
	}

	.e-36663572 .menu-account > span
	{
		display: none;
	}

	.e-36663572 .hero
	{
		min-height: 540px;
	}

	.e-36663572 .hero-content
	{
		padding: 72px 0 56px;
	}

	.e-36663572 .hero-title
	{
		font-size: 42px;
	}
}

@media (max-width: 640px)
{
	.e-36663572 .hero
	{
		min-height: 0;
	}

	.e-36663572 .hero-content
	{
		width: calc(100% - 32px);
		padding: 48px 0 40px;
		gap: 20px;
	}

	.e-36663572 .hero-title
	{
		font-size: 32px;
	}

	.e-36663572 .tab-switch
	{
		max-width: 100%;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.e-36663572 .tab-switch::-webkit-scrollbar
	{
		display: none;
	}

	.e-36663572 .tab
	{
		flex: 0 0 auto;
		padding: 10px 16px;
		font-size: 14px;
	}

	.e-36663572 .search
	{
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		width: 100%;
		padding: 14px;
		border-radius: 22px;
	}

	.e-36663572 .field
	{
		width: 100%;
		padding: 10px 8px;
	}

	.e-36663572 .divider
	{
		width: auto;
		height: 1px;
		align-self: auto;
		margin: 0 8px;
	}

	.e-36663572 .search-button
	{
		width: 100%;
		margin-top: 8px;
		padding: 14px 24px;
	}
}

/* ===== END: section-menu-hero-1 ===== */
/* ===== BEGIN: section-menu-hero-2 ===== */

.e-36663571
{
	display: block;
	width: 100%;
	--coral: #ff5a4d;
	--coral-hover: #f0463a;
}

.e-36663571 > .holder
{
	width: 100%;
}

/* ===== MENU (bela traka na vrhu, preko cele sirine) ===== */

.e-36663571 .menu
{
	display: flex;
	align-items: center;
	gap: 28px;
	width: 100%;
	padding: 14px 40px;
	background: #ffffff;
	box-shadow: 0 1px 0 var(--ot-bg-3-border);
}

.e-36663571 .menu-logo
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	color: var(--coral);
	font-weight: 900;
	font-size: 26px;
	letter-spacing: -0.01em;
	text-decoration: none;
}

.e-36663571 .menu-logo > img
{
	display: block;
	height: 34px;
	width: auto;
}

.e-36663571 .menu-nav
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex: 1 1 auto;
	min-width: 0;
}

.e-36663571 .menu-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--coral);
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-36663571 .menu-link:hover
{
	color: var(--coral-hover);
}

.e-36663571 .menu-link > i
{
	font-size: 20px;
}

.e-36663571 .menu-actions
{
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 0 0 auto;
}

.e-36663571 .menu-search
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 0;
	border: none;
	background: none;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-36663571 .menu-search:hover
{
	color: var(--coral);
}

.e-36663571 .menu-search > i
{
	font-size: 22px;
}

.e-36663571 .menu-phone
{
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 5px 16px 5px 5px;
	border: 1px solid var(--coral);
	border-radius: 100px;
	background: transparent;
	color: var(--coral);
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-36663571 .menu-phone:hover
{
	background: rgba(255, 90, 77, 0.08);
}

.e-36663571 .menu-phone-ico
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--coral);
	color: #ffffff;
	flex-shrink: 0;
}

.e-36663571 .menu-phone-ico > i
{
	font-size: 17px;
}

.e-36663571 .menu-request
{
	display: inline-flex;
	align-items: center;
	padding: 11px 22px;
	border-radius: 100px;
	background: var(--coral);
	color: #ffffff;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-36663571 .menu-request:hover
{
	background: var(--coral-hover);
	transform: translateY(-1px);
}

.e-36663571 .menu-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	background: none;
	color: var(--coral);
	cursor: pointer;
}

.e-36663571 .menu-burger > i
{
	font-size: 28px;
}

/* ===== HERO (uvucen od ivica, blago zaobljen, video pozadina) ===== */

.e-36663571 .hero
{
	width: 100%;
	padding: 20px 24px 28px;
}

.e-36663571 .hero-frame
{
	position: relative;
	width: 100%;
	min-height: 620px;
	border-radius: 24px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25);
}

.e-36663571 .hero-video
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: 0;
}

/* Vrlo blag preliv radi citljivosti teksta (bez jakog zatamnjenja). */

.e-36663571 .hero-frame > .scrim
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.10) 42%, rgba(0, 0, 0, 0.30) 100%);
}

.e-36663571 .hero-content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 22px;
	width: min(92%, 960px);
	min-height: 620px;
	margin: 0 auto;
	padding: 48px 0;
}

.e-36663571 .hero-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 300;
	line-height: 1.1;
	font-size: 62px;
	text-shadow: 0 3px 22px rgba(0, 0, 0, 0.4);
}

.e-36663571 .hero-subtitle
{
	margin: 0;
	color: #ffffff;
	font-weight: 400;
	font-size: 19px;
	line-height: 1.4;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
}

.e-36663571 .hero-cta
{
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 6px;
}

.e-36663571 .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 30px;
	border-radius: 100px;
	background: var(--coral);
	color: #ffffff;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-36663571 .cta:hover
{
	background: var(--coral-hover);
	transform: translateY(-2px);
}

/* ===== KONTROLA ZVUKA (diskretna, donji desni ugao) ===== */

.e-36663571 .hero-sound
{
	position: absolute;
	z-index: 3;
	right: 20px;
	bottom: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	background: rgba(15, 23, 42, 0.35);
	color: #ffffff;
	cursor: pointer;
	backdrop-filter: blur(4px);
	transition: background var(--ot-transition);
}

.e-36663571 .hero-sound:hover
{
	background: rgba(15, 23, 42, 0.55);
}

.e-36663571 .hero-sound > i
{
	font-size: 22px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-36663571 .menu
	{
		gap: 16px;
		padding: 12px 20px;
	}

	.e-36663571 .menu-nav
	{
		display: none;
	}

	.e-36663571 .menu-burger
	{
		display: inline-flex;
		order: 3;
		margin-left: auto;
	}

	.e-36663571 .menu-actions
	{
		order: 2;
		margin-left: auto;
		gap: 12px;
	}

	.e-36663571 .menu-search,
	.e-36663571 .menu-request
	{
		display: none;
	}

	.e-36663571 .hero-frame
	{
		min-height: 540px;
	}

	.e-36663571 .hero-content
	{
		min-height: 540px;
	}

	.e-36663571 .hero-title
	{
		font-size: 48px;
	}
}

@media (max-width: 640px)
{
	.e-36663571 .hero
	{
		padding: 14px 12px 20px;
	}

	.e-36663571 .hero-frame
	{
		min-height: 440px;
		border-radius: 18px;
	}

	.e-36663571 .hero-content
	{
		width: calc(100% - 32px);
		min-height: 440px;
		gap: 18px;
	}

	.e-36663571 .hero-title
	{
		font-size: 34px;
	}

	.e-36663571 .hero-subtitle
	{
		font-size: 16px;
	}

	.e-36663571 .hero-cta
	{
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		gap: 12px;
	}

	.e-36663571 .cta
	{
		width: 100%;
	}
}

/* ===== END: section-menu-hero-2 ===== */
/* ===== BEGIN: section-more-destinations-1 ===== */

.e-41ba5943
{
	display: block;
	width: 100%;
	--md-dark: #24303a;
	--md-line: #ececec;
	--md-beige: #e7dcc8;
}

/* Pozadina sekcije (krem) dolazi iz section style.background full-bleed omotaca, ne odavde. */

.e-41ba5943 > .holder
{
	width: 100%;
}

/* ===== HEADER (levo poravnat krupan tamni sans-serif naslov) ===== */

.e-41ba5943 > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Sites app globalno postavlja serif na sve h1-h6, pa se sans-serif mora eksplicitno vratiti. */

.e-41ba5943 .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--md-dark);
}

/* ===== AKORDEON (jedan beli kontejner sa redovima i tankim separatorima) ===== */

.e-41ba5943 .panel-list
{
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(36, 48, 58, 0.08);
	overflow: hidden;
}

/* Separator ide na sve redove osim poslednjeg da linija ne visi na dnu kontejnera. */

.e-41ba5943 .row:not(:last-child)
{
	border-bottom: 1px solid var(--md-line);
}

.e-41ba5943 .row-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	min-height: 64px;
	margin: 0;
	padding: 20px 24px;
	border: none;
	background: transparent;
	text-align: left;
	cursor: pointer;
	font: inherit;
	transition: background var(--ot-transition);
}

.e-41ba5943 .row-head:hover
{
	background: #fafafa;
}

.e-41ba5943 .row-head > .row-title
{
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--md-dark);
}

.e-41ba5943 .row-head > .chev
{
	flex: none;
	font-size: 24px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-41ba5943 .row.open .row-head > .chev
{
	transform: rotate(180deg);
}

/* ===== PANEL (glatko otvaranje kroz grid-template-rows 0fr -> 1fr) ===== */

.e-41ba5943 .row-wrap
{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 300ms ease;
}

.e-41ba5943 .row.open .row-wrap
{
	grid-template-rows: 1fr;
}

.e-41ba5943 .row-body
{
	overflow: hidden;
}

/* Min-height cini da se i prazan placeholder panel vidno otvori. */

.e-41ba5943 .row-text
{
	min-height: 24px;
	padding: 0 24px 20px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* ===== VELIKO DUGME (puna sirina, bez pozadina, centriran serifni tekst, sevron desno) ===== */

.e-41ba5943 .cta
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 76px;
	margin-top: 14px;
	padding: 20px 56px;
	border-radius: 10px;
	background: var(--md-beige);
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-41ba5943 .cta:hover
{
	background: #ddd0b7;
}

.e-41ba5943 .cta > .cta-text
{
	font-family: var(--ot-font-secondary);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: var(--md-dark);
}

.e-41ba5943 .cta > .cta-chev
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	font-size: 28px;
	line-height: 1;
	color: var(--md-dark);
	transition: right var(--ot-transition);
}

.e-41ba5943 .cta:hover > .cta-chev
{
	right: 17px;
}

/* ===== RESPONSIVE (sve ostaje pune sirine, tekst se prelama, sevron ostaje desno) ===== */

@media (max-width: 1024px)
{
	.e-41ba5943 .title
	{
		font-size: 30px;
	}

	.e-41ba5943 .cta > .cta-text
	{
		font-size: 22px;
	}
}

@media (max-width: 768px)
{
	.e-41ba5943 .row-head
	{
		padding: 18px;
	}

	.e-41ba5943 .row-head > .row-title
	{
		font-size: 16px;
	}

	.e-41ba5943 .row-text
	{
		padding: 0 18px 18px;
	}

	.e-41ba5943 .cta
	{
		padding: 18px 48px;
	}

	.e-41ba5943 .cta > .cta-text
	{
		font-size: 19px;
	}
}

@media (max-width: 560px)
{
	.e-41ba5943 .cta
	{
		min-height: 64px;
		padding: 16px 44px;
	}

	.e-41ba5943 .cta > .cta-text
	{
		font-size: 17px;
	}
}

/* ===== END: section-more-destinations-1 ===== */
/* ===== BEGIN: section-mozaik-1 ===== */

.e-23f7aa0d
{
	display: block;
	width: 100%;
}

.e-23f7aa0d > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-23f7aa0d > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-23f7aa0d .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-23f7aa0d .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-23f7aa0d .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-23f7aa0d .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== MASONRY GRID (3 columns, dense tiling) ===== */

.e-23f7aa0d .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 150px;
	grid-auto-flow: dense;
	gap: 14px;
}

/* Footprints: standard 1x2, tall 1x3, wide 2x2 rows */

.e-23f7aa0d .card
{
	grid-column: span 1;
	grid-row: span 2;
}

.e-23f7aa0d .card.tall
{
	grid-row: span 3;
}

.e-23f7aa0d .card.wide
{
	grid-column: span 2;
	grid-row: span 2;
}

/* ===== CARD (full-cover image, clickable) ===== */

.e-23f7aa0d .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-23f7aa0d .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-23f7aa0d .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-23f7aa0d .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-23f7aa0d .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-23f7aa0d .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + duration) ===== */

.e-23f7aa0d .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 20px 22px 0;
	color: white;
}

.e-23f7aa0d .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-23f7aa0d .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-23f7aa0d .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-23f7aa0d .card-price
{
	font-size: 28px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-23f7aa0d .card-duration
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (country + serif title + link) ===== */

.e-23f7aa0d .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 0 22px 22px;
	color: white;
}

.e-23f7aa0d .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-23f7aa0d .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: white;
}

.e-23f7aa0d .card.wide .card-title
{
	font-size: 30px;
}

.e-23f7aa0d .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-23f7aa0d .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-23f7aa0d .head > .title { font-size: 32px; }
	.e-23f7aa0d .grid { grid-template-columns: repeat(2, 1fr); }
	.e-23f7aa0d .card.wide { grid-column: span 2; }
	.e-23f7aa0d .card-price { font-size: 25px; }
	.e-23f7aa0d .card-title { font-size: 23px; }
	.e-23f7aa0d .card.wide .card-title { font-size: 26px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-23f7aa0d > .holder > .head { margin-bottom: 24px; }
	.e-23f7aa0d .head > .title { font-size: 27px; }
	.e-23f7aa0d .head > .subtitle { font-size: 16px; }

	.e-23f7aa0d .grid
	{
		grid-template-columns: 1fr;
		grid-auto-rows: auto;
		gap: 16px;
	}

	.e-23f7aa0d .card,
	.e-23f7aa0d .card.tall,
	.e-23f7aa0d .card.wide
	{
		grid-column: span 1;
		grid-row: auto;
		aspect-ratio: 3 / 2.2;
	}
}

/* ===== END: section-mozaik-1 ===== */
/* ===== BEGIN: section-mozaik-2 ===== */

.e-23f7aa0e
{
	display: block;
	width: 100%;
}

.e-23f7aa0e > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark title + short thick yellow underline) ===== */

.e-23f7aa0e > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 28px;
}

.e-23f7aa0e .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-23f7aa0e .head > .rule
{
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 12px;
	border-radius: 2px;
	background: #f5c518;
}

/* ===== GRID (4-column bento puzzle, fixed height) ===== */

.e-23f7aa0e .grid
{
	display: grid;
	grid-template-columns: 1.25fr 1fr 1fr 0.82fr;
	grid-template-rows: repeat(10, 1fr);
	gap: 16px;
	height: 560px;
}

/* Slot placement — column 1 big, columns 2-4 alternating tall/short splits */

.e-23f7aa0e .card.slot-1 { grid-column: 1; grid-row: 1 / -1; }
.e-23f7aa0e .card.slot-2 { grid-column: 2; grid-row: 1 / 7; }
.e-23f7aa0e .card.slot-3 { grid-column: 2; grid-row: 7 / 11; }
.e-23f7aa0e .card.slot-4 { grid-column: 3; grid-row: 1 / 5; }
.e-23f7aa0e .card.slot-5 { grid-column: 3; grid-row: 5 / 11; }
.e-23f7aa0e .card.slot-6 { grid-column: 4; grid-row: 1 / 5; }
.e-23f7aa0e .card.slot-7 { grid-column: 4; grid-row: 5 / 11; }

/* ===== CARD (full-cover image, clickable) ===== */

.e-23f7aa0e .card
{
	position: relative;
	display: block;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-23f7aa0e .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(20, 18, 16, 0.24);
}

.e-23f7aa0e .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-23f7aa0e .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== STRIP (translucent blue bar across the bottom) ===== */

.e-23f7aa0e .card > .card-strip
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 12px 16px;
	background: rgba(3, 122, 213, 0.66);
	transition: background 260ms ease;
}

.e-23f7aa0e .card:hover > .card-strip
{
	background: rgba(3, 122, 213, 0.78);
}

.e-23f7aa0e .card-name
{
	font-weight: 800;
	font-size: 16px;
	line-height: 1.2;
	color: white;
}

/* Opcioni opis na traci — bez description-a ga uopste nema u DOM-u. */

.e-23f7aa0e .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-weight: 500;
	font-size: 13px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.88);
}

.e-23f7aa0e .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	font-weight: 800;
	font-size: 15px;
	color: #f5c518;
}

.e-23f7aa0e .card-from
{
	font-weight: 700;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.9);
}

/* Big card — taller strip, larger text */

.e-23f7aa0e .card.slot-1 > .card-strip
{
	padding: 18px 22px;
	gap: 5px;
}

.e-23f7aa0e .card.slot-1 .card-name
{
	font-size: 24px;
}

.e-23f7aa0e .card.slot-1 .card-desc
{
	-webkit-line-clamp: 3;
	font-size: 14px;
}

.e-23f7aa0e .card.slot-1 .card-price
{
	font-size: 19px;
}

.e-23f7aa0e .card.slot-1 .card-from
{
	font-size: 14px;
}

/* ===== RESPONSIVE — 2 equal columns on tablet, uniform heights ===== */

@media (max-width: 1024px)
{
	.e-23f7aa0e .head > .title { font-size: 26px; }

	.e-23f7aa0e .grid
	{
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		height: auto;
	}

	.e-23f7aa0e .card.slot-1,
	.e-23f7aa0e .card.slot-2,
	.e-23f7aa0e .card.slot-3,
	.e-23f7aa0e .card.slot-4,
	.e-23f7aa0e .card.slot-5,
	.e-23f7aa0e .card.slot-6,
	.e-23f7aa0e .card.slot-7
	{
		grid-column: auto;
		grid-row: auto;
		aspect-ratio: 3 / 2;
	}

	.e-23f7aa0e .card.slot-1 .card-name { font-size: 16px; }
	.e-23f7aa0e .card.slot-1 .card-desc { font-size: 13px; -webkit-line-clamp: 2; }
	.e-23f7aa0e .card.slot-1 .card-price { font-size: 15px; }
	.e-23f7aa0e .card.slot-1 .card-from { font-size: 12px; }
	.e-23f7aa0e .card.slot-1 > .card-strip { padding: 12px 16px; gap: 3px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-23f7aa0e > .holder > .head { margin-bottom: 22px; }
	.e-23f7aa0e .head > .title { font-size: 23px; }

	.e-23f7aa0e .grid
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

/* ===== END: section-mozaik-2 ===== */
/* ===== BEGIN: section-mozaik-3 ===== */

.e-23f7aa0f
{
	display: block;
	width: 100%;
}

.e-23f7aa0f > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark title + short thick yellow underline) ===== */

.e-23f7aa0f > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 28px;
}

.e-23f7aa0f .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 30px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-23f7aa0f .head > .rule
{
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 12px;
	border-radius: 2px;
	background: #f5c518;
}

/* ===== GRID (uniform 4 columns, square cards, two rows) ===== */

.e-23f7aa0f .grid
{
	display: grid;
	grid-template-columns: var(--m3-cols, repeat(4, 1fr));
	gap: 16px;
}

/* ===== CARD (full-cover image, clickable, square) ===== */

.e-23f7aa0f .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-23f7aa0f .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(20, 18, 16, 0.24);
}

.e-23f7aa0f .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-23f7aa0f .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== STRIP (translucent blue bar across the bottom) ===== */

.e-23f7aa0f .card > .card-strip
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 12px 16px;
	background: rgba(3, 122, 213, 0.66);
	transition: background 260ms ease;
}

.e-23f7aa0f .card:hover > .card-strip
{
	background: rgba(3, 122, 213, 0.78);
}

.e-23f7aa0f .card-name
{
	font-weight: 800;
	font-size: 16px;
	line-height: 1.2;
	color: white;
}

.e-23f7aa0f .card-price
{
	display: flex;
	align-items: baseline;
	gap: 5px;
	font-weight: 800;
	font-size: 15px;
	color: #f5c518;
}

.e-23f7aa0f .card-from
{
	font-weight: 700;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== RESPONSIVE — 2 equal square columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-23f7aa0f .head > .title { font-size: 26px; }

	.e-23f7aa0f .grid
	{
		grid-template-columns: 1fr 1fr;
	}
}

/* ===== RESPONSIVE — 1 full-width square column on mobile ===== */

@media (max-width: 640px)
{
	.e-23f7aa0f > .holder > .head { margin-bottom: 22px; }
	.e-23f7aa0f .head > .title { font-size: 23px; }

	.e-23f7aa0f .grid
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

/* ===== END: section-mozaik-3 ===== */
/* ===== BEGIN: section-mozaik-4 ===== */

.e-23f7aa10
{
	display: block;
	width: 100%;
}

.e-23f7aa10 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-23f7aa10 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-23f7aa10 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-23f7aa10 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-23f7aa10 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-23f7aa10 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== MASONRY GRID (3 columns, dense tiling) ===== */

.e-23f7aa10 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 150px;
	grid-auto-flow: dense;
	gap: 14px;
}

/* Footprints: standard 1x2, tall 1x3, wide 2x2 rows */

.e-23f7aa10 .card
{
	grid-column: span 1;
	grid-row: span 2;
}

.e-23f7aa10 .card.tall
{
	grid-row: span 3;
}

.e-23f7aa10 .card.wide
{
	grid-column: span 2;
	grid-row: span 2;
}

/* ===== CARD (full-cover image, clickable) ===== */

.e-23f7aa10 .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	border-radius: var(--ot-radius-l) 50% var(--ot-radius-l) var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-23f7aa10 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-23f7aa10 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-23f7aa10 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* Dark top + bottom, lighter middle — text readable at both edges */

.e-23f7aa10 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-23f7aa10 .card:hover > .card-shade
{
	opacity: 0.86;
}

/* ===== CARD TOP (promo pill + price + duration) ===== */

.e-23f7aa10 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 20px 22px 0;
	color: white;
}

.e-23f7aa10 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
}

.e-23f7aa10 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-23f7aa10 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
}

.e-23f7aa10 .card-price
{
	font-size: 28px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.e-23f7aa10 .card-duration
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
}

/* ===== CARD BOTTOM (country + serif title + link) ===== */

.e-23f7aa10 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 0 22px 22px;
	color: white;
}

.e-23f7aa10 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
}

.e-23f7aa10 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: white;
}

.e-23f7aa10 .card.wide .card-title
{
	font-size: 30px;
}

.e-23f7aa10 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: border-color 240ms ease;
}

.e-23f7aa10 .card:hover .card-link
{
	border-bottom-color: white;
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-23f7aa10 .head > .title { font-size: 32px; }
	.e-23f7aa10 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-23f7aa10 .card.wide { grid-column: span 2; }
	.e-23f7aa10 .card-price { font-size: 25px; }
	.e-23f7aa10 .card-title { font-size: 23px; }
	.e-23f7aa10 .card.wide .card-title { font-size: 26px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-23f7aa10 > .holder > .head { margin-bottom: 24px; }
	.e-23f7aa10 .head > .title { font-size: 27px; }
	.e-23f7aa10 .head > .subtitle { font-size: 16px; }

	.e-23f7aa10 .grid
	{
		grid-template-columns: 1fr;
		grid-auto-rows: auto;
		gap: 16px;
	}

	.e-23f7aa10 .card,
	.e-23f7aa10 .card.tall,
	.e-23f7aa10 .card.wide
	{
		grid-column: span 1;
		grid-row: auto;
		aspect-ratio: 3 / 2.2;
	}
}

/* ===== END: section-mozaik-4 ===== */
/* ===== BEGIN: section-mozaik-5 ===== */

.e-23f7aa11
{
	display: block;
	width: 100%;
}

.e-23f7aa11 > .holder
{
	width: 100%;
}

/* ===== HEADER (eyebrow + serif title + subtitle) ===== */

.e-23f7aa11 > .holder > .head
{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: 34px;
}

.e-23f7aa11 .head > .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--ot-text-3);
}

.e-23f7aa11 .eyebrow > .eyebrow-mark
{
	display: inline-block;
	width: 26px;
	height: 2px;
	background: var(--ot-brand);
}

.e-23f7aa11 .head > .title
{
	margin: 0;
	font-size: 40px;
	line-height: 1.05;
}

.e-23f7aa11 .head > .subtitle
{
	margin: 12px 0 0;
	max-width: 620px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== MASONRY GRID (3 columns, dense tiling) ===== */

.e-23f7aa11 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 150px;
	grid-auto-flow: dense;
	gap: 14px;
}

/* Footprints: standard 1x2, tall 1x3, wide 2x2 rows */

.e-23f7aa11 .card
{
	grid-column: span 1;
	grid-row: span 2;
}

.e-23f7aa11 .card.tall
{
	grid-row: span 3;
}

.e-23f7aa11 .card.wide
{
	grid-column: span 2;
	grid-row: span 2;
}

/* ===== CARD (full-cover image at rest, solid yellow face on hover) ===== */

.e-23f7aa11 .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	text-decoration: none;
	background: #f5c518;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.20);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-23f7aa11 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-23f7aa11 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: opacity 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-23f7aa11 .card:hover > .card-image
{
	opacity: 0;
}

/* Dark top + bottom, lighter middle — text readable at both edges; hidden on hover so the yellow face is clean */

.e-23f7aa11 .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(12, 12, 14, 0.78) 0%, rgba(12, 12, 14, 0.28) 26%, rgba(12, 12, 14, 0.10) 50%, rgba(12, 12, 14, 0.38) 72%, rgba(12, 12, 14, 0.86) 100%);
	transition: opacity 320ms ease;
}

.e-23f7aa11 .card:hover > .card-shade
{
	opacity: 0;
}

/* ===== CARD TOP (promo pill + price + duration) ===== */

.e-23f7aa11 .card > .card-top
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 20px 22px 0;
	color: white;
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover > .card-top
{
	color: #1c1a12;
}

.e-23f7aa11 .card-promo
{
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f5c518;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #1c1a12;
	transition: background 320ms ease, color 320ms ease;
}

.e-23f7aa11 .card:hover .card-promo
{
	background: #1c1a12;
	color: #f5c518;
}

.e-23f7aa11 .card-price-block
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.e-23f7aa11 .card-from
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: rgba(255, 255, 255, 0.82);
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover .card-from
{
	color: rgba(28, 26, 18, 0.82);
}

.e-23f7aa11 .card-price
{
	font-size: 28px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover .card-price
{
	color: #1c1a12;
}

.e-23f7aa11 .card-duration
{
	margin-top: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.9);
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover .card-duration
{
	color: rgba(28, 26, 18, 0.9);
}

/* ===== CARD BOTTOM (country + serif title + link) ===== */

.e-23f7aa11 .card > .card-bottom
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 0 22px 22px;
	color: white;
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover > .card-bottom
{
	color: #1c1a12;
}

.e-23f7aa11 .card-country
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.92);
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover .card-country
{
	color: rgba(28, 26, 18, 0.85);
}

.e-23f7aa11 .card-title
{
	font-family: var(--ot-font-secondary);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: white;
	transition: color 320ms ease;
}

.e-23f7aa11 .card:hover .card-title
{
	color: #1c1a12;
}

.e-23f7aa11 .card.wide .card-title
{
	font-size: 30px;
}

.e-23f7aa11 .card-link
{
	margin-top: 4px;
	padding-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: white;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	transition: color 320ms ease, border-color 240ms ease;
}

.e-23f7aa11 .card:hover .card-link
{
	color: #1c1a12;
	border-bottom-color: rgba(28, 26, 18, 0.45);
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-23f7aa11 .head > .title { font-size: 32px; }
	.e-23f7aa11 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-23f7aa11 .card.wide { grid-column: span 2; }
	.e-23f7aa11 .card-price { font-size: 25px; }
	.e-23f7aa11 .card-title { font-size: 23px; }
	.e-23f7aa11 .card.wide .card-title { font-size: 26px; }
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-23f7aa11 > .holder > .head { margin-bottom: 24px; }
	.e-23f7aa11 .head > .title { font-size: 27px; }
	.e-23f7aa11 .head > .subtitle { font-size: 16px; }

	.e-23f7aa11 .grid
	{
		grid-template-columns: 1fr;
		grid-auto-rows: auto;
		gap: 16px;
	}

	.e-23f7aa11 .card,
	.e-23f7aa11 .card.tall,
	.e-23f7aa11 .card.wide
	{
		grid-column: span 1;
		grid-row: auto;
		aspect-ratio: 3 / 2.2;
	}
}

/* ===== END: section-mozaik-5 ===== */
/* ===== BEGIN: section-newsletter-1 ===== */

.e-153a06e5
{
	display: block;
	width: 100%;
}

/* ===== HOLDER (tinted rounded block) ===== */

.e-153a06e5 > .holder
{
	width: 100%;
	padding: 48px;
	background: linear-gradient(135deg, #eef1fc 0%, #f2eefb 100%);
	border-radius: var(--ot-radius-l);
}

/* ===== GRID (two equal columns) ===== */

.e-153a06e5 .grid
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: center;
}

/* ===== LEFT COLUMN (form) ===== */

.e-153a06e5 .col-form > .title
{
	margin: 0 0 24px;
	font-size: 32px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--ot-brand);
}

.e-153a06e5 .form
{
	display: flex;
	align-items: stretch;
	gap: 12px;
}

.e-153a06e5 .field
{
	flex: 1;
	min-width: 0;
}

.e-153a06e5 .field-email
{
	position: relative;
}

.e-153a06e5 .field input
{
	width: 100%;
	height: 48px;
	padding: 0 16px;
	background: white;
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	color: var(--ot-text-1);
	outline: none;
	transition: border-color 220ms ease;
}

.e-153a06e5 .field-email input
{
	padding-right: 44px;
}

.e-153a06e5 .field input::placeholder
{
	color: var(--ot-text-3);
}

.e-153a06e5 .field input:focus
{
	border-color: var(--ot-brand);
}

.e-153a06e5 .field-email > .field-icon
{
	position: absolute;
	top: 50%;
	right: 14px;
	transform: translateY(-50%);
	font-size: 20px;
	line-height: 1;
	color: var(--ot-text-3);
	pointer-events: none;
}

.e-153a06e5 .form > .btn
{
	flex: 0 0 auto;
	height: 48px;
	padding: 0 24px;
	background: #f5c518;
	border: none;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 700;
	color: #1c1c1c;
	cursor: pointer;
	transition: background 220ms ease;
}

.e-153a06e5 .form > .btn:hover
{
	background: #e0b30f;
}

.e-153a06e5 .legal
{
	margin: 16px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== RIGHT COLUMN (promo card) ===== */

.e-153a06e5 .col-promo > .card
{
	position: relative;
	padding: 32px;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-153a06e5 .col-promo > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.16);
}

.e-153a06e5 .card > .badge
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	padding: 6px 14px;
	background: var(--ot-red);
	border-radius: var(--ot-radius-s);
	font-size: 15px;
	font-weight: 800;
	color: white;
}

.e-153a06e5 .card > .promo-title
{
	margin: 0 0 12px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--ot-brand);
}

.e-153a06e5 .card > .promo-text
{
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-153a06e5 > .holder
	{
		padding: 36px;
	}

	.e-153a06e5 .grid
	{
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

@media (max-width: 640px)
{
	.e-153a06e5 > .holder
	{
		padding: 24px;
	}

	.e-153a06e5 .col-form > .title
	{
		font-size: 26px;
	}

	.e-153a06e5 .form
	{
		flex-direction: column;
		align-items: stretch;
	}

	.e-153a06e5 .form > .btn
	{
		width: 100%;
	}
}

/* ===== END: section-newsletter-1 ===== */
/* ===== BEGIN: section-newsletter-bar-1 ===== */

.e-4681c31f
{
	--nb-lilac: #f3edf7;
	--nb-purple: #7b1fa2;
	--nb-purple-hover: #6a1b9a;
	--nb-dark: #2b1b33;
	--nb-grey: #6f6577;
	--nb-line: #e2d7ea;

	display: block;
	width: 100%;
}

/* ===== HOLDER (low single-row lilac block) ===== */

.e-4681c31f > .holder
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	padding: 20px 28px;
	background: var(--nb-lilac);
	border-radius: 12px;
}

/* ===== LEFT SIDE (icon plus two text lines) ===== */

.e-4681c31f .side
{
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.e-4681c31f .side > .side-icon
{
	flex: 0 0 auto;
	font-size: 28px;
	line-height: 1;
	color: var(--nb-purple);
}

.e-4681c31f .side > .text
{
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.e-4681c31f .text > .title
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--nb-dark);
}

.e-4681c31f .text > .subtitle
{
	margin-top: 2px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--nb-grey);
}

/* ===== RIGHT SIDE (input glued to the button) ===== */

.e-4681c31f .form
{
	display: flex;
	flex: 0 0 auto;
	align-items: stretch;
	gap: 0;
}

.e-4681c31f .form > .field
{
	position: relative;
	width: 260px;
}

.e-4681c31f .field > input
{
	width: 100%;
	height: 46px;
	padding: 0 42px 0 20px;
	background: white;
	border: 1px solid var(--nb-line);
	border-right: none;
	border-radius: 999px 0 0 999px;
	font-size: 15px;
	color: var(--nb-dark);
	outline: none;
	transition: border-color 220ms ease;
}

.e-4681c31f .field > input::placeholder
{
	color: var(--nb-grey);
}

.e-4681c31f .field > input:focus
{
	border-color: var(--nb-purple);
}

.e-4681c31f .field > .field-icon
{
	position: absolute;
	top: 50%;
	right: 16px;
	transform: translateY(-50%);
	font-size: 19px;
	line-height: 1;
	color: var(--nb-grey);
	pointer-events: none;
}

.e-4681c31f .form > .btn
{
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 2px;
	height: 46px;
	padding: 0 22px 0 24px;
	background: var(--nb-purple);
	border: none;
	border-radius: 0 999px 999px 0;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	color: white;
	cursor: pointer;
	transition: background 220ms ease;
}

.e-4681c31f .form > .btn:hover
{
	background: var(--nb-purple-hover);
}

.e-4681c31f .btn > .btn-icon
{
	font-size: 20px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-4681c31f > .holder
	{
		flex-wrap: wrap;
		gap: 18px;
	}

	.e-4681c31f .form
	{
		flex: 1 1 100%;
	}

	.e-4681c31f .form > .field
	{
		flex: 1 1 auto;
		width: auto;
	}
}

@media (max-width: 640px)
{
	.e-4681c31f > .holder
	{
		flex-direction: column;
		align-items: stretch;
		padding: 22px 20px;
	}

	.e-4681c31f .form
	{
		flex-direction: column;
		gap: 10px;
	}

	.e-4681c31f .field > input
	{
		border-right: 1px solid var(--nb-line);
		border-radius: 999px;
	}

	.e-4681c31f .form > .btn
	{
		justify-content: center;
		width: 100%;
		border-radius: 999px;
	}
}

/* ===== END: section-newsletter-bar-1 ===== */
/* ===== BEGIN: section-offer-columns-1 ===== */

.e-760e1252
{
	display: block;
	width: 100%;
}

.e-760e1252 > .holder
{
	width: 100%;
}

/* ===== GRID (3 equal columns) ===== */

.e-760e1252 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: start;
}

/* ===== COLUMN (very light gray rounded block) ===== */

.e-760e1252 .column
{
	position: relative;
	box-sizing: border-box;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-l);
	padding: 28px 16px 16px;
}

/* ===== TAB (white floating header over the top edge) ===== */

.e-760e1252 .column > .tab
{
	display: flex;
	align-items: center;
	gap: 10px;
	box-sizing: border-box;
	margin-top: -44px;
	margin-bottom: 16px;
	padding: 14px 16px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 10px 26px rgba(20, 18, 16, 0.10);
}

.e-760e1252 .tab > .accent
{
	flex: 0 0 auto;
	width: 4px;
	height: 18px;
	background: var(--ot-brand);
	border-radius: 2px;
}

.e-760e1252 .tab > .tab-title
{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
}

/* ===== OFFERS LIST ===== */

.e-760e1252 .column > .offers
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* ===== ROW (white clickable card) ===== */

.e-760e1252 .offers > .row
{
	display: flex;
	align-items: stretch;
	gap: 12px;
	box-sizing: border-box;
	padding: 12px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 3px 10px rgba(20, 18, 16, 0.05);
	text-decoration: none;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 240ms ease;
}

.e-760e1252 .offers > .row:hover
{
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(20, 18, 16, 0.12);
}

/* ===== DATE BOX (square, month over bold blue day) ===== */

.e-760e1252 .row > .date-box
{
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 56px;
	height: 56px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-s);
}

.e-760e1252 .date-box > .date-month
{
	font-size: 12px;
	font-weight: 600;
	line-height: 1.1;
	text-transform: capitalize;
	color: var(--ot-text-1);
}

.e-760e1252 .date-box > .date-day
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-brand);
}

/* ===== DETAILS (two lines) ===== */

.e-760e1252 .row > .details
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	flex: 1;
	min-width: 0;
}

.e-760e1252 .details > .detail-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ot-text-1);
}

.e-760e1252 .detail-name > .detail-location
{
	font-weight: 400;
	color: var(--ot-text-2);
}

/* ===== DETAIL META (transport | duration | price) ===== */

.e-760e1252 .details > .detail-meta
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	line-height: 1.3;
}

.e-760e1252 .detail-meta > .meta-transport
{
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--ot-text-1);
}

.e-760e1252 .detail-meta > .meta-duration,
.e-760e1252 .detail-meta > .meta-price
{
	padding-left: 8px;
	border-left: 1px solid var(--ot-bg-3-border);
}

.e-760e1252 .detail-meta > .meta-duration
{
	color: var(--ot-text-1);
}

.e-760e1252 .detail-meta > .meta-price
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
}

.e-760e1252 .meta-price > .price-label
{
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-760e1252 .meta-price > .price-old
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-760e1252 .meta-price > .price-new
{
	font-size: 17px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-orange);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-760e1252 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-760e1252 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-760e1252 .detail-meta > .meta-price
	{
		flex-basis: 100%;
		padding-left: 0;
		border-left: none;
	}
}

/* ===== END: section-offer-columns-1 ===== */
/* ===== BEGIN: section-offer-inspiration (inspiracija ponuda — mreza 3x2 sa cenom na dnu i dugmetom ispod) ===== */

.e-4fe11a61
{
	display: block;
	width: 100%;
}

.e-4fe11a61 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif, tamnoplav) ===== */

.e-4fe11a61 > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-4fe11a61 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #16294d;
}

/* ===== GRID (3 kolone x 2 reda; grid-auto-rows: 1fr izjednacava visine SVIH redova) ===== */

.e-4fe11a61 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (klikabilna, jednake visine) ===== */

.e-4fe11a61 > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-4fe11a61 > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== MEDIA (fiksne proporcije, nosac za pilulu) ===== */

.e-4fe11a61 > .holder > .grid > .card > .card-media
{
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
}

.e-4fe11a61 > .holder > .grid > .card > .card-media > .card-image
{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-4fe11a61 > .holder > .grid > .card:hover > .card-media > .card-image
{
	transform: scale(1.05);
}

/* ===== BADGE (svetlozelena pilula sa tamnim tekstom, gore-levo preko slike) ===== */

.e-4fe11a61 > .holder > .grid > .card > .card-media > .badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	display: inline-flex;
	align-items: center;
	height: 28px;
	padding: 0 14px;
	border-radius: 999px;
	background: #dff3e4;
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #16294d;
	pointer-events: none;
}

/* ===== BODY (tekst gore, cena prikovana na dno preko .spacer) ===== */

.e-4fe11a61 > .holder > .grid > .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 18px 20px 20px 20px;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: #16294d;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-desc
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-desc > .desc-strong
{
	font-weight: 700;
	color: #16294d;
}

/* ===== CHECKS (lista sa zelenim kvacicama umesto opisa) ===== */

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-checks
{
	display: flex;
	flex-direction: column;
	gap: 7px;
	width: 100%;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-checks > .check
{
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-checks > .check > i
{
	flex-shrink: 0;
	margin-top: 1px;
	font-size: 18px;
	line-height: 1.2;
	color: #148f5f;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-checks > .check > .check-text
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== PRICE (uz desnu ivicu, na dnu; .spacer drzi sve cene u istoj liniji) ===== */

.e-4fe11a61 > .holder > .grid > .card > .card-body > .spacer
{
	flex: 1 1 auto;
	min-height: 14px;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-price
{
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 8px;
	width: 100%;
	text-align: right;
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-price > .price-label
{
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--ot-text-3);
}

.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-price > .price-value
{
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: #16294d;
	white-space: nowrap;
}

/* ===== FOOT (centrirano outline pill dugme) ===== */

.e-4fe11a61 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin: 30px 0 0 0;
}

.e-4fe11a61 > .holder > .foot > .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 26px;
	border: 1px solid #2f6feb;
	border-radius: 999px;
	background: #ffffff;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	color: #2f6feb;
	text-decoration: none;
	transition: background 200ms ease, color 200ms ease;
}

.e-4fe11a61 > .holder > .foot > .button:hover
{
	background: #2f6feb;
	color: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-4fe11a61 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-4fe11a61 > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-4fe11a61 > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-4fe11a61 > .holder > .grid > .card > .card-body
	{
		padding: 16px 18px 18px 18px;
	}

	.e-4fe11a61 > .holder > .foot > .button
	{
		width: 100%;
	}

	.e-4fe11a61 > .holder > .head > .title { font-size: 26px; }
	.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-title { font-size: 17px; }
	.e-4fe11a61 > .holder > .grid > .card > .card-body > .card-price > .price-value { font-size: 22px; }
}

/* ===== END: section-offer-inspiration ===== */
/* ===== BEGIN: section-offer-mozaik-1 (mozaik ponuda: red sirokih pa red uskih kartica) ===== */

.e-85a83de
{
	display: block;
	width: 100%;
}

.e-85a83de > .holder
{
	width: 100%;
}

/* Naslov mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-85a83de > .holder > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-85a83de > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin-top: 28px;
}

/* Broj kolona i proporcija slike stizu inline kao --cols i --ratio, pa media query moze da ih pregazi. */

.e-85a83de > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (bela kartica, cela klikabilna, jednake visine u redu) ===== */

.e-85a83de .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-85a83de .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* Redovi sa manje kartica dobijaju siru proporciju, pa su prirodno visi od gustih redova. */

.e-85a83de .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: var(--ratio, 4 / 3);
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-85a83de .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== FOOT (bela traka: dva reda teksta levo, strelica desno) ===== */

.e-85a83de .card > .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	min-height: 78px;
	padding: 16px 18px;
	background: #ffffff;
}

.e-85a83de .card > .card-foot > .card-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.e-85a83de .card > .card-foot > .card-text > .card-name
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: #24303a;
}

.e-85a83de .card > .card-foot > .card-text > .card-note
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--ot-text-2);
}

/* ===== ARROW (siva strelica uz desnu ivicu, vertikalno centrirana) ===== */

.e-85a83de .card > .card-foot > .card-arrow
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 220ms ease;
}

.e-85a83de .card:hover > .card-foot > .card-arrow
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-85a83de > .holder > .grid
	{
		gap: 20px;
	}

	.e-85a83de > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-85a83de .card > .card-image
	{
		aspect-ratio: 16 / 9;
	}

	.e-85a83de > .holder > .title
	{
		font-size: 30px;
	}
}

@media (max-width: 640px)
{
	.e-85a83de > .holder > .grid
	{
		gap: 16px;
	}

	.e-85a83de > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-85a83de .card > .card-foot
	{
		min-height: 74px;
		padding: 14px 16px;
	}

	.e-85a83de > .holder > .title
	{
		font-size: 26px;
	}

	.e-85a83de .card > .card-foot > .card-text > .card-name
	{
		font-size: 16px;
	}
}

/* ===== END: section-offer-mozaik-1 ===== */
/* ===== BEGIN: section-offers-1 ===== */

.e-a426a87
{
	display: block;
	width: 100%;
}

.e-a426a87 > .holder
{
	width: 100%;
}

/* ===== HEADER (centered "Više ▾" link) ===== */

.e-a426a87 > .holder > .head
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 28px;
}

.e-a426a87 .head > .more
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 16px;
	font-weight: 700;
	color: var(--ot-text-1);
	text-decoration: none;
	transition: opacity 220ms ease;
}

.e-a426a87 .head > .more:hover
{
	opacity: 0.7;
}

.e-a426a87 .more > i
{
	font-size: 20px;
	line-height: 1;
}

/* ===== GRID (row of 4 equal cards) ===== */

.e-a426a87 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

/* ===== CARD ===== */

.e-a426a87 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-a426a87 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE (rounded top, no overlay) ===== */

.e-a426a87 .card > .card-image
{
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== CARD BODY ===== */

.e-a426a87 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 16px;
	padding: 18px;
}

.e-a426a87 .card-title
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-a426a87 .price-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding: 12px 16px;
	background: #2b2b2b;
	border-radius: var(--ot-radius-m);
	font-size: 14px;
	font-weight: 600;
	color: white;
	text-align: center;
	transition: background 220ms ease;
}

.e-a426a87 .card:hover .price-button
{
	background: #171717;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-a426a87 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-a426a87 > .holder > .head
	{
		margin-bottom: 22px;
	}
}

/* ===== END: section-offers-1 ===== */
/* ===== BEGIN: section-offers-carousel-1 ===== */

.e-48fb6abc
{
	display: block;
	width: 100%;
	--oc-dark: #24303a;
	--oc-grey: #6b7280;
	--oc-dot: #b4b8c0;
	--oc-orange: #f5901e;
	--oc-orange-hover: #dd8016;
	--oc-coral: #e5484d;
	--oc-line: #e6e1d8;
}

.e-48fb6abc > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamni sans naslov) ===== */

.e-48fb6abc > .holder > .head
{
	margin: 0 0 26px 0;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-48fb6abc > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--oc-dark);
}

/* ===== STAGE (karusel + strelice IZVAN kartica) ===== */

.e-48fb6abc > .holder > .stage
{
	position: relative;
	padding: 0 60px;
	outline: none;
}

.e-48fb6abc > .holder > .stage > .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
}

.e-48fb6abc > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (jednake sirine, razmak kroz padding) ===== */

.e-48fb6abc > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 3));
	min-width: 0;
	padding: 0 12px;
}

/* ===== KARTICA (bela, zaobljena, traka se secka na gornje uglove) ===== */

.e-48fb6abc .cell > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	min-width: 0;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-48fb6abc .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== TRAKA BRENDA (obojena, puna sirina, samo na nekim karticama) ===== */

.e-48fb6abc .card > .strip
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	background: var(--oc-orange);
	color: #ffffff;
}

.e-48fb6abc .strip > .strip-brand
{
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-48fb6abc .strip > .strip-icon
{
	flex-shrink: 0;
	font-size: 18px;
	line-height: 1;
}

.e-48fb6abc .strip > .strip-text
{
	min-width: 0;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===== SLIKA (puna sirina, blagi zum na hover kartice) ===== */

.e-48fb6abc .card > .card-media
{
	position: relative;
	display: block;
	height: 190px;
	overflow: hidden;
}

.e-48fb6abc .card-media > .media-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-48fb6abc .card:hover .media-image
{
	transform: scale(1.06);
}

/* ===== TELO (razmak se rasteze da dno ostane poravnato) ===== */

.e-48fb6abc .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	min-width: 0;
	padding: 16px 18px 18px;
}

.e-48fb6abc .card-body > .spacer
{
	flex: 1 1 auto;
	min-height: 14px;
}

.e-48fb6abc .card-body > .tag
{
	display: inline-block;
	padding: 4px 11px;
	border-radius: 100px;
	background: #55606b;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #ffffff;
}

.e-48fb6abc .card-body > .name
{
	font-size: 21px;
	font-weight: 800;
	line-height: 1.25;
	text-decoration: none;
	color: var(--oc-dark);
}

.e-48fb6abc .card-body > .name:hover
{
	text-decoration: underline;
}

.e-48fb6abc .card-body > .location
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--oc-grey);
}

/* ===== OCENE (narandzasta sunca + znak plus) ===== */

.e-48fb6abc .card-body > .ratings
{
	display: flex;
	align-items: center;
	gap: 2px;
	color: var(--oc-orange);
}

.e-48fb6abc .ratings > i
{
	font-size: 18px;
	line-height: 1;
}

.e-48fb6abc .ratings > .rating-plus
{
	margin-left: 3px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
}

/* ===== LISTA (siva tacka + tekst, prelama se u dva reda) ===== */

.e-48fb6abc .card-body > .features
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
	margin-top: 4px;
}

.e-48fb6abc .features > .feature
{
	position: relative;
	padding-left: 16px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--oc-grey);
}

.e-48fb6abc .features > .feature::before
{
	position: absolute;
	top: 8px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--oc-dot);
	content: '';
}

/* ===== DONJI RED (separator, cena levo, dugme desno — prikacen za dno) ===== */

.e-48fb6abc .card-body > .card-foot
{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding-top: 14px;
	border-top: 1px solid var(--oc-line);
}

.e-48fb6abc .card-foot > .price
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-48fb6abc .price > .price-promo
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--oc-grey);
}

.e-48fb6abc .price > .price-new
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--oc-coral);
}

.e-48fb6abc .price > .price-note
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--oc-grey);
}

.e-48fb6abc .card-foot > .price-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	min-height: 42px;
	padding: 0 22px;
	border-radius: 100px;
	background: var(--oc-orange);
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: #ffffff;
	transition: background var(--ot-transition);
}

.e-48fb6abc .card-foot > .price-button:hover
{
	background: var(--oc-orange-hover);
}

/* ===== ARROWS (kruzna dugmad sa strane, centrirana po visini kartica) ===== */

.e-48fb6abc > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(15, 23, 42, 0.10);
	border-radius: 50%;
	background: #ffffff;
	color: var(--oc-dark);
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
	transform: translateY(-50%);
	transition: transform 220ms ease, background 220ms ease;
}

.e-48fb6abc > .holder > .stage > .arrow:hover
{
	background: #f2f2f2;
	transform: translateY(-50%) scale(1.06);
}

.e-48fb6abc > .holder > .stage > .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

/* Kad u tom smeru nema kuda — strelica ostaje vidljiva ali prigusena. */

.e-48fb6abc > .holder > .stage > .arrow.is-off
{
	color: rgba(36, 48, 58, 0.35);
	cursor: default;
	opacity: 0.55;
}

.e-48fb6abc > .holder > .stage > .arrow.is-off:hover
{
	background: #ffffff;
	transform: translateY(-50%);
}

.e-48fb6abc > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-48fb6abc > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== RESPONSIVE (tri kartice, pa dve, pa jedna) ===== */

@media (max-width: 1024px)
{
	.e-48fb6abc > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-48fb6abc > .holder > .head > .title
	{
		font-size: 28px;
	}
}

@media (max-width: 640px)
{
	.e-48fb6abc > .holder > .stage
	{
		padding: 0;
	}

	.e-48fb6abc > .holder > .stage > .viewport > .track > .cell
	{
		padding: 0 6px;
	}

	.e-48fb6abc > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-48fb6abc > .holder > .stage > .arrow-prev
	{
		left: 6px;
	}

	.e-48fb6abc > .holder > .stage > .arrow-next
	{
		right: 6px;
	}

	.e-48fb6abc > .holder > .head > .title
	{
		font-size: 24px;
	}

	.e-48fb6abc .card-body > .card-foot
	{
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	.e-48fb6abc .card-foot > .price-button
	{
		width: 100%;
	}
}

/* ===== END: section-offers-carousel-1 ===== */
/* ===== BEGIN: section-our-destinations-1 ===== */

.e-71364da8
{
	--od-navy: #16294d;
	--od-arrow: #16294d;

	display: block;
}

.e-71364da8 > .holder
{
	outline: none;
}

/* Zaglavlje — naslov i pill dugme jedno uz drugo, ne razvuceni do ivica. */

.e-71364da8 > .holder > .top
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	margin-bottom: 26px;
}

.e-71364da8 > .holder > .top > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--od-navy);
}

.e-71364da8 > .holder > .top > .all
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 42px;
	padding: 0 20px;
	border: 1.5px solid var(--od-navy);
	border-radius: 100px;
	background: transparent;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	color: var(--od-navy);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-71364da8 > .holder > .top > .all:hover
{
	background: var(--od-navy);
	color: #ffffff;
}

.e-71364da8 > .holder > .top > .all > i
{
	font-size: 18px;
	transition: transform var(--ot-transition);
}

.e-71364da8 > .holder > .top > .all:hover > i
{
	transform: translateX(3px);
}

/* Karusel — red kartica ide do ivica kontejnera, strelice lebde preko njegovih ivica. */

.e-71364da8 > .holder > .stage
{
	position: relative;
}

.e-71364da8 > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-71364da8 > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	gap: 0;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 6.5));
	max-width: calc(100% / var(--per-view, 6.5));
	padding: 6px;
	box-sizing: border-box;
}

/* Negativna margina ponistava spoljni padding celija pa se ivice kartica poklapaju sa naslovom. */

.e-71364da8 > .holder > .stage > .viewport
{
	margin: -6px;
}

/* Kartica — cela je jedna uspravna fotografija, sve iste sirine i visine. */

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 23, 42, 0.18);
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card > .shade
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 45%, rgba(6, 10, 20, 0.72) 100%);
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card > .name
{
	position: absolute;
	left: 14px;
	right: 58px;
	bottom: 16px;
	z-index: 2;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card > .open
{
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
	transition: transform 260ms ease;
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card > .open > i
{
	font-size: 19px;
	color: var(--od-arrow);
}

.e-71364da8 > .holder > .stage > .viewport > .track > .cell > .card:hover > .open
{
	transform: scale(1.1);
}

/* Kruzne strelice. */

.e-71364da8 > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	background: #ffffff;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(15, 23, 42, 0.14);
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-71364da8 > .holder > .stage > .arrow > i
{
	font-size: 21px;
	color: var(--od-navy);
}

.e-71364da8 > .holder > .stage > .arrow:hover
{
	background: var(--ot-bg-2);
}

.e-71364da8 > .holder > .stage > .arrow.is-off
{
	opacity: 0.35;
	cursor: default;
}

.e-71364da8 > .holder > .stage > .arrow.is-off:hover
{
	background: #ffffff;
}

.e-71364da8 > .holder > .stage > .arrow-prev
{
	left: 4px;
}

.e-71364da8 > .holder > .stage > .arrow-next
{
	right: 4px;
}

/* Tackice ispod karusela. */

.e-71364da8 > .holder > .dots
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 22px;
}

.e-71364da8 > .holder > .dots > .dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--ot-bg-3-border);
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 240ms;
}

.e-71364da8 > .holder > .dots > .dot.active
{
	width: 28px;
	border-radius: 100px;
	background: var(--od-navy);
}

@media (max-width: 1024px)
{
	.e-71364da8 > .holder > .top > .title
	{
		font-size: 28px;
	}

	.e-71364da8 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 3.4));
		max-width: calc(100% / var(--per-view, 3.4));
	}
}

@media (max-width: 640px)
{
	.e-71364da8 > .holder > .top
	{
		gap: 12px;
		margin-bottom: 20px;
	}

	.e-71364da8 > .holder > .top > .title
	{
		font-size: 24px;
	}

	.e-71364da8 > .holder > .stage > .arrow
	{
		display: none;
	}

	.e-71364da8 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1.4));
		max-width: calc(100% / var(--per-view, 1.4));
	}
}

/* ===== END: section-our-destinations-1 ===== */
/* ===== BEGIN: section-overlap-cards-1 ===== */

.e-138f30fd
{
	display: block;
	width: 100%;
}

.e-138f30fd > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30fd > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30fd > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== TABS (optional country switcher between title and cards) ===== */

.e-138f30fd > .holder > .tabs
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: -14px 0 26px;
}

.e-138f30fd .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 18px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
}

.e-138f30fd .tabs > .tab:hover
{
	border-color: #14b8a6;
	color: #14b8a6;
}

.e-138f30fd .tabs > .tab.is-active
{
	background: #14b8a6;
	border-color: #14b8a6;
	color: white;
}

.e-138f30fd .tab-flag
{
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 14px;
	border-radius: 2px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-138f30fd .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-138f30fd .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fd .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (rounded, own overflow for zoom, bottom covered by body) ===== */

.e-138f30fd .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fd .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== BADGE (opciona obojena oznaka preko gornjeg levog ugla fotografije) ===== */

.e-138f30fd .card > .badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.22);
}

.e-138f30fd .card > .badge.is-last
{
	background: #e4002b;
}

.e-138f30fd .card > .badge.is-first
{
	background: #148f5f;
}

/* ===== CARD BODY (white block that overlaps the image, narrower + centered) ===== */

.e-138f30fd .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-138f30fd .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-138f30fd .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-138f30fd .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30fd .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30fd .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-138f30fd .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-138f30fd .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CHIPS (sitne cinjenice sa ikonicama, lome se u vise redova) ===== */

.e-138f30fd .card-body > .chips
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px 10px;
	margin-top: 14px;
}

.e-138f30fd .chips > .chip
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 100%;
	padding: 4px 9px;
	background: var(--ot-bg-2);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--ot-text-2);
}

.e-138f30fd .chips > .chip > i
{
	flex: 0 0 auto;
	font-size: 15px;
	line-height: 1;
	color: #14b8a6;
}

/* ===== SPACER (guta visak visine da dugme ostane prikovano na dnu i kad kartice imaju razlicit broj cinjenica) ===== */

.e-138f30fd .card-body > .spacer
{
	flex: 1 1 auto;
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30fd .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30fd .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== FOOT (optional button centred below the cards) ===== */

.e-138f30fd > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

.e-138f30fd .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 999px;
	background: #14b8a6;
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-138f30fd .foot > .cta:hover
{
	background: #0f9c92;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30fd .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-138f30fd .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30fd > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30fd > .holder > .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		margin-top: -10px;
	}

	.e-138f30fd .tabs > .tab
	{
		flex: 0 0 auto;
	}

	.e-138f30fd .card > .card-body
	{
		margin-top: -28px;
	}

	.e-138f30fd .foot > .cta
	{
		width: 100%;
	}
}

/* ===== END: section-overlap-cards-1 ===== */
/* ===== BEGIN: section-overlap-cards-2 ===== */

.e-138f30fc
{
	display: block;
	width: 100%;
}

.e-138f30fc > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30fc > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30fc > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-138f30fc .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== STAGE (opcioni slajder — strelice stoje SA STRANE reda, pa je pozornica uvucena) ===== */

.e-138f30fc > .holder > .stage
{
	position: relative;
	padding: 0 60px;
}

/* ===== Sa tackicama nema strelica, pa pozornica ide do ivica ===== */

.e-138f30fc > .holder > .stage.is-dots
{
	padding: 0;
}

.e-138f30fc > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-138f30fc > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	margin: 0 -12px;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-138f30fc > .holder > .stage > .viewport > .track > .cell
{
	display: flex;
	flex: 0 0 calc(100% / var(--per-view, 4));
	max-width: calc(100% / var(--per-view, 4));
	padding: 0 12px;
	box-sizing: border-box;
}

.e-138f30fc > .holder > .stage > .viewport > .track > .cell > .card
{
	width: 100%;
}

.e-138f30fc > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 50%;
	background: white;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.14);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-138f30fc > .holder > .stage > .arrow > i
{
	font-size: 24px;
	color: var(--ot-text-1);
}

.e-138f30fc > .holder > .stage > .arrow:hover
{
	background: #f1f4f8;
	transform: translateY(-50%) scale(1.06);
}

.e-138f30fc > .holder > .stage > .arrow.is-off
{
	opacity: 0.5;
	cursor: default;
}

.e-138f30fc > .holder > .stage > .arrow.is-off:hover
{
	background: white;
	transform: translateY(-50%);
}

.e-138f30fc > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-138f30fc > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== DOTS (centriran red sitnih tackica ispod kartica umesto strelica) ===== */

.e-138f30fc > .holder > .dots
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 26px;
}

.e-138f30fc .dots > .dot
{
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(20, 184, 166, 0.3);
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-138f30fc .dots > .dot:hover
{
	background: rgba(20, 184, 166, 0.6);
}

.e-138f30fc .dots > .dot.is-active
{
	background: #14b8a6;
	transform: scale(1.3);
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-138f30fc .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fc .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (rounded, own overflow for zoom, bottom covered by body) ===== */

.e-138f30fc .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fc .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block that overlaps the image, narrower + centered) ===== */

.e-138f30fc .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-138f30fc .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-138f30fc .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-138f30fc .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30fc .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30fc .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-138f30fc .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-138f30fc .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30fc .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30fc .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== FOOT (optional button centred below the cards) ===== */

.e-138f30fc > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

.e-138f30fc .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 999px;
	background: #14b8a6;
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-138f30fc .foot > .cta:hover
{
	background: #0f9c92;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30fc .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-138f30fc > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-138f30fc > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2));
		max-width: calc(100% / var(--per-view, 2));
	}
}

@media (max-width: 640px)
{
	.e-138f30fc .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30fc > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30fc .card > .card-body
	{
		margin-top: -28px;
	}

	.e-138f30fc > .holder > .stage
	{
		padding: 0;
	}

	.e-138f30fc > .holder > .stage > .viewport > .track
	{
		margin: 0 -8px;
	}

	.e-138f30fc > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1));
		max-width: calc(100% / var(--per-view, 1));
		padding: 0 8px;
	}

	.e-138f30fc > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-138f30fc > .holder > .stage > .arrow-prev { left: 4px; }
	.e-138f30fc > .holder > .stage > .arrow-next { right: 4px; }

	.e-138f30fc .foot > .cta
	{
		width: 100%;
	}
}

/* ===== END: section-overlap-cards-2 ===== */
/* ===== BEGIN: section-overlap-cards-3 ===== */

.e-138f30fb
{
	display: block;
	width: 100%;
}

.e-138f30fb > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30fb > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30fb > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== GRID (two columns of horizontal cards → three rows for six cards) ===== */

.e-138f30fb .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== STAGE (optional slider — arrows sit beside the row, so the stage is inset) ===== */

.e-138f30fb > .holder > .stage
{
	position: relative;
	padding: 0 60px;
}

/* ===== Sa tackicama nema strelica, pa pozornica ide do ivica ===== */

.e-138f30fb > .holder > .stage.is-dots
{
	padding: 0;
}

.e-138f30fb > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-138f30fb > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	margin: 0 -12px;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-138f30fb > .holder > .stage > .viewport > .track > .cell
{
	display: flex;
	flex-direction: column;
	gap: 24px;
	flex: 0 0 calc(100% / var(--per-view, 3));
	max-width: calc(100% / var(--per-view, 3));
	padding: 0 12px;
	box-sizing: border-box;
}

.e-138f30fb > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 50%;
	background: white;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.14);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-138f30fb > .holder > .stage > .arrow > i
{
	font-size: 24px;
	color: var(--ot-text-1);
}

.e-138f30fb > .holder > .stage > .arrow:hover
{
	background: #f1f4f8;
	transform: translateY(-50%) scale(1.06);
}

.e-138f30fb > .holder > .stage > .arrow.is-off
{
	opacity: 0.5;
	cursor: default;
}

.e-138f30fb > .holder > .stage > .arrow.is-off:hover
{
	background: white;
	transform: translateY(-50%);
}

.e-138f30fb > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-138f30fb > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== DOTS (centriran red sitnih tackica ispod kartica umesto strelica) ===== */

.e-138f30fb > .holder > .dots
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 26px;
}

.e-138f30fb .dots > .dot
{
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(20, 184, 166, 0.3);
	cursor: pointer;
	transition: background 200ms ease, transform 200ms ease;
}

.e-138f30fb .dots > .dot:hover
{
	background: rgba(20, 184, 166, 0.6);
}

.e-138f30fb .dots > .dot.is-active
{
	background: #14b8a6;
	transform: scale(1.3);
}

/* ===== CARD (single clickable unit, horizontal: image left, body right) ===== */

.e-138f30fb .card
{
	display: flex;
	flex-direction: row;
	align-items: stretch;
	min-height: 220px;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fb .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (left part of the card, own overflow for zoom) ===== */

.e-138f30fb .card > .card-image
{
	display: block;
	flex: 0 0 42%;
	align-self: stretch;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fb .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block on the right, holds all text) ===== */

.e-138f30fb .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-138f30fb .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-138f30fb .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-138f30fb .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30fb .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30fb .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-138f30fb .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-138f30fb .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30fb .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30fb .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== FOOT (optional button centred below the cards) ===== */

.e-138f30fb > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

.e-138f30fb .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 999px;
	background: #14b8a6;
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-138f30fb .foot > .cta:hover
{
	background: #0f9c92;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30fb > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-138f30fb > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2));
		max-width: calc(100% / var(--per-view, 2));
	}
}

@media (max-width: 640px)
{
	.e-138f30fb .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30fb > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30fb .card
	{
		flex-direction: column;
	}

	.e-138f30fb .card > .card-image
	{
		flex: 0 0 auto;
		aspect-ratio: 4 / 3;
		width: 100%;
	}

	.e-138f30fb > .holder > .stage
	{
		padding: 0;
	}

	.e-138f30fb > .holder > .stage > .viewport > .track
	{
		margin: 0 -8px;
	}

	.e-138f30fb > .holder > .stage > .viewport > .track > .cell
	{
		gap: 16px;
		flex: 0 0 calc(100% / var(--per-view, 1));
		max-width: calc(100% / var(--per-view, 1));
		padding: 0 8px;
	}

	.e-138f30fb > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-138f30fb > .holder > .stage > .arrow-prev { left: 4px; }
	.e-138f30fb > .holder > .stage > .arrow-next { right: 4px; }

	.e-138f30fb .foot > .cta
	{
		width: 100%;
	}
}

/* ===== END: section-overlap-cards-3 ===== */
/* ===== BEGIN: section-overlap-cards-4 ===== */

.e-138f30fa
{
	display: block;
	width: 100%;
}

.e-138f30fa > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30fa > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30fa > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-138f30fa .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-138f30fa .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fa .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (left and right ends maximally rounded into a capsule, own overflow for zoom, bottom covered by body) ===== */

.e-138f30fa .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 999px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30fa .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block that overlaps the image, narrower + centered) ===== */

.e-138f30fa .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-138f30fa .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-138f30fa .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-138f30fa .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30fa .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30fa .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-138f30fa .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-138f30fa .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30fa .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30fa .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30fa .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-138f30fa .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30fa > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30fa .card > .card-body
	{
		margin-top: -28px;
	}
}

/* ===== END: section-overlap-cards-4 ===== */
/* ===== BEGIN: section-overlap-cards-5 ===== */

.e-138f30f9
{
	display: block;
	width: 100%;
}

.e-138f30f9 > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30f9 > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30f9 > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-138f30f9 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-138f30f9 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30f9 .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (bottom-left and bottom-right corners maximally rounded, top corners normal, own overflow for zoom, bottom covered by body) ===== */

.e-138f30f9 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-top-left-radius: var(--ot-radius-m);
	border-top-right-radius: var(--ot-radius-m);
	border-bottom-left-radius: 999px;
	border-bottom-right-radius: 999px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30f9 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block that overlaps the image, narrower + centered) ===== */

.e-138f30f9 .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: white;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (turquoise, white uppercase text) ===== */

.e-138f30f9 .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: #14b8a6;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: white;
}

/* ===== NAME (big bold dark blue, sans-serif, up to two lines) ===== */

.e-138f30f9 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-brand);
}

/* ===== META (two data columns split by a thin vertical line) ===== */

.e-138f30f9 .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30f9 .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30f9 .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-138f30f9 .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-138f30f9 .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid var(--ot-bg-3-border);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30f9 .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: var(--ot-text-2);
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30f9 .card:hover .card-button
{
	border-color: var(--ot-text-2);
	color: var(--ot-text-1);
}

/* ===== FOOT (optional button centred below the cards) ===== */

.e-138f30f9 > .holder > .foot
{
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

.e-138f30f9 .foot > .cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 0 34px;
	border-radius: 999px;
	background: #14b8a6;
	font-size: 15px;
	font-weight: 700;
	color: white;
	text-decoration: none;
	transition: background 200ms ease;
}

.e-138f30f9 .foot > .cta:hover
{
	background: #0f9c92;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30f9 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-138f30f9 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30f9 > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30f9 .card > .card-body
	{
		margin-top: -28px;
	}

	.e-138f30f9 .foot > .cta
	{
		width: 100%;
	}
}

/* ===== END: section-overlap-cards-5 ===== */
/* ===== BEGIN: section-overlap-cards-6 ===== */

.e-138f30f8
{
	display: block;
	width: 100%;
}

.e-138f30f8 > .holder
{
	width: 100%;
}

/* ===== TITLE (left-aligned, elegant serif, dark blue, heart icon) ===== */

.e-138f30f8 > .holder > .title
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 36px;
	text-align: left;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var(--ot-brand);
}

.e-138f30f8 > .holder > .title > .heart
{
	flex: 0 0 auto;
	font-size: 30px;
	line-height: 1;
	color: #14b8a6;
	font-variation-settings: 'FILL' 1;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-138f30f8 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	align-items: stretch;
}

/* ===== CARD (single clickable unit, equal height, floating body) ===== */

.e-138f30f8 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30f8 .card:hover
{
	transform: translateY(-6px);
}

/* ===== CARD IMAGE (rounded, own overflow for zoom, bottom covered by body) ===== */

.e-138f30f8 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-138f30f8 .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (teal #12b3ad block that overlaps the image, narrower + centered) ===== */

.e-138f30f8 .card > .card-body
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 88%;
	align-self: center;
	margin-top: -44px;
	box-sizing: border-box;
	padding: 20px 20px 22px;
	background: #12b3ad;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* ===== PILL (white block, teal uppercase text so it stays visible on the teal body) ===== */

.e-138f30f8 .card-body > .pill
{
	align-self: flex-start;
	padding: 5px 12px;
	background: white;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	line-height: 1.1;
	color: #12b3ad;
}

/* ===== NAME (big bold white, sans-serif, up to two lines) ===== */

.e-138f30f8 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 12px;
	min-height: 2.5em;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	color: #ffffff;
}

/* ===== META (two data columns split by a thin translucent white line) ===== */

.e-138f30f8 .card-body > .meta
{
	display: flex;
	align-items: stretch;
	gap: 16px;
	margin-top: 16px;
}

.e-138f30f8 .meta > .meta-left
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1;
	min-width: 0;
}

.e-138f30f8 .meta-left > .meta-type
{
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: rgba(255, 255, 255, 0.8);
}

.e-138f30f8 .meta-left > .meta-duration
{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: #ffffff;
}

.e-138f30f8 .meta > .meta-right
{
	flex: 1;
	min-width: 0;
	padding-left: 16px;
	border-left: 1px solid rgba(255, 255, 255, 0.4);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: #ffffff;
}

/* ===== CARD BUTTON (full width, bottom aligned, outline) ===== */

.e-138f30f8 .card-body > .card-button
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-align: center;
	color: #ffffff;
	transition: border-color 220ms ease, color 220ms ease;
}

.e-138f30f8 .card:hover .card-button
{
	border-color: #ffffff;
	color: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-138f30f8 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-138f30f8 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-138f30f8 > .holder > .title
	{
		margin-bottom: 28px;
		font-size: 28px;
	}

	.e-138f30f8 .card > .card-body
	{
		margin-top: -28px;
	}
}

/* ===== END: section-overlap-cards-6 ===== */
/* ===== BEGIN: section-picks-1 ===== */

.e-190c2a28
{
	display: block;
	width: 100%;
}

.e-190c2a28 > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold blue title) ===== */

.e-190c2a28 > .holder > .head
{
	margin-bottom: 24px;
}

.e-190c2a28 .head > .title
{
	margin: 0;
	font-size: 30px;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-blue);
}

/* ===== GRID ===== */

.e-190c2a28 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

/* ===== SHARED CARD ===== */

.e-190c2a28 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-190c2a28 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE + PILLS ===== */

.e-190c2a28 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-190c2a28 .card:hover > .card-image
{
	transform: scale(1.05);
}

.e-190c2a28 .card-image > .pills
{
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.e-190c2a28 .pill
{
	display: inline-flex;
	align-items: center;
	padding: 4px 9px;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.02em;
	line-height: 1;
	white-space: nowrap;
	box-shadow: 0 3px 8px rgba(20, 18, 16, 0.14);
}

.e-190c2a28 .pill-type
{
	background: #f5b301;
	color: #3a2c00;
}

.e-190c2a28 .pill-discount
{
	background: var(--ot-red);
	color: white;
	box-shadow: none;
}

/* ===== CARD BODY ===== */

.e-190c2a28 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	padding: 14px 16px 16px;
}

.e-190c2a28 .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-190c2a28 .stars > i
{
	font-size: 16px;
	font-variation-settings: 'FILL' 1;
}

.e-190c2a28 .card-name
{
	font-size: 18px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-blue);
}

.e-190c2a28 .hotel-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 13px;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-190c2a28 .info
{
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-top: 2px;
}

.e-190c2a28 .info-row
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	color: var(--ot-text-2);
}

.e-190c2a28 .info-row > i
{
	font-size: 17px;
	color: var(--ot-blue);
}

.e-190c2a28 .dest-desc
{
	font-size: 13px;
	line-height: 1.3;
	color: var(--ot-text-2);
}

/* ===== DETAIL CHIPS (opciono; svetla pilula na belom telu kartice, prelamaju se u vise redova) ===== */

.e-190c2a28 .card-meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.e-190c2a28 .card-meta > .chip
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 7px;
	border-radius: 100px;
	background: var(--ot-bg-2);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--ot-text-1);
}

.e-190c2a28 .card-meta > .chip > i
{
	font-size: 13px;
	color: var(--ot-blue);
}

.e-190c2a28 .dest-count
{
	font-size: 14px;
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-190c2a28 .date-box
{
	display: block;
	padding: 8px 12px;
	background: #e8f1ff;
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	font-weight: 700;
	text-align: center;
	color: var(--ot-blue);
}

/* ===== YELLOW PRICE BUTTON ===== */

.e-190c2a28 .price-button
{
	display: block;
	margin-top: auto;
	padding: 12px 14px;
	background: #f5b301;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 800;
	text-align: center;
	color: #3a2c00;
	transition: background 220ms ease;
}

.e-190c2a28 .card:hover .price-button
{
	background: #ffc21f;
}

/* ===== TYPE 3 — WIDE FIRST MINUTE LIST ===== */

.e-190c2a28 .card.wide
{
	grid-column: span 2;
	padding: 18px 20px 20px;
}

.e-190c2a28 .card.wide:hover
{
	transform: none;
}

.e-190c2a28 .wide > .wide-head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 6px;
}

.e-190c2a28 .wide-head > .wide-title
{
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--ot-blue);
}

.e-190c2a28 .wide > .wide-list
{
	display: flex;
	flex-direction: column;
}

.e-190c2a28 .wide-row
{
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px;
	padding: 13px 0;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-190c2a28 .wide-row:last-child
{
	border-bottom: 0;
}

.e-190c2a28 .wide-dest
{
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
}

.e-190c2a28 .wide-flag
{
	font-size: 18px;
	line-height: 1;
}

.e-190c2a28 .wide-name
{
	font-size: 15px;
	font-weight: 700;
	color: var(--ot-text-1);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-190c2a28 .wide-date
{
	font-size: 13px;
	color: var(--ot-text-2);
	white-space: nowrap;
}

.e-190c2a28 .wide-price
{
	display: inline-flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 5px;
	white-space: nowrap;
}

.e-190c2a28 .wide-od
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-190c2a28 .wide-amount
{
	font-size: 15px;
	font-weight: 800;
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-190c2a28 > .holder > .grid { grid-template-columns: repeat(2, 1fr); }
	.e-190c2a28 .card.wide { grid-column: 1 / -1; }
}

@media (max-width: 640px)
{
	.e-190c2a28 > .holder > .grid { grid-template-columns: 1fr; }
	.e-190c2a28 .card.wide { grid-column: 1 / -1; }
	.e-190c2a28 .head > .title { font-size: 24px; }
	.e-190c2a28 .wide-row { grid-template-columns: 1fr auto; row-gap: 4px; }
	.e-190c2a28 .wide-date { grid-column: 1 / -1; grid-row: 2; }
}

/* ===== END: section-picks-1 ===== */
/* ===== BEGIN: section-picks-2 ===== */

.e-190c2a27
{
	display: block;
	width: 100%;
}

.e-190c2a27 > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold blue title) ===== */

.e-190c2a27 > .holder > .head
{
	margin-bottom: 24px;
}

.e-190c2a27 .head > .title
{
	margin: 0;
	font-size: 30px;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-blue);
}

/* ===== GRID (uniform 5 columns, cards stretch to equal height per row) ===== */

.e-190c2a27 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}

/* ===== CARD ===== */

.e-190c2a27 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	overflow: hidden;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-190c2a27 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE + DISCOUNT PILL ===== */

.e-190c2a27 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-190c2a27 .card:hover > .card-image
{
	transform: scale(1.05);
}

.e-190c2a27 .pill
{
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	padding: 4px 9px;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.02em;
	line-height: 1;
	white-space: nowrap;
}

.e-190c2a27 .pill-discount
{
	background: var(--ot-red);
	color: white;
}

/* ===== CARD BODY ===== */

.e-190c2a27 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	padding: 14px 16px 16px;
}

.e-190c2a27 .stars
{
	display: inline-flex;
	align-items: center;
	gap: 1px;
	color: #f5b301;
}

.e-190c2a27 .stars > i
{
	font-size: 16px;
	font-variation-settings: 'FILL' 1;
}

.e-190c2a27 .card-name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.3em;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-blue);
}

.e-190c2a27 .location
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	color: var(--ot-text-2);
}

.e-190c2a27 .location > i
{
	font-size: 16px;
	color: var(--ot-blue);
}

/* ===== YELLOW PRICE BUTTON ===== */

.e-190c2a27 .price-button
{
	display: block;
	margin-top: auto;
	padding: 12px 14px;
	background: #f5b301;
	border-radius: var(--ot-radius-m);
	font-size: 15px;
	font-weight: 800;
	text-align: center;
	color: #3a2c00;
	transition: background 220ms ease;
}

.e-190c2a27 .card:hover .price-button
{
	background: #ffc21f;
}

/* ===== RESPONSIVE (5 -> 4 -> 3 -> 2 -> 1, cards stay uniform) ===== */

@media (max-width: 1280px)
{
	.e-190c2a27 > .holder > .grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1024px)
{
	.e-190c2a27 > .holder > .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px)
{
	.e-190c2a27 > .holder > .grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px)
{
	.e-190c2a27 > .holder > .grid { grid-template-columns: 1fr; }
	.e-190c2a27 .head > .title { font-size: 24px; }
}

/* ===== END: section-picks-2 ===== */
/* ===== BEGIN: section-popular-1 ===== */

.e-29143dff
{
	display: block;
	width: 100%;
}

.e-29143dff > .holder
{
	width: 100%;
}

/* ===== HEADER (bold dark title left, blue see-more link right) ===== */

.e-29143dff > .holder > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 28px;
}

.e-29143dff .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

.e-29143dff .head > .more
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
	color: var(--ot-blue);
	transition: gap 220ms ease, color 220ms ease;
}

.e-29143dff .head > .more:hover
{
	gap: 10px;
	color: var(--ot-blue-hover);
}

.e-29143dff .head > .more > i
{
	font-size: 20px;
	line-height: 1;
}

/* ===== GRID (3 equal cards per row, wraps down on smaller screens) ===== */

.e-29143dff .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit) ===== */

.e-29143dff .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	text-decoration: none;
	background: white;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-29143dff .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== CARD IMAGE (clean top image, rounded top corners) ===== */

.e-29143dff .card > .card-image
{
	display: block;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-29143dff .card:hover > .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (white block with bold dark name and grey city list) ===== */

.e-29143dff .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px 20px 20px;
	background: white;
}

.e-29143dff .card-name
{
	font-weight: 700;
	font-size: 17px;
	line-height: 1.3;
	color: var(--ot-brand);
}

.e-29143dff .card-cities
{
	font-size: 13px;
	line-height: 1.4;
	color: var(--ot-text-3);
}

/* ===== RESPONSIVE (2 per row on tablet, 1 per row on mobile) ===== */

@media (max-width: 1024px)
{
	.e-29143dff .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-29143dff .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-29143dff .head > .title
	{
		font-size: 24px;
	}
}

/* ===== END: section-popular-1 ===== */
/* ===== BEGIN: section-popular-2 ===== */

.e-29143e00
{
	display: block;
	width: 100%;
}

.e-29143e00 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEADER (bold dark title left, outline pill button right) ===== */

.e-29143e00 > .holder > .head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 24px;
}

.e-29143e00 .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 28px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-29143e00 .head > .more
{
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	padding: 10px 20px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	background: transparent;
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	color: var(--ot-text-1);
	transition: border-color 220ms ease, background 220ms ease;
}

.e-29143e00 .head > .more:hover
{
	border-color: var(--ot-text-1);
	background: var(--ot-bg-2);
}

/* ===== STAGE ===== */

.e-29143e00 .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-29143e00 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 34px;
}

.e-29143e00 .track
{
	display: flex;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (tall portrait, clean full-cover image, no overlay) ===== */

.e-29143e00 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 6.5));
	max-width: calc(100% / var(--per-view, 6.5));
	padding: 0 8px;
	box-sizing: border-box;
}

.e-29143e00 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.2;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(20, 18, 16, 0.16);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-29143e00 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 20px 44px rgba(20, 18, 16, 0.24);
}

.e-29143e00 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-29143e00 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== WHITE CAPSULE (centered pill with dark name, wraps to two lines) ===== */

.e-29143e00 .card > .card-capsule
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: calc(100% - 32px);
	padding: 12px 22px;
	background: white;
	border-radius: 100px;
	box-shadow: 0 8px 22px rgba(20, 18, 16, 0.18);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-29143e00 .card:hover > .card-capsule
{
	transform: translate(-50%, -50%) scale(1.05);
}

.e-29143e00 .card-name
{
	font-weight: 600;
	font-size: 16px;
	line-height: 1.25;
	text-align: center;
	color: var(--ot-text-1);
}

/* ===== ARROWS (circular, vertically centered over the edges) ===== */

.e-29143e00 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(28, 31, 38, 0.92);
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 10px 26px rgba(20, 18, 16, 0.28);
	transition: background 240ms ease, transform 240ms ease;
}

.e-29143e00 .arrow-prev
{
	left: 2px;
}

.e-29143e00 .arrow-next
{
	right: 2px;
}

.e-29143e00 .arrow:hover
{
	background: black;
	transform: translateY(-50%) scale(1.06);
}

.e-29143e00 .arrow > i
{
	font-size: 22px;
}

/* ===== PROGRESS BAR (bottom center) ===== */

.e-29143e00 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 26px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-29143e00 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--ot-text-1);
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-29143e00 .viewport { padding: 12px 26px; }
	.e-29143e00 .head > .title { font-size: 24px; }
	.e-29143e00 .card-name { font-size: 15px; }
}

@media (max-width: 640px)
{
	.e-29143e00 > .holder > .head
	{
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	.e-29143e00 .viewport { padding: 10px 16px; }
	.e-29143e00 .cell { padding: 0 6px; }
	.e-29143e00 .head > .title { font-size: 22px; }
	.e-29143e00 .arrow { width: 42px; height: 42px; }
	.e-29143e00 .progress { max-width: 78%; }
}

/* ===== END: section-popular-2 ===== */
/* ===== BEGIN: section-popular-destinations-1 ===== */

.e-75a6f7b
{
	display: block;
	width: 100%;
}

.e-75a6f7b > .holder
{
	width: 100%;
}

/* ===== HEADER (left aligned, dark blue) ===== */

.e-75a6f7b > .holder > .title
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #10285c;
}

.e-75a6f7b > .holder > .subtitle
{
	margin: 10px 0 0;
	text-align: left;
	font-weight: 400;
	font-size: 17px;
	line-height: 1.4;
	color: #10285c;
}

/* ===== GRID (row of 4 equal, equal-height cards) ===== */

.e-75a6f7b .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	margin-top: 32px;
}

/* ===== CARD (full-cover image, clickable, straps spill past edges) ===== */

.e-75a6f7b .card
{
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: visible;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 10px 28px rgba(16, 40, 92, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-75a6f7b .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 42px rgba(16, 40, 92, 0.22);
}

/* ===== CARD IMAGE (clean full-cover, own clip, gentle zoom on hover) ===== */

.e-75a6f7b .card > .card-image
{
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-75a6f7b .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== STRAPS (decorative overlay layer, whole card stays clickable) ===== */

.e-75a6f7b .card > .straps
{
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

/* Shared strap look — skewed parallelogram, sharp edges, right aligned */

.e-75a6f7b .straps > .strap
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: 0;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(16, 40, 92, 0.24);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-75a6f7b .straps .strap-text
{
	display: block;
	transform: skewX(14deg);
	text-align: center;
	color: white;
}

/* Upper strap — dark blue, shorter, shifted right, on top */

.e-75a6f7b .straps > .strap-name
{
	right: -14px;
	bottom: 44px;
	z-index: 3;
	padding: 8px 22px;
	background: #10285c;
	transform: skewX(-14deg);
}

.e-75a6f7b .strap-name > .strap-text
{
	font-weight: 800;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Lower strap — orange, wider, shifted left, overlaps the upper one */

.e-75a6f7b .straps > .strap-tags
{
	right: 6px;
	bottom: 20px;
	z-index: 2;
	padding: 6px 30px;
	background: var(--ot-orange);
	transform: skewX(-14deg);
}

.e-75a6f7b .strap-tags > .strap-text
{
	font-weight: 700;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Hover — straps slide slightly for a dynamic feel */

.e-75a6f7b .card:hover .strap-name
{
	transform: skewX(-14deg) translateX(-6px);
}

.e-75a6f7b .card:hover .strap-tags
{
	transform: skewX(-14deg) translateX(-10px);
}

/* ===== RESPONSIVE — 2 columns on tablet ===== */

@media (max-width: 1024px)
{
	.e-75a6f7b > .holder > .title
	{
		font-size: 28px;
	}

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

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-75a6f7b > .holder > .title
	{
		font-size: 24px;
	}

	.e-75a6f7b > .holder > .subtitle
	{
		font-size: 15px;
	}

	.e-75a6f7b .grid
	{
		grid-template-columns: 1fr;
		gap: 20px;
		margin-top: 24px;
	}

	.e-75a6f7b .card
	{
		aspect-ratio: 3 / 2;
	}
}

/* ===== END: section-popular-destinations-1 ===== */
/* ===== BEGIN: section-popular-destinations-2 ===== */

.e-75a6f7c
{
	display: block;
	width: 100%;
}

.e-75a6f7c > .holder
{
	width: 100%;
}

/* ===== HEADER (left aligned, dark blue) ===== */

.e-75a6f7c > .holder > .title
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: #10285c;
}

.e-75a6f7c > .holder > .subtitle
{
	margin: 10px 0 0;
	text-align: left;
	font-weight: 400;
	font-size: 17px;
	line-height: 1.4;
	color: #10285c;
}

/* ===== SLIDING ROW (marquee — single row scrolls right to left) ===== */

.e-75a6f7c .rows
{
	margin-top: 32px;
}

.e-75a6f7c .row
{
	overflow: hidden;
	padding: 12px 0;
}

.e-75a6f7c .track
{
	display: flex;
	gap: 24px;
	width: max-content;
	will-change: transform;
	animation: e-75a6f7c-left 90s linear infinite;
}

/* Pause on hover so a card can be read. */

.e-75a6f7c .rows:hover .track
{
	animation-play-state: paused;
}

@keyframes e-75a6f7c-left
{
	from
	{
		transform: translateX(0);
	}

	to
	{
		transform: translateX(-50%);
	}
}

/* Opt-in: obrnut smer klizanja (s leva na desno); prazan "direction" ostavlja zatecen smer. */

.e-75a6f7c .rows.is-right .track
{
	animation-direction: reverse;
}

/* ===== CARD (full-cover image, clickable, straps spill past edges) ===== */

.e-75a6f7c .card
{
	position: relative;
	flex: 0 0 auto;
	display: block;
	width: 300px;
	aspect-ratio: 4 / 5;
	overflow: visible;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	box-shadow: 0 10px 28px rgba(16, 40, 92, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-75a6f7c .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 42px rgba(16, 40, 92, 0.22);
}

/* ===== CARD IMAGE (clean full-cover, own clip, gentle zoom on hover) ===== */

.e-75a6f7c .card > .card-image
{
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-75a6f7c .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== STRAPS (decorative overlay layer, whole card stays clickable) ===== */

.e-75a6f7c .card > .straps
{
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

/* Shared strap look — skewed parallelogram, sharp edges, right aligned */

.e-75a6f7c .straps > .strap
{
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: 0;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(16, 40, 92, 0.24);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-75a6f7c .straps .strap-text
{
	display: block;
	transform: skewX(14deg);
	text-align: center;
	color: white;
}

/* Upper strap — dark blue, shorter, shifted right, on top */

.e-75a6f7c .straps > .strap-name
{
	right: -14px;
	bottom: 44px;
	z-index: 3;
	padding: 8px 22px;
	background: #10285c;
	transform: skewX(-14deg);
}

.e-75a6f7c .strap-name > .strap-text
{
	font-weight: 800;
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Lower strap — orange, wider, shifted left, overlaps the upper one */

.e-75a6f7c .straps > .strap-tags
{
	right: 6px;
	bottom: 20px;
	z-index: 2;
	padding: 6px 30px;
	background: var(--ot-orange);
	transform: skewX(-14deg);
}

.e-75a6f7c .strap-tags > .strap-text
{
	font-weight: 700;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* Hover — straps slide slightly for a dynamic feel */

.e-75a6f7c .card:hover .strap-name
{
	transform: skewX(-14deg) translateX(-6px);
}

.e-75a6f7c .card:hover .strap-tags
{
	transform: skewX(-14deg) translateX(-10px);
}

/* ===== RESPONSIVE — smaller cards on tablet ===== */

@media (max-width: 1024px)
{
	.e-75a6f7c > .holder > .title
	{
		font-size: 28px;
	}

	.e-75a6f7c .card
	{
		width: 260px;
	}
}

/* ===== RESPONSIVE — compact cards on mobile ===== */

@media (max-width: 640px)
{
	.e-75a6f7c > .holder > .title
	{
		font-size: 24px;
	}

	.e-75a6f7c > .holder > .subtitle
	{
		font-size: 15px;
	}

	.e-75a6f7c .rows
	{
		margin-top: 24px;
	}

	.e-75a6f7c .card
	{
		width: 210px;
	}
}

/* ===== END: section-popular-destinations-2 ===== */
/* ===== BEGIN: section-popular-destinations-3 (popularne destinacije — mreža 3x2 sa slikom i trakom) ===== */

.e-75a6f7d
{
	display: block;
	width: 100%;
}

.e-75a6f7d > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif) ===== */

.e-75a6f7d > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-75a6f7d > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== GRID (3 kolone x 2 reda, jednak razmak) ===== */

.e-75a6f7d > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (bela kartica, klikabilna, jednake visine) ===== */

.e-75a6f7d > .holder > .grid > .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-75a6f7d > .holder > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== IMAGE (fiksne proporcije, iste visine u svim karticama) ===== */

.e-75a6f7d > .holder > .grid > .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-75a6f7d > .holder > .grid > .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== FOOT (bela traka: tekst levo, strelica desno) ===== */

.e-75a6f7d > .holder > .grid > .card > .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	min-height: 76px;
	padding: 16px 18px;
	background: #ffffff;
}

.e-75a6f7d > .holder > .grid > .card > .card-foot > .card-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.e-75a6f7d > .holder > .grid > .card > .card-foot > .card-text > .card-name
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	color: #24303a;
}

.e-75a6f7d > .holder > .grid > .card > .card-foot > .card-text > .card-price
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--ot-text-2);
}

/* ===== ARROW (siva strelica, ista vertikalna linija u svim karticama) ===== */

.e-75a6f7d > .holder > .grid > .card > .card-foot > .card-arrow
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-3);
	transition: transform 220ms ease;
}

.e-75a6f7d > .holder > .grid > .card:hover > .card-foot > .card-arrow
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-75a6f7d > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-75a6f7d > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-75a6f7d > .holder > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-75a6f7d > .holder > .grid > .card > .card-foot
	{
		min-height: 72px;
		padding: 14px 16px;
	}

	.e-75a6f7d > .holder > .head > .title { font-size: 26px; }
	.e-75a6f7d > .holder > .grid > .card > .card-foot > .card-text > .card-name { font-size: 16px; }
}

/* ===== END: section-popular-destinations-3 ===== */
/* ===== BEGIN: section-popular-hotels-1 ===== */

.e-66516595
{
	display: block;
	width: 100%;
}

.e-66516595 > .holder
{
	width: 100%;
}

/* ===== LAYOUT: text left (narrow) + slider right (wide) ===== */

.e-66516595 .layout
{
	display: grid;
	grid-template-columns: minmax(260px, 340px) 1fr;
	gap: 40px;
	align-items: start;
}

/* ===== INTRO (left column) ===== */

.e-66516595 .intro > .eyebrow
{
	display: block;
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 20px;
	font-weight: 500;
	color: var(--ot-yellow, #ffd23f);
	letter-spacing: 0.01em;
}

.e-66516595 .intro > .title
{
	margin: 10px 0 0;
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-size: 40px;
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: white;
}

.e-66516595 .intro > .subtitle
{
	margin: 14px 0 0;
	font-size: 17px;
	font-weight: 700;
	color: white;
}

.e-66516595 .intro > .description
{
	margin: 14px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.8);
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-66516595 .stage
{
	position: relative;
	outline: none;
}

.e-66516595 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 0 40px;
}

.e-66516595 .track
{
	display: flex;
	align-items: flex-start;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (staggered portrait cards) ===== */

.e-66516595 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 0 10px;
	box-sizing: border-box;
}

.e-66516595 .cell:nth-child(even)
{
	margin-top: 38px;
}

.e-66516595 .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	text-decoration: none;
	background-color: var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(4, 12, 30, 0.35);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-66516595 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(4, 12, 30, 0.5);
}

/* ===== CARD IMAGE (full-cover, gentle zoom on hover) ===== */

.e-66516595 .card > .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-66516595 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== YELLOW PRICE BADGE (top-left, two lines) ===== */

.e-66516595 .card > .pill
{
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 8px 14px;
	background: var(--ot-yellow, #ffd23f);
	border-radius: 10px;
	box-shadow: 0 4px 12px rgba(4, 12, 30, 0.28);
}

.e-66516595 .pill > .pill-price
{
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.1;
	color: #1a1a1a;
	white-space: nowrap;
}

.e-66516595 .pill > .pill-unit
{
	font-size: 11px;
	font-weight: 500;
	line-height: 1.1;
	color: rgba(26, 26, 26, 0.75);
}

/* ===== FLOATING LIGHT BOTTOM BLOCK (name + yellow square chevron button) ===== */

.e-66516595 .card > .card-panel
{
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 14px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	background: #f7f8fb;
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(4, 12, 30, 0.28);
}

.e-66516595 .card-panel > .panel-name
{
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--ot-text-1);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.e-66516595 .card-panel > .panel-arrow
{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 8px;
	background: var(--ot-yellow, #ffd23f);
	color: #1a1a1a;
	font-size: 20px;
	line-height: 1;
	transition: background 240ms ease;
}

.e-66516595 .card:hover .panel-arrow
{
	background: var(--ot-yellow-hover, #ecc02f);
}

/* ===== CONTROLS (below slider, right aligned: prev / counter / next) ===== */

.e-66516595 .controls
{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 14px;
	margin-top: 4px;
}

.e-66516595 .controls > .counter
{
	font-size: 15px;
	font-weight: 700;
	color: white;
	min-width: 48px;
	text-align: center;
}

.e-66516595 .controls > .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 10px;
	border: 0;
	cursor: pointer;
	transition: background 240ms, color 240ms, transform 240ms;
}

.e-66516595 .controls > .arrow > i
{
	font-size: 24px;
	line-height: 1;
}

.e-66516595 .controls > .arrow-prev
{
	background: rgba(255, 255, 255, 0.14);
	color: rgba(255, 255, 255, 0.6);
}

.e-66516595 .controls > .arrow-prev:hover
{
	color: white;
}

.e-66516595 .controls > .arrow-next
{
	background: transparent;
	color: white;
	border: 2px solid rgba(255, 255, 255, 0.85);
}

.e-66516595 .controls > .arrow-next:hover
{
	transform: scale(1.06);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-66516595 .layout
	{
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.e-66516595 .intro > .title { font-size: 34px; }
}

@media (max-width: 640px)
{
	.e-66516595 .intro > .title { font-size: 28px; }
	.e-66516595 .cell { padding: 0 8px; }
	.e-66516595 .cell:nth-child(even) { margin-top: 0; }
	.e-66516595 .card-panel > .panel-name { font-size: 14px; }
}

/* ===== END: section-popular-hotels-1 ===== */
/* ===== BEGIN: section-popular-tabs-1 ===== */

.e-59f87b6c
{
	display: block;
	width: 100%;
	background: #f6f2ec;
	border-radius: var(--ot-radius-l);
}

.e-59f87b6c > .holder
{
	width: 100%;
	padding: 32px;
	box-sizing: border-box;
}

/* ===== HEAD (nadnaslov + naslov) ===== */

.e-59f87b6c .head
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-59f87b6c .overline
{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-2);
}

.e-59f87b6c .title
{
	font-size: 30px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== TABS (levo poravnati, aktivni ima debelu crvenu podvlaku) ===== */

.e-59f87b6c .tabs
{
	display: flex;
	gap: 24px;
	margin: 20px 0 24px;
	overflow-x: auto;
	scrollbar-width: none;
}

.e-59f87b6c .tabs::-webkit-scrollbar
{
	display: none;
}

.e-59f87b6c .tab
{
	position: relative;
	padding: 8px 0;
	background: none;
	border: 0;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	color: var(--ot-text-1);
	white-space: nowrap;
	cursor: pointer;
	transition: color 200ms ease;
}

.e-59f87b6c .tab:hover
{
	color: var(--ot-red);
}

.e-59f87b6c .tab.active
{
	font-weight: 800;
}

.e-59f87b6c .tab.active::after
{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--ot-red);
	border-radius: 2px;
}

/* ===== VIEWPORT + TRACK ===== */

.e-59f87b6c .viewport
{
	position: relative;
	overflow: hidden;
	padding: 8px 0;
}

.e-59f87b6c .track
{
	display: flex;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (razmak preko paddinga, kao destination-slider) ===== */

.e-59f87b6c .cell
{
	position: relative;
	z-index: 1;
	flex: 0 0 calc(100% / var(--per-view, 5.2));
	max-width: calc(100% / var(--per-view, 5.2));
	padding: 0 10px;
	box-sizing: border-box;
}

/* ===== CARD (bela, zaobljena, jednake visine) ===== */

.e-59f87b6c .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: white;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(20, 18, 16, 0.12);
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 300ms ease;
}

.e-59f87b6c .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.22);
}

/* ===== CARD IMAGE (zaobljeni gornji uglovi + zoom na hover) ===== */

.e-59f87b6c .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-59f87b6c .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== CARD TAG (bela pill oznaka let + smeštaj, gornji desni ugao) ===== */

.e-59f87b6c .card-tag
{
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 10px;
	background: white;
	border-radius: 999px;
	color: var(--ot-text-1);
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.16);
}

.e-59f87b6c .card-tag > i
{
	font-size: 16px;
}

/* ===== CARD BODY (naziv, zvezdice, donji red) ===== */

.e-59f87b6c .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	padding: 14px 16px 16px;
}

.e-59f87b6c .name
{
	font-size: 20px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-text-1);
}

.e-59f87b6c .stars
{
	display: flex;
	gap: 2px;
}

.e-59f87b6c .stars > i
{
	font-size: 16px;
	color: var(--ot-red);
	font-variation-settings: 'FILL' 1;
}

/* ===== BOTTOM (mesec/trajanje levo, cena desno — pinovan na dno) ===== */

.e-59f87b6c .bottom
{
	margin-top: auto;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
}

.e-59f87b6c .when
{
	display: flex;
	flex-direction: column;
}

.e-59f87b6c .month,
.e-59f87b6c .nights
{
	font-size: 13px;
	line-height: 1.3;
	color: var(--ot-text-2);
}

.e-59f87b6c .price
{
	display: flex;
	align-items: baseline;
	gap: 4px;
	white-space: nowrap;
}

.e-59f87b6c .from
{
	font-size: 12px;
	color: var(--ot-text-2);
}

.e-59f87b6c .value
{
	font-size: 20px;
	font-weight: 800;
	color: var(--ot-text-1);
}

.e-59f87b6c .unit
{
	font-size: 11px;
	color: var(--ot-text-2);
}

/* ===== ARROWS (kružne bele, sa strane, vertikalno centrirane) ===== */

.e-59f87b6c .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: white;
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.18);
	transition: background 240ms ease, color 240ms ease, transform 240ms ease;
}

.e-59f87b6c .arrow:hover
{
	background: var(--ot-text-1);
	color: white;
	transform: translateY(-50%) scale(1.06);
}

.e-59f87b6c .arrow > i
{
	font-size: 22px;
}

.e-59f87b6c .arrow-prev { left: 4px; }
.e-59f87b6c .arrow-next { right: 4px; }

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-59f87b6c .title { font-size: 26px; }
	.e-59f87b6c .name { font-size: 19px; }
}

@media (max-width: 640px)
{
	.e-59f87b6c > .holder { padding: 20px; }
	.e-59f87b6c .title { font-size: 23px; }
	.e-59f87b6c .arrow { width: 40px; height: 40px; }
}

/* Na dodir (bez hovera) nema pomeranja — kartica ostaje ravna. */

@media (hover: none)
{
	.e-59f87b6c .card:hover
	{
		transform: none;
		box-shadow: 0 8px 22px rgba(20, 18, 16, 0.12);
	}

	.e-59f87b6c .card:hover > .card-image
	{
		transform: none;
	}
}

/* ===== END: section-popular-tabs-1 ===== */
/* ===== BEGIN: section-popular-trips ===== */

.e-384dbe60
{
	display: block;
	width: 100%;
}

.e-384dbe60 > .holder
{
	width: 100%;
	outline: none;
}

/* ===== HEAD (levo poravnat, veliki bold tamni naslov) ===== */

.e-384dbe60 .head
{
	margin-bottom: 24px;
	padding: 0 8px;
}

.e-384dbe60 .title
{
	margin: 0;
	font-size: 34px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== STAGE ===== */

.e-384dbe60 .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-384dbe60 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 0;
}

.e-384dbe60 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (bela, uspravno naslagana, jednaka visina) ===== */

.e-384dbe60 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.2));
	max-width: calc(100% / var(--per-view, 3.2));
	padding: 0 8px;
	box-sizing: border-box;
}

.e-384dbe60 .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 6px 20px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-384dbe60 .card:hover
{
	transform: translateY(-5px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== MEDIA (slika sa zaobljenim gornjim uglovima + oznake) ===== */

.e-384dbe60 .card > .card-media
{
	position: relative;
	display: block;
	height: 200px;
	overflow: hidden;
}

.e-384dbe60 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-384dbe60 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== PILL (narandžasta oznaka gore levo) ===== */

.e-384dbe60 .card-media > .pill
{
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	background: var(--ot-orange);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.02em;
	line-height: 1;
	color: #ffffff;
}

/* ===== CODES (okrugli bedževi dole desno, kodovi aerodroma + avion) ===== */

.e-384dbe60 .card-media > .codes
{
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.e-384dbe60 .codes > .code
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	background: rgba(255, 255, 255, 0.94);
	border-radius: 50%;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: var(--ot-text-1);
	box-shadow: 0 2px 8px rgba(20, 18, 16, 0.16);
}

.e-384dbe60 .codes > .code-plane > i
{
	font-size: 16px;
	color: var(--ot-text-1);
}

/* ===== BODY (naziv, zemlja, opis, cena na dnu) ===== */

.e-384dbe60 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 16px 18px 18px;
}

.e-384dbe60 .card-body > .card-name
{
	font-size: 18px;
	font-weight: 800;
	line-height: 1.22;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

.e-384dbe60 .card-body > .card-country
{
	font-size: 13px;
	font-weight: 500;
	color: var(--ot-text-2);
}

.e-384dbe60 .card-body > .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 6px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-384dbe60 .card-body > .card-price
{
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 8px;
	width: 100%;
	margin-top: auto;
	padding-top: 14px;
}

.e-384dbe60 .card-price > .price-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-2);
}

.e-384dbe60 .card-price > .price
{
	font-size: 19px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
}

/* ===== CONTROLS (kružne strelice ispod kartica, desno) ===== */

.e-384dbe60 .controls
{
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-top: 22px;
	padding: 0 8px;
}

.e-384dbe60 .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 240ms ease, transform 240ms ease, opacity 240ms ease;
}

.e-384dbe60 .arrow:hover
{
	background: var(--ot-bg-3);
	transform: scale(1.05);
}

.e-384dbe60 .arrow[disabled]
{
	opacity: 0.4;
	cursor: default;
	pointer-events: none;
}

.e-384dbe60 .arrow > i
{
	font-size: 22px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-384dbe60 .title { font-size: 28px; }
	.e-384dbe60 .card-media { height: 180px; }
}

@media (max-width: 640px)
{
	.e-384dbe60 .title { font-size: 24px; }
	.e-384dbe60 .cell { padding: 0 6px; }
	.e-384dbe60 .card-media { height: 170px; }
	.e-384dbe60 .codes > .code { width: 27px; height: 27px; font-size: 9px; }
	.e-384dbe60 .arrow { width: 42px; height: 42px; }
}

/* ===== END: section-popular-trips ===== */
.e-de98707
{
	display: block;
	width: 100%;
}

.e-de98707 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
}

/* ===== FEATURED ===== */

.e-de98707 .featured
{
	display: block;
	width: 100%;
}

/* ===== GRID ===== */

.e-de98707 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px 28px;
}

.e-de98707 > .holder.cols-2 .grid { grid-template-columns: repeat(2, 1fr); }
.e-de98707 > .holder.cols-4 .grid { grid-template-columns: repeat(4, 1fr); }

.e-de98707 .card-link
{
	display: block;
}

/* card-blog je grid child preko .e-hash wrappera — spreči kolaps. */

.e-de98707 .grid .e-37934a4d,
.e-de98707 .featured .e-37934a4d
{
	min-width: 100%;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-de98707 > .holder.cols-4 .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px)
{
	.e-de98707 > .holder .grid,
	.e-de98707 > .holder.cols-2 .grid,
	.e-de98707 > .holder.cols-4 .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 28px 20px;
	}
}

@media (max-width: 600px)
{
	.e-de98707 > .holder .grid,
	.e-de98707 > .holder.cols-2 .grid,
	.e-de98707 > .holder.cols-4 .grid
	{
		grid-template-columns: 1fr;
	}
}
.e-90698cb
{
	display: block;
	width: 100%;
}

.e-90698cb > .holder
{
	position: relative;
	display: flex;
	align-items: center;
	overflow: hidden;
	min-height: 240px;
	border-radius: var(--ot-radius-l);
	color: white;
	cursor: pointer;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-90698cb > .holder:hover
{
	transform: translateY(-2px);
}

/* ===== TONE (puna boja) ===== */

.e-90698cb .tone-brand { background: linear-gradient(120deg, var(--ot-brand) 0%, var(--ot-brand-hover) 100%); }
.e-90698cb .tone-gold  { background: linear-gradient(120deg, rgba(205, 150, 45, 1) 0%, rgba(165, 115, 30, 1) 100%); }
.e-90698cb .tone-green { background: linear-gradient(120deg, rgba(25, 165, 105, 1) 0%, rgba(15, 125, 80, 1) 100%); }
.e-90698cb .tone-blue  { background: linear-gradient(120deg, rgba(35, 120, 210, 1) 0%, rgba(22, 90, 175, 1) 100%); }
.e-90698cb .tone-dark  { background: linear-gradient(120deg, rgba(38, 38, 42, 1) 0%, rgba(18, 18, 20, 1) 100%); }
.e-90698cb .tone-light { background: var(--ot-bg-2); color: var(--ot-text-1); }

/* ===== COVER (slika-pozadina) ===== */

.e-90698cb .cover
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	z-index: 0;
}

.e-90698cb .cover > .cover-overlay
{
	position: absolute;
	inset: 0;
}

.e-90698cb .has-background.align-left .cover > .cover-overlay
{
	background: linear-gradient(90deg, rgba(20, 18, 16, 0.78) 0%, rgba(20, 18, 16, 0.45) 55%, rgba(20, 18, 16, 0.15) 100%);
}

.e-90698cb .has-background.align-center .cover > .cover-overlay
{
	background: rgba(20, 18, 16, 0.55);
}

/* ===== CONTENT ===== */

.e-90698cb .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 44px 54px;
	max-width: 620px;
}

.e-90698cb .align-center .content
{
	margin: 0 auto;
	align-items: center;
	text-align: center;
}

.e-90698cb .eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: rgba(255, 255, 255, 0.92);
}

.e-90698cb .eyebrow > .eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: currentColor;
}

.e-90698cb .tone-light .eyebrow
{
	color: var(--ot-brand);
}

.e-90698cb .title
{
	font-family: var(--ot-font-secondary);
	font-size: 34px;
	font-weight: 500;
	letter-spacing: -0.022em;
	line-height: 1.08;
	color: inherit;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-90698cb .title em
{
	font-style: italic;
}

/* Globalna tema boji <em> u naslovu brand-plavom, pa na plavim tonovima nestaje na podlozi — isti obrazac kao cards/banner. */

.e-90698cb .tone-brand .title em,
.e-90698cb .tone-blue .title em
{
	color: white;
	opacity: 0.85;
}

.e-90698cb .description
{
	font-size: 15px;
	line-height: 1.55;
	color: inherit;
	opacity: 0.9;
	margin: 0;
}

.e-90698cb .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
	padding: 11px 22px;
	background: rgba(255, 255, 255, 0.96);
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-90698cb .cta > i
{
	font-size: 17px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-90698cb > .holder:hover .cta > i
{
	transform: translateX(4px);
}

/* ===== SIDE (slika desno — 60% tekst / 40% slika) ===== */

.e-90698cb .has-side
{
	padding-right: 40%;
}

.e-90698cb .side
{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
	width: 40%;
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.12);
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);

	/* Organska (blago talasasta) leva ivica: SVG maska nosi meku S-krivu koja se rasteže
	   preko cele visine (mask-size 100% 100%), pa zeleni panel iza .side viri kroz izrez
	   bez praznina i belih linija. Menja se ISKLJUČIVO leva ivica slike. */

	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20100%20100%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M30%200%20C%2010%2025%2050%2040%2022%2055%20C%202%2068%2040%2082%2020%20100%20L100%20100%20L100%200%20Z%22%20fill=%22black%22/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20100%20100%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M30%200%20C%2010%2025%2050%2040%2022%2055%20C%202%2068%2040%2082%2020%20100%20L100%20100%20L100%200%20Z%22%20fill=%22black%22/%3E%3C/svg%3E");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.e-90698cb > .holder:hover .side
{
	transform: scale(1.03);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-90698cb .content
	{
		padding: 36px 40px;
		max-width: 100%;
	}

	.e-90698cb .title
	{
		font-size: 28px;
	}

	.e-90698cb .has-side
	{
		padding-right: 0;
	}

	.e-90698cb .side
	{
		display: none;
	}
}

@media (max-width: 600px)
{
	.e-90698cb .content
	{
		padding: 30px 26px;
	}

	.e-90698cb .title
	{
		font-size: 24px;
	}

	.e-90698cb .description
	{
		font-size: 14px;
	}
}
/* ===== BEGIN: section-promo-2 ===== */

.e-90698ca
{
	display: block;
	width: 100%;
}

.e-90698ca > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov + podnaslov, levo poravnato) ===== */

.e-90698ca > .holder > .head
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 32px;
}

.e-90698ca .head > .title
{
	margin: 0;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
}

.e-90698ca .head > .subtitle
{
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ot-text-2);
}

/* ===== GRID (dve kartice, jednake širine i visine) ===== */

.e-90698ca .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: stretch;
	gap: 28px;
}

/* ===== KARTICA ===== */

.e-90698ca .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 12px;
	background: #ffffff;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	text-decoration: none;
	transition: transform 300ms ease, box-shadow 300ms ease;
}

.e-90698ca .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.1);
}

/* ===== SLIKA (blago uvučena, zaobljena, bez preliva) ===== */

.e-90698ca .card > .card-image
{
	display: block;
	overflow: hidden;
	border-radius: var(--ot-radius-m);
}

.e-90698ca .card .card-photo
{
	display: block;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-90698ca .card:hover .card-photo
{
	transform: scale(1.05);
}

/* ===== SADRŽAJ ===== */

.e-90698ca .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 14px;
	padding: 24px 16px 16px;
}

.e-90698ca .card .badge
{
	align-self: flex-start;
	padding: 6px 12px;
	background: color-mix(in srgb, var(--accent) 12%, transparent);
	border-radius: 100px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--accent);
}

.e-90698ca .card .card-title
{
	font-size: 24px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-90698ca .card .card-desc
{
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
	color: var(--ot-text-2);
}

/* ===== LINK SA STRELICOM (poravnat na dno) ===== */

.e-90698ca .card .card-link
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: auto;
	padding-top: 8px;
}

.e-90698ca .card .card-link-label
{
	font-size: 15px;
	font-weight: 700;
	color: var(--accent);
}

.e-90698ca .card .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--accent);
	color: #ffffff;
	transition: transform 260ms ease, filter 260ms ease;
}

.e-90698ca .card .arrow > i
{
	font-size: 18px;
	line-height: 1;
}

.e-90698ca .card:hover .arrow
{
	transform: translateX(4px);
	filter: brightness(0.9);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-90698ca .grid
	{
		grid-template-columns: 1fr;
	}
}

/* ===== END: section-promo-2 ===== */
/* ===== BEGIN: section-promo-banners-1 ===== */

.e-629ff9af
{
	display: block;
	width: 100%;
	--pb-dark: #24303a;
}

/* Pozadina sekcije (krem) dolazi iz section style.background full-bleed omotaca, ne odavde. */

.e-629ff9af > .holder
{
	width: 100%;
}

/* ===== BANERI (dva u redu, jednake sirine i visine) ===== */

.e-629ff9af > .holder > .banners
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	align-items: stretch;
	margin-bottom: 28px;
}

.e-629ff9af .banner
{
	position: relative;
	display: flex;
	min-height: 240px;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-629ff9af .banner:hover
{
	transform: translateY(-3px);
	box-shadow: 0 16px 34px rgba(36, 48, 58, 0.18);
}

/* Ogledalo drugog banera: obojena povrsina prelazi levo, fotografija desno. */

.e-629ff9af .banner.is-photo-right
{
	flex-direction: row-reverse;
}

.e-629ff9af .banner > .banner-photo
{
	display: block;
	flex: 1 1 50%;
	background-color: var(--ot-bg-2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-629ff9af .banner:hover > .banner-photo
{
	transform: scale(1.04);
}

.e-629ff9af .banner > .banner-pane
{
	position: relative;
	z-index: 1;
	display: flex;
	flex: 1 1 50%;
	align-items: center;
	padding: 26px 24px;
	background: var(--pane, #f5511e);
}

/* Talasasti oblik koji obojena povrsina potiskuje u sliku: krug preko ivice, boja kroz inherit. */

.e-629ff9af .banner .pane-wave
{
	position: absolute;
	top: -12%;
	left: -40px;
	display: block;
	width: 86px;
	height: 124%;
	border-radius: 50%;
	background-color: inherit;
}

.e-629ff9af .banner.is-photo-right .pane-wave
{
	left: auto;
	right: -40px;
}

.e-629ff9af .banner .pane-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Sites app gura serif na sve naslove, pa se sans-serif ovde postavlja eksplicitno. */

.e-629ff9af .banner .pane-price
{
	font-family: var(--ot-font-primary);
	font-size: 46px;
	font-weight: 800;
	line-height: 1.05;
	color: #ffffff;
}

.e-629ff9af .banner .pane-name
{
	margin-top: 6px;
	font-family: var(--ot-font-primary);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

.e-629ff9af .banner .pane-logo
{
	margin-top: 18px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
}

/* ===== PREDNOSTI (cetiri kartice u redu, ikonice poravnate na vrhu) ===== */

.e-629ff9af > .holder > .benefits
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	align-items: stretch;
}

.e-629ff9af .benefit
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	height: 100%;
	padding: 24px 22px;
	border-radius: 10px;
	background: #f3f3f3;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-629ff9af .benefit:hover
{
	background: #ececec;
}

/* Boja ikonice stize inline po kartici, kao u benefit-cards elementu. */

.e-629ff9af .benefit > .benefit-ico
{
	font-size: 34px;
	line-height: 1;
}

.e-629ff9af .benefit > .benefit-text
{
	margin-top: 14px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.45;
	color: var(--pb-dark);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-629ff9af > .holder > .benefits
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-629ff9af .banner .pane-price
	{
		font-size: 38px;
	}
}

@media (max-width: 860px)
{
	.e-629ff9af > .holder > .banners
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px)
{
	.e-629ff9af > .holder > .benefits
	{
		grid-template-columns: 1fr;
	}

	.e-629ff9af .banner
	{
		min-height: 200px;
	}
}

@media (max-width: 560px)
{
	.e-629ff9af .banner > .banner-pane
	{
		padding: 20px 18px;
	}

	.e-629ff9af .banner .pane-wave
	{
		width: 60px;
	}

	.e-629ff9af .banner .pane-price
	{
		font-size: 30px;
	}

	.e-629ff9af .banner .pane-name
	{
		font-size: 20px;
	}
}

/* ===== END: section-promo-banners-1 ===== */
/* ===== BEGIN: section-promo-cards ===== */

.e-51524bb5
{
	display: block;
	width: 100%;
}

.e-51524bb5 > .holder
{
	width: 100%;
}

/* ===== HEAD (centriran, bold tamni naslov srednje velicine) ===== */

.e-51524bb5 > .holder > .head
{
	margin-bottom: 26px;
	text-align: center;
}

.e-51524bb5 .title
{
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

/* ===== GRID (red od cetiri kartice jednake sirine i visine) ===== */

.e-51524bb5 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	align-items: stretch;
}

/* ===== CARD (bela, uspravno naslagana, jednaka visina) ===== */

.e-51524bb5 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.07);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-51524bb5 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(20, 18, 16, 0.14);
}

/* ===== MEDIA (slika na vrhu, zaobljeni gornji uglovi bez preliva) ===== */

.e-51524bb5 .card > .card-media
{
	position: relative;
	display: block;
	height: 180px;
	overflow: hidden;
}

.e-51524bb5 .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-51524bb5 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (bold tamni naslov + sivi opis, dno poravnato) ===== */

.e-51524bb5 .card > .card-body
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	padding: 18px;
}

.e-51524bb5 .card-body > .card-title
{
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-51524bb5 .card-body > .card-desc
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna) ===== */

@media (max-width: 900px)
{
	.e-51524bb5 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px)
{
	.e-51524bb5 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-51524bb5 .title
	{
		font-size: 24px;
	}
}

/* ===== END: section-promo-cards ===== */
/* ===== BEGIN: section-promo-mozaik-1 (promo mozaik plocica) ===== */

.e-27e4ae8b
{
	display: block;
	width: 100%;
}

.e-27e4ae8b > .holder
{
	width: 100%;
}

/* Naslov je podrazumevano prazan; kad se ukljuci mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-27e4ae8b > .holder > .title
{
	margin: 0 0 28px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-27e4ae8b > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Sirine kolona stizu inline kao --cols, pa media query moze da ih pregazi. */

.e-27e4ae8b > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	gap: 22px;
}

/* ===== VISINE REDOVA (unutar reda jednake, redovi namerno razliciti) ===== */

.e-27e4ae8b > .holder > .grid > .row > .tile
{
	height: 320px;
}

.e-27e4ae8b > .holder > .grid > .row:nth-of-type(1) > .tile
{
	height: 400px;
}

.e-27e4ae8b > .holder > .grid > .row:nth-of-type(2) > .tile
{
	height: 300px;
}

/* ===== TILE (klikabilan link, cela plocica je fotografija) ===== */

.e-27e4ae8b .tile
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	overflow: hidden;
	padding: 32px 24px 26px 24px;
	border-radius: 8px;
	background-color: var(--ot-bg-3);
	text-align: left;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-27e4ae8b .tile:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.e-27e4ae8b .tile > .tile-image
{
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-27e4ae8b .tile:hover > .tile-image
{
	transform: scale(1.06);
}

/* ===== OVERLAY (blag tamni prelaz radi citljivosti natpisa i dugmeta) ===== */

.e-27e4ae8b .tile > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.46) 0%, rgba(0, 0, 0, 0.16) 46%, rgba(0, 0, 0, 0.56) 100%);
	transition: opacity 360ms ease;
}

.e-27e4ae8b .tile:hover > .overlay
{
	opacity: 0.86;
}

/* ===== NATPIS (gornja zona, ista na svim plocicama) ===== */

.e-27e4ae8b .tile > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-width: calc(100% - 150px);
}

.e-27e4ae8b .tile > .content > .heading
{
	font-family: var(--ot-font-primary);
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #ffffff;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.e-27e4ae8b .tile > .content > .accent
{
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: #ffd400;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

/* ===== NALEPNICA (krug u gornjem desnom uglu, zuta ili koralna) ===== */

.e-27e4ae8b .tile > .badge
{
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 132px;
	height: 132px;
	padding: 14px;
	border-radius: 50%;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	box-shadow: 0 6px 16px rgba(15, 23, 42, 0.22);
}

.e-27e4ae8b .tile > .badge.tone-yellow
{
	background: #ffd400;
	color: #1b2430;
}

.e-27e4ae8b .tile > .badge.tone-coral
{
	background: #ff5a4d;
	color: #ffffff;
}

/* ===== ZUTO DUGME (prikovano na dno preko margin-top: auto) ===== */

.e-27e4ae8b .tile > .cta
{
	position: relative;
	z-index: 2;
	align-self: center;
	margin-top: auto;
	padding: 13px 26px;
	border-radius: 999px;
	background: #ffd400;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #1b2430;
	transition: background 260ms ease, transform 260ms ease;
}

.e-27e4ae8b .tile:hover > .cta
{
	background: #ffdf3d;
	transform: translateY(-2px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-27e4ae8b > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-27e4ae8b > .holder > .grid > .row > .tile,
	.e-27e4ae8b > .holder > .grid > .row:nth-of-type(1) > .tile,
	.e-27e4ae8b > .holder > .grid > .row:nth-of-type(2) > .tile
	{
		height: 290px;
	}

	.e-27e4ae8b > .holder > .title
	{
		font-size: 30px;
	}

	.e-27e4ae8b .tile > .content > .heading
	{
		font-size: 25px;
	}

	.e-27e4ae8b .tile > .content > .accent
	{
		font-size: 20px;
	}

	.e-27e4ae8b .tile > .badge
	{
		width: 116px;
		height: 116px;
		padding: 12px;
		font-size: 12px;
	}
}

@media (max-width: 640px)
{
	.e-27e4ae8b > .holder > .grid
	{
		gap: 18px;
	}

	.e-27e4ae8b > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-27e4ae8b > .holder > .grid > .row > .tile,
	.e-27e4ae8b > .holder > .grid > .row:nth-of-type(1) > .tile,
	.e-27e4ae8b > .holder > .grid > .row:nth-of-type(2) > .tile
	{
		height: 270px;
	}

	.e-27e4ae8b > .holder > .title
	{
		font-size: 26px;
	}

	.e-27e4ae8b .tile > .content
	{
		max-width: calc(100% - 130px);
	}

	.e-27e4ae8b .tile > .content > .heading
	{
		font-size: 23px;
	}

	.e-27e4ae8b .tile > .content > .accent
	{
		font-size: 19px;
	}

	.e-27e4ae8b .tile > .cta
	{
		padding: 12px 22px;
		font-size: 13px;
	}
}

/* ===== END: section-promo-mozaik-1 ===== */
/* ===== BEGIN: section-recommend-1 ===== */

.e-25ee86a2
{
	display: block;
	width: 100%;
}

.e-25ee86a2 > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold dark title + short thick yellow underline) ===== */

.e-25ee86a2 > .holder > .head
{
	margin-bottom: 24px;
}

.e-25ee86a2 .head > .title
{
	display: inline-block;
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-25ee86a2 .head > .title::after
{
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 10px;
	background: #f5c518;
	border-radius: 100px;
}

/* ===== STAGE / VIEWPORT / TRACK ===== */

.e-25ee86a2 .stage
{
	position: relative;
	outline: none;
}

.e-25ee86a2 .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 8px;
}

.e-25ee86a2 .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (equal height content cards) ===== */

.e-25ee86a2 .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3.3));
	max-width: calc(100% / var(--per-view, 3.3));
	padding: 6px 10px;
	box-sizing: border-box;
}

.e-25ee86a2 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-25ee86a2 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE + OVERLAYS ===== */

.e-25ee86a2 .card > .card-image
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
}

.e-25ee86a2 .card-image > .badges
{
	position: absolute;
	top: 10px;
	left: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	max-width: calc(100% - 60px);
}

.e-25ee86a2 .badges > .badge
{
	display: inline-block;
	padding: 4px 10px;
	background: white;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
	box-shadow: 0 2px 8px rgba(20, 18, 16, 0.12);
}

.e-25ee86a2 .card-image > .fav
{
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	background: white;
	border-radius: 50%;
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.18);
	cursor: pointer;
	transition: transform 200ms ease;
}

.e-25ee86a2 .card-image > .fav:hover
{
	transform: scale(1.1);
}

.e-25ee86a2 .card-image > .fav > i
{
	font-size: 20px;
	line-height: 1;
	color: var(--ot-text-2);
	font-variation-settings: 'FILL' 0;
	transition: color 200ms ease;
}

.e-25ee86a2 .card-image > .fav.on > i
{
	color: var(--ot-red);
	font-variation-settings: 'FILL' 1;
}

.e-25ee86a2 .card-image > .rating
{
	position: absolute;
	left: 10px;
	bottom: 10px;
	display: inline-block;
	padding: 4px 10px;
	background: #1f9d55;
	border-radius: 100px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	color: white;
	box-shadow: 0 2px 8px rgba(20, 18, 16, 0.18);
}

/* ===== CARD BODY ===== */

.e-25ee86a2 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 8px;
	padding: 14px 16px 16px;
}

.e-25ee86a2 .meta
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-25ee86a2 .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.5em;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--ot-text-1);
}

/* ===== SUNS (category, filled orange + faded grey) ===== */

.e-25ee86a2 .suns
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.e-25ee86a2 .suns > .sun
{
	font-size: 18px;
	color: var(--ot-bg-3);
	font-variation-settings: 'FILL' 1;
}

.e-25ee86a2 .suns > .sun.on
{
	color: #f5a623;
}

/* ===== PRICE (bottom-aligned, right-aligned) ===== */

.e-25ee86a2 .price-wrap
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 3px;
	margin-top: auto;
	padding-top: 10px;
	text-align: right;
}

.e-25ee86a2 .price-row
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
}

.e-25ee86a2 .price-row > .price
{
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
	color: var(--ot-blue);
}

.e-25ee86a2 .price-row > .price-unit
{
	font-size: 12px;
	color: var(--ot-text-3);
}

.e-25ee86a2 .price-row > .info
{
	align-self: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	font-size: 10px;
	font-style: italic;
	font-weight: 700;
	line-height: 1;
	color: var(--ot-text-3);
}

.e-25ee86a2 .price-regular,
.e-25ee86a2 .price-lowest
{
	font-size: 11px;
	color: var(--ot-text-3);
}

.e-25ee86a2 .price-regular > s
{
	color: var(--ot-text-3);
}

/* ===== ARROWS (yellow circle, dark arrow, over the edges) ===== */

.e-25ee86a2 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: #f5c518;
	border: 0;
	border-radius: 50%;
	color: #1a1400;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 10px 24px rgba(20, 18, 16, 0.22);
	transition: background 220ms ease, transform 220ms ease;
}

.e-25ee86a2 .arrow-prev
{
	left: -6px;
}

.e-25ee86a2 .arrow-next
{
	right: -6px;
}

.e-25ee86a2 .arrow:hover
{
	background: #e0b30f;
	transform: translateY(-50%) scale(1.06);
}

.e-25ee86a2 .arrow > i
{
	font-size: 22px;
}

/* ===== PROGRESS BAR (bottom center, gold fill) ===== */

.e-25ee86a2 .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 22px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-25ee86a2 .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #f5c518;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-25ee86a2 .head > .title { font-size: 28px; }
}

@media (max-width: 640px)
{
	.e-25ee86a2 .head > .title { font-size: 24px; }
	.e-25ee86a2 .cell { padding: 6px 8px; }
	.e-25ee86a2 .arrow { width: 42px; height: 42px; }
	.e-25ee86a2 .progress { max-width: 78%; }
}

/* ===== END: section-recommend-1 ===== */
/* ===== BEGIN: section-resort-offers-1 ===== */

.e-2ddc47b9
{
	display: block;
	width: 100%;
	--resort-orange: #f5901e;
	--resort-orange-hover: #dd8016;
	--resort-coral: #e5484d;
	--resort-dark: #1f2937;
	--resort-grey: #6b7280;
	--resort-line: #e6e1d8;
}

.e-2ddc47b9 > .holder
{
	width: 100%;
}

/* ===== HEADER (opcioni naslov iznad liste) ===== */

.e-2ddc47b9 > .holder > .head
{
	margin-bottom: 24px;
	text-align: left;
}

.e-2ddc47b9 .title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 36px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--resort-dark);
}

/* ===== LISTA (kartice pune sirine, jedna ispod druge) ===== */

.e-2ddc47b9 .list
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-2ddc47b9 .card
{
	display: block;
	width: 100%;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
	overflow: hidden;
}

/* ===== TRAKA (narandzasta, puna sirina kartice) ===== */

.e-2ddc47b9 .strip
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 22px;
	background: var(--resort-orange);
	color: #ffffff;
}

.e-2ddc47b9 .strip-brand
{
	font-family: var(--ot-font-secondary);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.e-2ddc47b9 .strip-icon
{
	font-size: 19px;
	flex-shrink: 0;
}

.e-2ddc47b9 .strip-text
{
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
}

/* ===== TELO (tri kolone poravnate po vrhu) ===== */

.e-2ddc47b9 .body
{
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr) 250px;
	align-items: stretch;
	gap: 22px;
	padding: 20px 22px;
}

/* ===== LEVA KOLONA (slika fiksnih proporcija) ===== */

.e-2ddc47b9 .col-media
{
	display: block;
	align-self: start;
	width: 100%;
}

.e-2ddc47b9 .media-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 10px;
	background-color: rgba(31, 41, 55, 0.12);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

/* ===== SREDNJA KOLONA (podaci o hotelu) ===== */

.e-2ddc47b9 .col-info
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 7px;
	min-width: 0;
}

.e-2ddc47b9 .tag
{
	display: inline-block;
	padding: 4px 11px;
	border-radius: 100px;
	background: #4b5563;
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #ffffff;
}

.e-2ddc47b9 .name
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--resort-dark);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-2ddc47b9 .name:hover
{
	color: var(--resort-orange);
}

.e-2ddc47b9 .location
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	color: var(--resort-grey);
}

/* ===== OCENE (sunca + zvezdica + recenzije) ===== */

.e-2ddc47b9 .ratings
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 3px;
}

.e-2ddc47b9 .suns
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--resort-orange);
}

.e-2ddc47b9 .suns > i
{
	font-size: 19px;
}

.e-2ddc47b9 .score
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	color: var(--resort-dark);
}

.e-2ddc47b9 .score > i
{
	font-size: 18px;
	color: var(--resort-grey);
}

/* ===== KARAKTERISTIKE (sive tackice) ===== */

.e-2ddc47b9 .features
{
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-top: 6px;
}

.e-2ddc47b9 .feature
{
	position: relative;
	padding-left: 16px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--resort-grey);
}

.e-2ddc47b9 .feature::before
{
	content: '';
	position: absolute;
	top: 8px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #b4b8c0;
}

/* ===== POPUST (koralni red, prikazan samo kad postoji) ===== */

.e-2ddc47b9 .promo
{
	display: flex;
	align-items: center;
	gap: 9px;
	margin-top: 10px;
}

.e-2ddc47b9 .promo-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	flex-shrink: 0;
	border-radius: 6px;
	background: var(--resort-coral);
	color: #ffffff;
}

.e-2ddc47b9 .promo-icon > i
{
	font-size: 16px;
}

.e-2ddc47b9 .promo-text
{
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--resort-coral);
}

/* ===== DESNA KOLONA (cena i dugme, odvojena tankom linijom) ===== */

.e-2ddc47b9 .col-price
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	padding-left: 22px;
	border-left: 1px solid var(--resort-line);
	text-align: center;
}

.e-2ddc47b9 .price-note
{
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--resort-grey);
}

.e-2ddc47b9 .price-details
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	font-family: var(--ot-font-primary);
	font-size: 13px;
	font-weight: 600;
	color: var(--resort-orange);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-2ddc47b9 .price-details > i
{
	font-size: 17px;
}

.e-2ddc47b9 .price-details:hover
{
	color: var(--resort-orange-hover);
}

.e-2ddc47b9 .price-old
{
	margin-top: 6px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 400;
	color: var(--resort-grey);
	text-decoration: line-through;
}

.e-2ddc47b9 .price-new
{
	font-family: var(--ot-font-secondary);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--resort-coral);
}

.e-2ddc47b9 .price-person
{
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 400;
	color: var(--resort-grey);
}

/* Prostor iznad dugmeta se rasteze da dugme uvek stoji na dnu kolone. */

.e-2ddc47b9 .price-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding: 13px 34px;
	border-radius: 100px;
	background: var(--resort-orange);
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #ffffff;
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--ot-transition);
}

.e-2ddc47b9 .price-button:hover
{
	background: var(--resort-orange-hover);
}

/* ===== RESPONSIVE (tablet: kolona sa cenom ide ispod; mobilni: sve u koloni) ===== */

@media (max-width: 1024px)
{
	.e-2ddc47b9 .title
	{
		font-size: 30px;
	}

	.e-2ddc47b9 .body
	{
		grid-template-columns: 260px minmax(0, 1fr);
	}

	.e-2ddc47b9 .col-price
	{
		grid-column: 1 / -1;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 12px;
		padding-top: 16px;
		padding-left: 0;
		border-top: 1px solid var(--resort-line);
		border-left: none;
		text-align: left;
	}

	.e-2ddc47b9 .price-old
	{
		margin-top: 0;
	}

	.e-2ddc47b9 .price-button
	{
		margin-top: 0;
		margin-left: auto;
	}
}

@media (max-width: 640px)
{
	.e-2ddc47b9 .title
	{
		font-size: 26px;
	}

	.e-2ddc47b9 .strip
	{
		flex-wrap: wrap;
		gap: 7px;
		padding: 11px 16px;
	}

	.e-2ddc47b9 .strip-text
	{
		font-size: 14px;
	}

	.e-2ddc47b9 .body
	{
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
		padding: 16px;
	}

	.e-2ddc47b9 .name
	{
		font-size: 21px;
	}

	.e-2ddc47b9 .col-price
	{
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.e-2ddc47b9 .price-button
	{
		width: 100%;
		margin-left: 0;
	}
}

/* ===== END: section-resort-offers-1 ===== */
/* ===== BEGIN: section-route-cards-1 ===== */

.e-2aaf3c7b
{
	display: block;
	width: 100%;
}

.e-2aaf3c7b > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned, optional) ===== */

.e-2aaf3c7b > .holder > .title
{
	margin: 0 0 32px;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (4 columns, equal gap) ===== */

.e-2aaf3c7b .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-2aaf3c7b .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-2aaf3c7b .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.16);
}

/* ===== TRIP CARD (dark antracit body) ===== */

.e-2aaf3c7b .card.trip
{
	background: #1f2430;
}

/* ===== CARD MAP (route map placeholder + heart) ===== */

.e-2aaf3c7b .card.trip > .card-map
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: #dbeef7;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-2aaf3c7b .card-map > .card-heart
{
	position: absolute;
	top: 10px;
	right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: white;
	border-radius: 50%;
	box-shadow: 0 2px 6px rgba(20, 18, 16, 0.18);
}

.e-2aaf3c7b .card-heart > i
{
	font-size: 18px;
	line-height: 1;
	color: #1f2430;
}

/* ===== CARD BODY (flex column, bottom block pinned) ===== */

.e-2aaf3c7b .card.trip > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	gap: 10px;
	padding: 16px;
	min-width: 0;
	color: white;
}

/* ===== RATING ROW (yellow star + white value + grey reviews) ===== */

.e-2aaf3c7b .card-body > .rating
{
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.e-2aaf3c7b .rating > i
{
	font-size: 18px;
	line-height: 1;
	color: #f5c518;
}

.e-2aaf3c7b .rating > .rating-value
{
	font-size: 14px;
	font-weight: 700;
	color: white;
}

.e-2aaf3c7b .rating > .reviews
{
	font-size: 13px;
	color: rgba(255, 255, 255, 0.6);
}

/* ===== TRIP NAME (bold white, 1-2 lines) ===== */

.e-2aaf3c7b .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: white;
}

/* ===== META ROW (clock + duration, pin + countries) ===== */

.e-2aaf3c7b .card-body > .meta
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 16px;
	min-width: 0;
}

.e-2aaf3c7b .meta > .meta-item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.7);
}

.e-2aaf3c7b .meta-item > i
{
	font-size: 16px;
	line-height: 1;
	color: rgba(255, 255, 255, 0.5);
}

/* ===== TAGS (gold + grey pills) ===== */

.e-2aaf3c7b .card-body > .tags
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	min-width: 0;
}

.e-2aaf3c7b .tags > .tag
{
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.3;
	white-space: nowrap;
}

.e-2aaf3c7b .tags > .tag.gold
{
	background: #f5c518;
	color: #1c1a12;
}

.e-2aaf3c7b .tags > .tag.grey
{
	background: rgba(255, 255, 255, 0.12);
	color: rgba(255, 255, 255, 0.85);
}

/* ===== PHYSICAL RATING (label + 5-segment scale) ===== */

.e-2aaf3c7b .card-body > .physical
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	box-sizing: border-box;
	padding: 5px 10px;
	background: rgba(255, 255, 255, 0.08);
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	color: rgba(255, 255, 255, 0.7);
}

.e-2aaf3c7b .physical > .scale
{
	display: flex;
	gap: 3px;
}

.e-2aaf3c7b .scale > .seg
{
	width: 12px;
	height: 6px;
	border-radius: 2px;
	border: 1px solid rgba(255, 255, 255, 0.4);
}

.e-2aaf3c7b .scale > .seg.filled
{
	background: white;
	border-color: white;
}

/* ===== COMPARE BUTTON (translucent outline pill) ===== */

.e-2aaf3c7b .card-body > .compare
{
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 4px;
	padding: 6px 14px;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 999px;
	font-size: 12px;
	color: white;
	transition: background 200ms ease, border-color 200ms ease;
}

.e-2aaf3c7b .card.trip:hover .compare
{
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.6);
}

.e-2aaf3c7b .compare > i
{
	font-size: 16px;
	line-height: 1;
}

/* ===== SPACER (stretches so the bottom block pins to the bottom) ===== */

.e-2aaf3c7b .card-body > .spacer,
.e-2aaf3c7b .cta-body > .spacer
{
	flex: 1;
	min-height: 8px;
}

/* ===== DIVIDER ===== */

.e-2aaf3c7b .card-body > .divider
{
	height: 1px;
	background: rgba(255, 255, 255, 0.15);
}

/* ===== FOOTER (code left + price block right) ===== */

.e-2aaf3c7b .card-body > .footer
{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 8px;
	min-width: 0;
}

.e-2aaf3c7b .footer > .code
{
	font-size: 11px;
	color: rgba(255, 255, 255, 0.5);
}

.e-2aaf3c7b .footer > .price-block
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
	min-width: 0;
}

.e-2aaf3c7b .price-block > .price-prefix
{
	font-size: 11px;
	color: rgba(255, 255, 255, 0.7);
}

.e-2aaf3c7b .price-block > .price
{
	font-size: 20px;
	font-weight: 800;
	line-height: 1.1;
	color: white;
	white-space: nowrap;
}

.e-2aaf3c7b .price-block > .price-note
{
	font-size: 10px;
	color: rgba(255, 255, 255, 0.5);
}

/* ===== CTA CARD (light, photo + title + text + full-width black button) ===== */

.e-2aaf3c7b .card.cta
{
	background: white;
	border: 1px solid var(--ot-bg-3-border);
}

.e-2aaf3c7b .card.cta > .cta-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-2aaf3c7b .card.cta > .cta-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	gap: 8px;
	padding: 16px;
	min-width: 0;
}

.e-2aaf3c7b .cta-body > .cta-title
{
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-2aaf3c7b .cta-body > .cta-text
{
	font-size: 13px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.e-2aaf3c7b .cta-body > .cta-button
{
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 12px;
	background: #111;
	border-radius: var(--ot-radius-s);
	font-size: 14px;
	font-weight: 700;
	text-align: center;
	color: white;
	transition: background 200ms ease;
}

.e-2aaf3c7b .card.cta:hover .cta-button
{
	background: #2a2a2a;
}

/* ===== FOOT (results count + more button, centered) ===== */

.e-2aaf3c7b > .holder > .foot
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
}

.e-2aaf3c7b .foot > .results
{
	font-size: 13px;
	color: var(--ot-text-3);
}

.e-2aaf3c7b .foot > .more
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 22px;
	background: transparent;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 999px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 200ms ease, border-color 200ms ease;
}

.e-2aaf3c7b .foot > .more:hover
{
	background: var(--ot-bg-2);
	border-color: var(--ot-text-3);
}

.e-2aaf3c7b .more > i
{
	font-size: 18px;
	line-height: 1;
}

/* ===== RESPONSIVE ===== */

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

@media (max-width: 640px)
{
	.e-2aaf3c7b .grid
	{
		grid-template-columns: 1fr;
	}

	.e-2aaf3c7b > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-route-cards-1 ===== */
/* ===== BEGIN: section-safety-guarantee-1 ===== */

.e-4ee9ca2f
{
	display: block;
	width: 100%;
	--guarantee-outline: #c2703a;
	--guarantee-ink: #14243d;
}

/* Kontejner nosi svetlo sivo plavu pozadinu i izrazeno zaobljene uglove (uvucen od ivica ekrana). */

.e-4ee9ca2f > .holder
{
	width: 100%;
	padding: 52px 48px;
	border-radius: 32px;
	background: #e8eef5;
}

/* ===== ZONES (levo tekst, desno velika slika) ===== */

.e-4ee9ca2f > .holder > .zones
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	gap: 48px;
}

/* ===== LEVA ZONA (tekst, vertikalno centriran) ===== */

.e-4ee9ca2f .zone-text
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	min-width: 0;
}

.e-4ee9ca2f .title
{
	margin: 0 0 14px;
	font-family: var(--ot-font-secondary);
	font-size: 42px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--guarantee-ink);
}

.e-4ee9ca2f .subtitle
{
	margin: 0 0 18px;
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--guarantee-ink);
}

.e-4ee9ca2f .text
{
	margin: 0 0 16px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.85;
	color: #334155;
}

.e-4ee9ca2f .text > span > b
{
	font-weight: 700;
	color: var(--guarantee-ink);
}

/* ===== DUGME (providna pozadina, tanak narandzasti okvir, pill) ===== */

.e-4ee9ca2f .button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 10px;
	padding: 13px 26px;
	border: 1px solid var(--guarantee-outline);
	border-radius: 100px;
	background: transparent;
	color: var(--guarantee-ink);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-4ee9ca2f .button:hover
{
	background: var(--guarantee-outline);
	color: #ffffff;
}

/* ===== DESNA ZONA (velika slika, prati visinu tekstualnog bloka) ===== */

.e-4ee9ca2f .zone-media
{
	min-width: 0;
}

.e-4ee9ca2f .media-image
{
	display: block;
	width: 100%;
	height: 100%;
	min-height: 420px;
	background-color: rgba(20, 36, 61, 0.08);
	background-size: cover;
	background-position: center;
	border-radius: 24px;
}

/* ===== RESPONSIVE (slika gore pune sirine, tekst ispod) ===== */

@media (max-width: 900px)
{
	.e-4ee9ca2f > .holder
	{
		padding: 40px 32px;
	}

	.e-4ee9ca2f > .holder > .zones
	{
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.e-4ee9ca2f .zone-media
	{
		order: -1;
	}

	.e-4ee9ca2f .media-image
	{
		min-height: 300px;
	}

	.e-4ee9ca2f .title
	{
		font-size: 34px;
	}
}

@media (max-width: 560px)
{
	.e-4ee9ca2f > .holder
	{
		padding: 28px 20px;
		border-radius: 24px;
	}

	.e-4ee9ca2f .title
	{
		font-size: 28px;
	}

	.e-4ee9ca2f .subtitle
	{
		font-size: 16px;
	}

	.e-4ee9ca2f .media-image
	{
		min-height: 220px;
		border-radius: 18px;
	}

	.e-4ee9ca2f .button
	{
		width: 100%;
	}
}

/* ===== END: section-safety-guarantee-1 ===== */
/* ===== BEGIN: section-sale-banner-1 ===== */

.e-756a8ca8
{
	display: block;
	width: 100%;
	--sb-navy: #141e5a;
	--sb-yellow: #ffd400;
	--sb-blue: #1f5fc0;
	--sb-wave: 90px;
	--sb-teeth: 18px;
}

/* ===== HOLDER (cela povrsina je jedan klikabilan baner) ===== */

.e-756a8ca8 > .holder
{
	position: relative;
	display: block;
	overflow: hidden;
	width: 100%;
	min-height: 460px;
	color: #ffffff;
	text-decoration: none;
}

/* ===== POZADINA (fotografija sarene pijace) ===== */

.e-756a8ca8 > .holder > .cover
{
	position: absolute;
	inset: 0;
	display: block;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 600ms ease;
}

.e-756a8ca8 > .holder:hover > .cover
{
	transform: scale(1.04);
}

/* ===== ZATAMNJENJE (da natpisi preko fotografije ostanu citljivi) ===== */

.e-756a8ca8 > .holder > .scrim
{
	position: absolute;
	inset: 0;
	display: block;
	background: linear-gradient(90deg, rgba(10, 16, 48, 0.55) 0%, rgba(10, 16, 48, 0.3) 55%, rgba(10, 16, 48, 0.45) 100%);
}

/* ===== SADRZAJ (plocica i nalepnica grupisane u sredini) ===== */

.e-756a8ca8 > .holder > .content
{
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 30px;
	min-height: 460px;
	padding: 60px 40px calc(var(--sb-wave) + 20px);
}

/* ===== ZUTA PLOCICA (nazubljena gornja ivica kao tenda na pijaci) ===== */

.e-756a8ca8 > .holder > .content > .plate
{
	position: relative;
	display: block;
	max-width: 520px;
	padding: calc(var(--sb-teeth) + 26px) 36px 30px;
	background: var(--sb-yellow);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2018%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2018%20L12%200%20L24%2018%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	-webkit-mask-size: 24px var(--sb-teeth), 100% calc(100% - var(--sb-teeth));
	-webkit-mask-position: top left, bottom left;
	-webkit-mask-repeat: repeat-x, no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2018%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2018%20L12%200%20L24%2018%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	mask-size: 24px var(--sb-teeth), 100% calc(100% - var(--sb-teeth));
	mask-position: top left, bottom left;
	mask-repeat: repeat-x, no-repeat;
	color: var(--sb-navy);
	font-family: var(--ot-font-primary);
	font-size: 44px;
	font-weight: 900;
	line-height: 1.06;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

/* ===== NALEPNICA (tamnoplavi cenovnik, zakrivljen i sa probusenom rupicom) ===== */

.e-756a8ca8 > .holder > .content > .tag
{
	position: relative;
	display: block;
	flex: 0 0 auto;
	width: 210px;
	padding: 46px 18px 26px;
	background: var(--sb-navy);
	text-align: center;
	transform: rotate(-8deg);
	clip-path: polygon(0 20px, 20px 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
	-webkit-mask-image: radial-gradient(circle 9px at 50% 28px, rgba(0, 0, 0, 0) 99%, #000000 100%);
	mask-image: radial-gradient(circle 9px at 50% 28px, rgba(0, 0, 0, 0) 99%, #000000 100%);
	box-shadow: 0 10px 26px rgba(10, 16, 48, 0.35);
}

.e-756a8ca8 > .holder > .content > .tag > .tag-hole
{
	position: absolute;
	top: 17px;
	left: 50%;
	display: block;
	width: 22px;
	height: 22px;
	margin-left: -11px;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
}

.e-756a8ca8 > .holder > .content > .tag > .tag-label
{
	display: block;
	color: var(--sb-yellow);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 2.4px;
	text-transform: uppercase;
}

.e-756a8ca8 > .holder > .content > .tag > .tag-value
{
	display: block;
	margin-top: 8px;
	color: #ffffff;
	font-size: 27px;
	font-weight: 900;
	line-height: 1.15;
}

/* ===== NALEPNICA SA RECENICOM (opciono; manji font u vise redova, siri cenovnik) ===== */

.e-756a8ca8 > .holder > .content > .tag.is-text
{
	width: 250px;
}

.e-756a8ca8 > .holder > .content > .tag.is-text > .tag-value
{
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
}

/* ===== TALAS (plava traka koja seva u fotografiju i naleze na sledecu sekciju) ===== */

.e-756a8ca8 > .holder > .wave
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	display: block;
	height: var(--sb-wave);
	background: var(--sb-blue);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20160%2040%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2040%20L0%2020%20C%2026%200%2054%2040%2080%2020%20C%20106%200%20134%2040%20160%2020%20L160%2040%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	-webkit-mask-size: 160px 40px, 100% calc(100% - 40px);
	-webkit-mask-position: top left, bottom left;
	-webkit-mask-repeat: repeat-x, no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20160%2040%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%2040%20L0%2020%20C%2026%200%2054%2040%2080%2020%20C%20106%200%20134%2040%20160%2020%20L160%2040%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	mask-size: 160px 40px, 100% calc(100% - 40px);
	mask-position: top left, bottom left;
	mask-repeat: repeat-x, no-repeat;
}

/* ===== TABLET (puna sirina ostaje, plocica i nalepnica se smanjuju ali stoje jedna uz drugu) ===== */

@media (max-width: 1024px)
{
	.e-756a8ca8
	{
		--sb-wave: 74px;
	}

	.e-756a8ca8 > .holder
	{
		min-height: 400px;
	}

	.e-756a8ca8 > .holder > .content
	{
		gap: 22px;
		min-height: 400px;
		padding: 44px 28px calc(var(--sb-wave) + 16px);
	}

	.e-756a8ca8 > .holder > .content > .plate
	{
		max-width: 380px;
		padding: calc(var(--sb-teeth) + 20px) 26px 24px;
		font-size: 32px;
	}

	.e-756a8ca8 > .holder > .content > .tag
	{
		width: 168px;
		padding: 42px 14px 22px;
	}

	.e-756a8ca8 > .holder > .content > .tag > .tag-value
	{
		font-size: 22px;
	}

	.e-756a8ca8 > .holder > .content > .tag.is-text
	{
		width: 220px;
	}

	.e-756a8ca8 > .holder > .content > .tag.is-text > .tag-value
	{
		font-size: 17px;
	}
}

/* ===== MOBILNI (nizi baner, plocica i nalepnica jedna ispod druge, talas i dalje na dnu) ===== */

@media (max-width: 640px)
{
	.e-756a8ca8
	{
		--sb-wave: 56px;
		--sb-teeth: 14px;
	}

	.e-756a8ca8 > .holder
	{
		min-height: 360px;
	}

	.e-756a8ca8 > .holder > .content
	{
		flex-direction: column;
		gap: 18px;
		min-height: 360px;
		padding: 32px 20px calc(var(--sb-wave) + 14px);
	}

	.e-756a8ca8 > .holder > .content > .plate
	{
		max-width: 100%;
		padding: calc(var(--sb-teeth) + 16px) 22px 20px;
		font-size: 25px;
	}

	.e-756a8ca8 > .holder > .content > .tag
	{
		width: 152px;
		padding: 38px 12px 18px;
	}

	.e-756a8ca8 > .holder > .content > .tag > .tag-label
	{
		font-size: 12px;
	}

	.e-756a8ca8 > .holder > .content > .tag > .tag-value
	{
		font-size: 20px;
	}

	.e-756a8ca8 > .holder > .content > .tag.is-text
	{
		width: 210px;
	}

	.e-756a8ca8 > .holder > .content > .tag.is-text > .tag-value
	{
		font-size: 16px;
	}
}

/* ===== END: section-sale-banner-1 ===== */
/* ===== BEGIN: section-search-results-1 ===== */

.e-aa5fc33
{
	display: block;
	width: 100%;
	--sr-navy: #16294d;
	--sr-grey: #6b7280;
	--sr-blue: #2f6feb;
	--sr-red: #e4002b;
	--sr-green: #148f5f;
	--sr-dot: #d8dee7;
	--sr-pink: #e6197d;
	--sr-line: #e6eaf0;
}

.e-aa5fc33 .holder
{
	display: flex;
	flex-direction: column;
	gap: 26px;
	width: 100%;
}

.e-aa5fc33 .head
{
	display: block;
	width: 100%;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-aa5fc33 .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--sr-navy);
}

/* grid-auto-rows: 1fr izjednacava visine kartica u OBA reda, ne samo unutar jednog. */

.e-aa5fc33 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 26px 24px;
	width: 100%;
}

.e-aa5fc33 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(16, 24, 40, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-aa5fc33 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(16, 24, 40, 0.16);
}

.e-aa5fc33 .card > .media
{
	position: relative;
	display: block;
	height: 200px;
	overflow: hidden;
}

.e-aa5fc33 .media > .media-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-aa5fc33 .card:hover .media-image
{
	transform: scale(1.05);
}

.e-aa5fc33 .media > .brand
{
	position: absolute;
	top: 14px;
	left: 14px;
	max-width: calc(100% - 28px);
	padding: 6px 12px;
	border-radius: 4px;
	background-color: var(--sr-navy);
	box-shadow: 0 6px 14px rgba(20, 18, 16, 0.22);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.05em;
	line-height: 1.2;
	color: #ffffff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-aa5fc33 .card > .offer
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 38px;
	padding: 8px 14px;
	background: var(--sr-red);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: #ffffff;
	text-align: center;
}

.e-aa5fc33 .offer > i
{
	font-size: 17px;
	line-height: 1;
}

.e-aa5fc33 .card > .info
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 16px 18px 18px;
}

.e-aa5fc33 .info > .name-row
{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
}

.e-aa5fc33 .name-row > .name
{
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--sr-navy);
	text-decoration: none;
}

.e-aa5fc33 .name-row > .name:hover
{
	color: var(--sr-blue);
}

.e-aa5fc33 .name-row > .heart
{
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 1px solid var(--sr-line);
	border-radius: 50%;
	background: #ffffff;
	font-size: 17px;
	line-height: 1;
	color: var(--sr-grey);
	cursor: pointer;
	transition: color var(--ot-transition), border-color var(--ot-transition);
}

.e-aa5fc33 .name-row > .heart:hover
{
	border-color: var(--sr-pink);
	color: var(--sr-pink);
}

.e-aa5fc33 .name-row > .heart.is-liked
{
	border-color: var(--sr-pink);
	color: var(--sr-pink);
}

.e-aa5fc33 .info > .place
{
	margin-top: 6px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--sr-grey);
}

.e-aa5fc33 .info > .rank
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
}

.e-aa5fc33 .rank > .marks
{
	display: flex;
	align-items: center;
	gap: 2px;
}

.e-aa5fc33 .marks > .mark
{
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
	color: var(--sr-blue);
}

.e-aa5fc33 .rank > .plus
{
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	color: var(--sr-blue);
}

.e-aa5fc33 .rank > .score
{
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--sr-blue);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
}

.e-aa5fc33 .info > .reviews
{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
}

.e-aa5fc33 .reviews > .dots
{
	display: flex;
	align-items: center;
	gap: 3px;
}

/* Delimicno popunjen krug: gradijent sa ostrim rezom dolazi inline iz rendera. */

.e-aa5fc33 .dots > .dot
{
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--sr-dot);
}

.e-aa5fc33 .reviews > .review-count
{
	font-size: 13px;
	line-height: 1.3;
	color: var(--sr-grey);
}

/* Prazan prostor iznad separatora se rasteze, pa se separator, cena i dugme poravnaju po dnu kartice. */

.e-aa5fc33 .info > .spacer
{
	flex: 1 1 auto;
	width: 100%;
	min-height: 14px;
}

.e-aa5fc33 .info > .rule
{
	width: 100%;
	height: 1px;
	background: var(--sr-line);
}

.e-aa5fc33 .info > .meta
{
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.4;
	color: var(--sr-navy);
}

.e-aa5fc33 .info > .city
{
	margin-top: 4px;
	font-size: 13px;
	line-height: 1.4;
	color: var(--sr-grey);
}

.e-aa5fc33 .info > .cost
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-top: 14px;
}

.e-aa5fc33 .cost > .cost-label
{
	font-size: 12px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--sr-navy);
}

.e-aa5fc33 .cost > .cost-old
{
	margin-top: 4px;
	font-size: 14px;
	line-height: 1.3;
	color: var(--sr-grey);
	text-decoration: line-through;
}

.e-aa5fc33 .cost > .cost-new
{
	margin-top: 2px;
	font-size: 26px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--sr-navy);
}

.e-aa5fc33 .info > .cta
{
	align-self: flex-end;
	margin-top: 14px;
	padding: 11px 26px;
	border-radius: 999px;
	background: var(--sr-blue);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	transition: background var(--ot-transition);
}

.e-aa5fc33 .info > .cta:hover
{
	background: #2559c7;
}

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

	.e-aa5fc33 .head > .title
	{
		font-size: 28px;
	}
}

@media (max-width: 640px)
{
	.e-aa5fc33 .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-aa5fc33 .head > .title
	{
		font-size: 24px;
	}

	.e-aa5fc33 .card > .media
	{
		height: 190px;
	}

	.e-aa5fc33 .info > .cost
	{
		width: 100%;
	}

	.e-aa5fc33 .info > .cta
	{
		align-self: stretch;
		width: 100%;
	}
}

/* ===== END: section-search-results-1 ===== */
.e-b44d700
{
	display: block;
	width: 100%;
}

.e-b44d700 > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	gap: 16px;
}

/* ===== ITEM ===== */

.e-b44d700 .item
{
	position: relative;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 22px 22px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	color: inherit;
	cursor: pointer;
	overflow: hidden;
	transition: border-color 320ms cubic-bezier(0.22, 1, 0.36, 1), transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-b44d700 .item:hover
{
	border-color: var(--ot-bg-3-border);
	transform: translateY(-2px);
}

/* Top accent line on hover */

.e-b44d700 .item::before
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--ot-brand);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-b44d700 .item:hover::before
{
	transform: scaleX(1);
}

.e-b44d700 .item.accent-dark::before  { background: var(--ot-text-1); }
.e-b44d700 .item.accent-green::before { background: rgba(20, 144, 95, 1); }
.e-b44d700 .item.accent-gold::before  { background: rgba(170, 130, 60, 1); }

/* ===== ICON ===== */

.e-b44d700 .item-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--ot-bg-2);
	flex-shrink: 0;
	transition: background 280ms cubic-bezier(0.22, 1, 0.36, 1), transform 280ms;
}

.e-b44d700 .item:hover .item-icon
{
	background: var(--ot-brand);
	transform: scale(1.04);
}

.e-b44d700 .item.accent-dark:hover  .item-icon { background: var(--ot-text-1); }
.e-b44d700 .item.accent-green:hover .item-icon { background: rgba(20, 144, 95, 1); }
.e-b44d700 .item.accent-gold:hover  .item-icon { background: rgba(170, 130, 60, 1); }

.e-b44d700 .item-icon > i
{
	font-size: 22px;
	color: var(--ot-text-1);
	transition: color 280ms;
}

.e-b44d700 .item:hover .item-icon > i
{
	color: white;
}

/* ===== TEXT ===== */

.e-b44d700 .item-text
{
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	flex: 1;
}

.e-b44d700 .item-head
{
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.e-b44d700 .item-title
{
	font-family: var(--ot-font-secondary);
	font-size: 15.5px;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.25;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	transition: color 200ms;
}

.e-b44d700 .item:hover .item-title
{
	color: var(--ot-brand);
}

.e-b44d700 .item.accent-dark:hover  .item-title { color: var(--ot-text-1); }
.e-b44d700 .item.accent-green:hover .item-title { color: rgba(20, 144, 95, 1); }
.e-b44d700 .item.accent-gold:hover  .item-title { color: rgba(170, 130, 60, 1); }

.e-b44d700 .item-badge
{
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	background: var(--ot-brand-opacity);
	border-radius: 100px;
	font-size: 9px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	flex-shrink: 0;
}

.e-b44d700 .item-description
{
	font-size: 12.5px;
	line-height: 1.45;
	color: var(--ot-text-2);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===== ARROW ===== */

.e-b44d700 .item-arrow
{
	font-size: 17px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms;
}

.e-b44d700 .item:hover .item-arrow
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

.e-b44d700 .item.accent-dark:hover  .item-arrow { color: var(--ot-text-1); }
.e-b44d700 .item.accent-green:hover .item-arrow { color: rgba(20, 144, 95, 1); }
.e-b44d700 .item.accent-gold:hover  .item-arrow { color: rgba(170, 130, 60, 1); }

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-b44d700 > .holder
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px)
{
	.e-b44d700 > .holder
	{
		grid-template-columns: 1fr;
	}
}
/* ===== BEGIN: section-site-header-1 ===== */

.e-6493bc87
{
	display: block;
	width: 100%;
}

.e-6493bc87 > .holder
{
	width: 100%;
}

/* ===== MENU (bela, kompaktna, preko cele sirine) ===== */

.e-6493bc87 .menu
{
	display: flex;
	align-items: center;
	gap: 28px;
	width: 100%;
	padding: 14px 28px;
	background: #ffffff;
	border-bottom: 1px solid var(--ot-bg-3-border);
}

.e-6493bc87 .menu-logo
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	color: var(--ot-red);
	font-weight: 900;
	font-size: 22px;
	letter-spacing: 0.01em;
	text-decoration: none;
}

.e-6493bc87 .menu-logo > img
{
	display: block;
	height: 34px;
	width: auto;
}

.e-6493bc87 .menu-nav
{
	display: flex;
	align-items: center;
	gap: 22px;
	flex: 1 1 auto;
}

.e-6493bc87 .menu-link
{
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-6493bc87 .menu-link:hover
{
	color: var(--ot-red);
}

.e-6493bc87 .menu-icons
{
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.e-6493bc87 .menu-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px;
	border: none;
	background: transparent;
	color: var(--ot-text-2);
	cursor: pointer;
	transition: color var(--ot-transition);
}

.e-6493bc87 .menu-icon:hover
{
	color: var(--ot-red);
}

.e-6493bc87 .menu-icon > i
{
	font-size: 22px;
}

.e-6493bc87 .menu-sep
{
	width: 1px;
	height: 22px;
	background: var(--ot-bg-3-border);
}

.e-6493bc87 .menu-newsletter
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-6493bc87 .menu-newsletter:hover
{
	color: var(--ot-red);
}

.e-6493bc87 .menu-newsletter > i
{
	font-size: 20px;
}

.e-6493bc87 .menu-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	padding: 4px;
	border: none;
	background: transparent;
	color: var(--ot-text-1);
	cursor: pointer;
}

.e-6493bc87 .menu-burger > i
{
	font-size: 28px;
}

/* ===== PROMO TRAKA (tamno bordo/vinska, preko cele sirine) ===== */

.e-6493bc87 .promo
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	padding: 12px 180px;
	background: #6b1f2a;
	color: #ffffff;
	text-align: center;
}

.e-6493bc87 .promo-text
{
	font-size: 14px;
	line-height: 1.4;
}

.e-6493bc87 .promo-text b,
.e-6493bc87 .promo-text u
{
	font-weight: 700;
}

.e-6493bc87 .promo-pill
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	background: rgba(0, 0, 0, 0.28);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}

.e-6493bc87 .promo-pill > i
{
	font-size: 16px;
}

/* ===== SEARCH FORMA (bela kapsula, centrirana) ===== */

.e-6493bc87 .search
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: min(94%, 900px);
	margin: 26px auto 0;
	padding: 8px 8px 8px 22px;
	background: #ffffff;
	border-radius: 999px;
	box-shadow: 0 12px 34px rgba(0, 0, 0, 0.14);
}

.e-6493bc87 .field
{
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 0;
	min-width: 0;
	padding: 8px 4px;
}

.e-6493bc87 .field-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #7c8aa5;
	flex: 0 0 auto;
}

.e-6493bc87 .field-icon > i
{
	font-size: 24px;
}

.e-6493bc87 .field-placeholder
{
	font-size: 15px;
	color: var(--ot-text-3);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}

.e-6493bc87 .divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	margin: 6px 0;
	background: var(--ot-bg-3-border);
}

.e-6493bc87 .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex: 0 0 auto;
	padding: 14px 30px;
	border: none;
	border-radius: 999px;
	background: var(--ot-red);
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6493bc87 .search-button:hover
{
	background: var(--ot-red-hover);
	transform: translateY(-1px);
}

.e-6493bc87 .search-button > i
{
	font-size: 20px;
}

/* ===== HERO SLAJDER (uvucen, zaobljen, ne do ivice) ===== */

.e-6493bc87 .slider
{
	position: relative;
	width: auto;
	height: 62vh;
	min-height: 460px;
	margin: 26px 28px 8px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	outline: none;
}

.e-6493bc87 .slide
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 900ms ease;
	pointer-events: none;
}

.e-6493bc87 .slide.active
{
	opacity: 1;
	pointer-events: auto;
}

/* Blaga senka samo pri dnu radi citljivosti — slika ostaje ziva. */

.e-6493bc87 .slide > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0.42) 100%);
}

/* Promo grafika u gornjem desnom uglu — crveni bold sa belim obrisom, nakosen. */

.e-6493bc87 .slide-badge
{
	position: absolute;
	top: 26px;
	right: 30px;
	color: var(--ot-red);
	font-weight: 900;
	font-size: 32px;
	line-height: 1.05;
	text-align: right;
	text-transform: uppercase;
	transform: rotate(-6deg);
	-webkit-text-stroke: 1.5px #ffffff;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

/* Sadrzaj slajda — dole levo. */

.e-6493bc87 .slide-content
{
	position: absolute;
	left: 44px;
	bottom: 44px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	width: min(90%, 720px);
}

.e-6493bc87 .slide-title
{
	margin: 0;
	color: #ffffff;
	font-weight: 300;
	font-size: 56px;
	line-height: 1.08;
	text-shadow: 0 3px 18px rgba(0, 0, 0, 0.5);
}

.e-6493bc87 .slide-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 28px;
	background: var(--ot-red);
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	border-radius: 999px;
	text-decoration: none;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6493bc87 .slide-cta:hover
{
	background: var(--ot-red-hover);
	transform: translateY(-2px);
}

/* ===== ARROWS (kruzne bele sa tamnom strelicom) ===== */

.e-6493bc87 .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	border: none;
	background: #ffffff;
	color: var(--ot-text-1);
	cursor: pointer;
	z-index: 3;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-6493bc87 .arrow:hover
{
	background: #f2f4f8;
	transform: translateY(-50%) scale(1.06);
}

.e-6493bc87 .arrow > i
{
	font-size: 26px;
}

.e-6493bc87 .arrow-prev
{
	left: 22px;
}

.e-6493bc87 .arrow-next
{
	right: 22px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6493bc87 .menu-nav
	{
		display: none;
	}

	.e-6493bc87 .menu-newsletter > span
	{
		display: none;
	}

	.e-6493bc87 .menu-burger
	{
		display: inline-flex;
		order: -1;
	}

	.e-6493bc87 .slide-title
	{
		font-size: 44px;
	}

	.e-6493bc87 .slide-badge
	{
		font-size: 26px;
	}
}

@media (max-width: 768px)
{
	.e-6493bc87 .menu
	{
		gap: 14px;
		padding: 12px 16px;
	}

	.e-6493bc87 .promo
	{
		flex-wrap: wrap;
		padding: 12px 16px 44px;
	}

	.e-6493bc87 .promo-pill
	{
		top: auto;
		bottom: 8px;
		right: 50%;
		transform: translateX(50%);
	}

	.e-6493bc87 .search
	{
		flex-wrap: wrap;
		width: calc(100% - 32px);
		padding: 14px;
		border-radius: 22px;
	}

	.e-6493bc87 .field
	{
		width: 100%;
		flex: 1 1 100%;
		padding: 10px 6px;
	}

	.e-6493bc87 .divider
	{
		width: 100%;
		height: 1px;
		align-self: auto;
		margin: 0;
	}

	.e-6493bc87 .search-button
	{
		width: 100%;
		margin-top: 8px;
	}

	.e-6493bc87 .slider
	{
		height: 66vh;
		min-height: 420px;
		margin: 22px 14px 8px;
	}

	.e-6493bc87 .slide-content
	{
		left: 22px;
		bottom: 28px;
	}

	.e-6493bc87 .slide-title
	{
		font-size: 34px;
	}

	.e-6493bc87 .slide-badge
	{
		display: none;
	}

	.e-6493bc87 .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-6493bc87 .arrow > i
	{
		font-size: 22px;
	}
}

/* ===== END: section-site-header-1 ===== */
.e-284dcdbd
{
	display: block;
	width: 100%;
}

.e-284dcdbd > .holder
{
	width: 100%;
}

/* ========================================== */
/* ===== EDITORIAL VARIANT ================== */
/* ========================================== */

.e-284dcdbd .editorial
{
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	gap: 0;
	min-height: 680px;
	background: var(--ot-bg-2);
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-284dcdbd > .holder.image-right .editorial
{
	grid-template-columns: 1fr 1.6fr;
}

.e-284dcdbd > .holder.image-right .editorial > .stage  { order: 2; }
.e-284dcdbd > .holder.image-right .editorial > .panel  { order: 1; }

/* ===== STAGE (image side) ===== */

.e-284dcdbd .stage
{
	position: relative;
	overflow: hidden;
	background: var(--ot-bg-3);
}

.e-284dcdbd .stage > .image
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	opacity: 0;
	transform: scale(1.04);
	transition: opacity 1100ms cubic-bezier(0.22, 1, 0.36, 1), transform 1400ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .stage > .image.active
{
	opacity: 1;
	transform: scale(1);
}

.e-284dcdbd .stage > .image > .image-grain
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(160deg, rgba(20, 18, 16, 0.0) 60%, rgba(20, 18, 16, 0.32) 100%),
		linear-gradient(0deg, rgba(20, 18, 16, 0.18) 0%, transparent 30%);
}

.e-284dcdbd .stage > .image > .image-meta
{
	position: absolute;
	left: 28px;
	bottom: 24px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background: rgba(20, 18, 16, 0.4);
	backdrop-filter: blur(12px) saturate(180%);
	-webkit-backdrop-filter: blur(12px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 600;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

/* Stage arrows — float on image edges */

.e-284dcdbd .stage-arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.92);
	border: 0;
	border-radius: 50%;
	color: var(--ot-text-1);
	cursor: pointer;
	opacity: 0;
	transition: opacity 320ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms, background 240ms;
}

.e-284dcdbd .stage:hover .stage-arrow
{
	opacity: 1;
}

.e-284dcdbd .stage-arrow:hover
{
	background: var(--ot-text-1);
	color: white;
}

.e-284dcdbd .stage-arrow-prev { left: 20px; }
.e-284dcdbd .stage-arrow-next { right: 20px; }

.e-284dcdbd .stage:hover .stage-arrow-prev { transform: translateY(-50%) translateX(0); }
.e-284dcdbd .stage:hover .stage-arrow-next { transform: translateY(-50%) translateX(0); }

.e-284dcdbd .stage-arrow > i { font-size: 20px; }

/* ===== PANEL (content side) ===== */

.e-284dcdbd .panel
{
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	padding: 56px 64px 32px;
	overflow: hidden;
}

/* Deco big number */

.e-284dcdbd .panel > .panel-deco
{
	position: absolute;
	top: 56px;
	right: 64px;
	display: flex;
	align-items: baseline;
	gap: 12px;
	pointer-events: none;
}

.e-284dcdbd .panel > .panel-deco > .deco-num
{
	font-family: var(--ot-font-secondary);
	font-size: 96px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--ot-bg-3);
	font-variation-settings: 'opsz' 144;
	transition: color 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .panel > .panel-deco > .deco-line
{
	width: 24px;
	height: 1px;
	background: var(--ot-bg-3-border);
	margin-bottom: 14px;
}

.e-284dcdbd .panel > .panel-deco > .deco-total
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 400;
	color: var(--ot-text-3);
	font-variation-settings: 'opsz' 144;
}

/* Panel slide (stacked, crossfade) */

.e-284dcdbd .panel > .panel-slide
{
	position: absolute;
	left: 64px;
	right: 64px;
	top: 56px;
	margin-top: 88px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	max-width: 520px;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 600ms cubic-bezier(0.22, 1, 0.36, 1), transform 720ms cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

.e-284dcdbd .panel > .panel-slide.active
{
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.e-284dcdbd .panel-eyebrow
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-284dcdbd .panel-eyebrow > .panel-eyebrow-mark
{
	width: 28px;
	height: 1px;
	background: var(--ot-brand);
}

.e-284dcdbd .panel-title
{
	font-family: var(--ot-font-secondary);
	font-size: 64px;
	font-weight: 400;
	letter-spacing: -0.035em;
	line-height: 0.96;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-284dcdbd .panel-title em
{
	font-style: italic;
	color: var(--ot-brand);
	font-weight: 400;
}

.e-284dcdbd .panel-description
{
	font-size: 15px;
	line-height: 1.65;
	color: var(--ot-text-2);
	margin: 0;
}

.e-284dcdbd .panel-cta
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 8px;
	padding: 14px 24px;
	background: var(--ot-text-1);
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.005em;
	color: var(--ot-bg-1);
	width: fit-content;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms, gap 240ms;
}

.e-284dcdbd .panel-cta:hover
{
	background: var(--ot-brand);
	transform: translateX(2px);
	gap: 14px;
}

.e-284dcdbd .panel-cta > i
{
	font-size: 18px;
}

/* ===== THUMBS ===== */

.e-284dcdbd .panel > .panel-thumbs
{
	margin-top: auto;
	padding-top: 48px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-284dcdbd .thumb
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	padding: 14px 0 0;
	background: transparent;
	border: 0;
	border-top: 1px solid transparent;
	cursor: pointer;
	text-align: left;
	transition: border-color 280ms cubic-bezier(0.22, 1, 0.36, 1);
	margin-top: -1px;
}

.e-284dcdbd .thumb:hover
{
	border-top-color: var(--ot-bg-3-border);
}

.e-284dcdbd .thumb.active
{
	border-top-color: var(--ot-brand);
}

.e-284dcdbd .thumb > .thumb-cover
{
	display: none;
}

.e-284dcdbd .thumb > .thumb-text
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	width: 100%;
}

.e-284dcdbd .thumb > .thumb-text > .thumb-num
{
	font-family: var(--ot-font-secondary);
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	font-variation-settings: 'opsz' 144;
	letter-spacing: 0;
	transition: color 280ms;
}

.e-284dcdbd .thumb.active > .thumb-text > .thumb-num
{
	color: var(--ot-brand);
}

.e-284dcdbd .thumb > .thumb-text > .thumb-label
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 240ms;
}

.e-284dcdbd .thumb.active > .thumb-text > .thumb-label
{
	color: var(--ot-text-1);
}

.e-284dcdbd .thumb > .thumb-progress
{
	position: absolute;
	top: -1px;
	left: 0;
	height: 1px;
	background: var(--ot-brand);
	transition: width 50ms linear;
	z-index: 1;
}

/* ========================================== */
/* ===== MULTI VARIANT ====================== */
/* ========================================== */

.e-284dcdbd .multi
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.e-284dcdbd .multi > .multi-track
{
	display: flex;
	gap: 18px;
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .multi-slide
{
	position: relative;
	display: flex;
	align-items: flex-end;
	flex-shrink: 0;
	width: calc((100% - 18px * (var(--per-view, 3) - 1)) / var(--per-view, 3));
	min-height: 360px;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	color: white;
	transition: transform 480ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .multi-slide:hover
{
	transform: translateY(-3px);
}

.e-284dcdbd .multi-slide > .multi-overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 18, 16, 0.0) 35%, rgba(20, 18, 16, 0.4) 65%, rgba(20, 18, 16, 0.85) 100%);
}

.e-284dcdbd .multi-slide > .multi-content
{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 24px 24px;
	width: 100%;
}

.e-284dcdbd .multi-eyebrow
{
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 254, 252, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-284dcdbd .multi-title
{
	font-family: var(--ot-font-secondary);
	font-size: 24px;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: white;
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

.e-284dcdbd .multi-cta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	color: white;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.e-284dcdbd .multi-cta > i
{
	font-size: 16px;
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .multi-slide:hover .multi-cta > i
{
	transform: translateX(4px);
}

.e-284dcdbd .multi > .multi-controls
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 4px;
}

.e-284dcdbd .multi-counter
{
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	font-family: var(--ot-font-secondary);
	color: var(--ot-text-2);
	font-variation-settings: 'opsz' 144;
}

.e-284dcdbd .multi-counter > .num
{
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.02em;
}

.e-284dcdbd .multi-counter > .num.total { font-size: 14px; opacity: 0.6; }
.e-284dcdbd .multi-counter > .sep       { font-size: 16px; opacity: 0.55; }

.e-284dcdbd .multi-arrows
{
	display: inline-flex;
	gap: 8px;
}

.e-284dcdbd .arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms, transform 240ms;
}

.e-284dcdbd .arrow:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
	transform: scale(1.04);
}

.e-284dcdbd .arrow > i { font-size: 19px; }

/* ========================================== */
/* ===== HERO VARIANT ======================= */
/* ========================================== */

.e-284dcdbd .hero
{
	--accent: #c2f04a;
	position: relative;
	width: 100%;
	min-height: 806px;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-3);
	isolation: isolate;
}

.e-284dcdbd .hero > .hero-slide
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	opacity: 0;
	transform: scale(1.05);
	transition: opacity 1100ms cubic-bezier(0.22, 1, 0.36, 1), transform 1600ms cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

.e-284dcdbd .hero > .hero-slide.active
{
	opacity: 1;
	transform: scale(1);
	pointer-events: auto;
}

.e-284dcdbd .hero > .hero-slide > .hero-overlay
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(115deg, rgba(10, 14, 22, 0.78) 0%, rgba(10, 14, 22, 0.28) 42%, rgba(10, 14, 22, 0.0) 70%),
		linear-gradient(0deg, rgba(10, 14, 22, 0.72) 0%, rgba(10, 14, 22, 0.0) 45%);
}

/* ===== CIRCULAR BADGE ===== */

.e-284dcdbd .hero-badge
{
	position: absolute;
	top: 44px;
	right: 56px;
	z-index: 2;
	width: 128px;
	height: 128px;
	animation: e-284dcdbd-spin 22s linear infinite;
}

.e-284dcdbd .hero-badge > .hero-badge-inner
{
	display: block;
	width: 100%;
	height: 100%;
}

.e-284dcdbd .hero-badge svg
{
	display: block;
	width: 100%;
	height: 100%;
}

.e-284dcdbd .hero-badge-text
{
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	fill: var(--accent);
}

.e-284dcdbd .hero-badge-mark
{
	font-size: 22px;
	text-anchor: middle;
	fill: var(--accent);
}

@keyframes e-284dcdbd-spin
{
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

/* ===== CONTENT (bottom-left) ===== */

.e-284dcdbd .hero > .hero-slide > .hero-content
{
	position: absolute;
	left: 56px;
	bottom: 72px;
	right: 56px;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	max-width: 620px;
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1) 120ms, transform 800ms cubic-bezier(0.22, 1, 0.36, 1) 120ms;
}

.e-284dcdbd .hero > .hero-slide.active > .hero-content
{
	opacity: 1;
	transform: translateY(0);
}

.e-284dcdbd .hero-eyebrow
{
	display: inline-flex;
	align-items: center;
	padding: 7px 14px;
	background: var(--accent);
	border-radius: 100px;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #0a1116;
}

.e-284dcdbd .hero-title
{
	font-family: var(--ot-font-secondary);
	font-size: clamp(40px, 5.4vw, 76px);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.02em;
	color: #fff;
	margin: 0;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.28);
}

.e-284dcdbd .hero-title em
{
	font-style: normal;
	color: var(--accent);
}

.e-284dcdbd .hero-description
{
	font-size: 17px;
	font-weight: 400;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.9);
	margin: 0;
	max-width: 480px;
}

.e-284dcdbd .hero-description em
{
	font-style: normal;
	font-weight: 700;
	color: var(--accent);
}

.e-284dcdbd .hero-cta
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 4px;
	padding: 15px 28px;
	background: var(--ot-brand);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: #fff;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms, gap 240ms;
}

.e-284dcdbd .hero-cta:hover
{
	background: var(--ot-brand-hover);
	transform: translateY(-2px);
	gap: 14px;
}

.e-284dcdbd .hero-cta > i { font-size: 19px; }

/* ===== DOTS ===== */

.e-284dcdbd .hero > .hero-dots
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 28px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.e-284dcdbd .hero-dot
{
	width: 9px;
	height: 9px;
	padding: 0;
	border: 0;
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.45);
	cursor: pointer;
	transition: width 320ms cubic-bezier(0.22, 1, 0.36, 1), background 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-284dcdbd .hero-dot:hover
{
	background: rgba(255, 255, 255, 0.75);
}

.e-284dcdbd .hero-dot.active
{
	width: 34px;
	background: #fff;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 1100px)
{
	.e-284dcdbd .editorial
	{
		min-height: 580px;
	}

	.e-284dcdbd .panel
	{
		padding: 44px 44px 28px;
	}

	.e-284dcdbd .panel > .panel-deco
	{
		top: 44px;
		right: 44px;
	}

	.e-284dcdbd .panel > .panel-slide
	{
		left: 44px;
		right: 44px;
		top: 44px;
	}

	.e-284dcdbd .panel-title
	{
		font-size: 50px;
	}

	.e-284dcdbd .multi-slide
	{
		width: calc((100% - 16px) / 2);
	}

	.e-284dcdbd .hero
	{
		min-height: 728px;
	}

	.e-284dcdbd .hero > .hero-slide > .hero-content
	{
		left: 40px;
		right: 40px;
		bottom: 64px;
	}

	.e-284dcdbd .hero-badge
	{
		top: 32px;
		right: 36px;
		width: 108px;
		height: 108px;
	}
}

@media (max-width: 900px)
{
	.e-284dcdbd .editorial
	{
		grid-template-columns: 1fr;
		min-height: auto;
	}

	.e-284dcdbd .hero
	{
		min-height: 650px;
	}

	.e-284dcdbd .hero > .hero-slide > .hero-content
	{
		left: 24px;
		right: 24px;
		bottom: 56px;
		gap: 16px;
	}

	.e-284dcdbd .hero-description
	{
		font-size: 15px;
	}

	.e-284dcdbd .hero-badge
	{
		width: 88px;
		height: 88px;
		top: 24px;
		right: 24px;
	}

	.e-284dcdbd .hero-badge-text
	{
		font-size: 10.5px;
		letter-spacing: 0.18em;
	}

	.e-284dcdbd > .holder.image-right .editorial > .stage  { order: 1; }
	.e-284dcdbd > .holder.image-right .editorial > .panel  { order: 2; }

	.e-284dcdbd .stage
	{
		min-height: 360px;
	}

	.e-284dcdbd .panel
	{
		padding: 32px 24px;
	}

	.e-284dcdbd .panel > .panel-deco
	{
		position: relative;
		top: auto;
		right: auto;
		margin-bottom: 16px;
	}

	.e-284dcdbd .panel > .panel-deco > .deco-num
	{
		font-size: 56px;
	}

	.e-284dcdbd .panel > .panel-slide
	{
		position: relative;
		left: auto;
		right: auto;
		top: auto;
		margin-top: 0;
		display: none;
	}

	.e-284dcdbd .panel > .panel-slide.active
	{
		display: flex;
	}

	.e-284dcdbd .panel-title
	{
		font-size: 38px;
	}

	.e-284dcdbd .panel > .panel-thumbs
	{
		grid-template-columns: repeat(2, 1fr);
		padding-top: 32px;
	}

	.e-284dcdbd .multi-slide
	{
		width: 100%;
	}

	.e-284dcdbd .stage-arrow
	{
		opacity: 1;
	}

	.e-284dcdbd .stage-arrow-prev { left: 12px; }
	.e-284dcdbd .stage-arrow-next { right: 12px; }
}

@media (max-width: 600px)
{
	.e-284dcdbd .hero
	{
		min-height: 598px;
	}

	.e-284dcdbd .hero > .hero-slide > .hero-content
	{
		bottom: 52px;
		gap: 14px;
	}

	.e-284dcdbd .hero-badge
	{
		display: none;
	}

	.e-284dcdbd .hero-description
	{
		font-size: 14px;
	}
}
/* ===== BEGIN: section-sponsored-hotels-1 ===== */

.e-5e42fbb5
{
	display: block;
	width: 100%;
}

/* Pozadina i radijus stoje na holderu da ih config polje "background" moze pregaziti inline. */

.e-5e42fbb5 > .holder
{
	width: 100%;
	padding: 32px;
	box-sizing: border-box;
	background: #f6f2ec;
	border-radius: var(--ot-radius-l);
}

/* ===== HEAD (sponzorstvo + naslov) ===== */

.e-5e42fbb5 .head
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-5e42fbb5 .sponsor-row
{
	display: flex;
	align-items: center;
	gap: 6px;
}

.e-5e42fbb5 .sponsor
{
	font-size: 13px;
	color: var(--ot-text-2);
}

.e-5e42fbb5 .info
{
	font-size: 16px;
	color: var(--ot-text-2);
}

.e-5e42fbb5 .title
{
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
}

/* ===== SLAJDER ===== */

.e-5e42fbb5 .viewport
{
	position: relative;
	overflow: hidden;
	margin-top: 20px;
}

.e-5e42fbb5 .track
{
	display: flex;
	gap: 20px;
	transition: transform 0.4s ease;
}

.e-5e42fbb5 .cell
{
	flex: 0 0 calc((100% - (var(--per-view) - 1) * 20px) / var(--per-view));
	min-width: 0;
}

/* ===== KARTICA ===== */

.e-5e42fbb5 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.e-5e42fbb5 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.e-5e42fbb5 .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	transition: transform 0.4s ease;
}

.e-5e42fbb5 .card:hover .card-image
{
	transform: scale(1.05);
}

.e-5e42fbb5 .card-body
{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 16px;
	flex: 1;
}

.e-5e42fbb5 .name
{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-5e42fbb5 .location
{
	font-size: 13px;
	color: var(--ot-text-2);
}

/* ===== STRELICE (grupa dole desno) ===== */

.e-5e42fbb5 .arrows
{
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 16px;
}

.e-5e42fbb5 .arrow
{
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	border: 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.e-5e42fbb5 .arrow > i
{
	font-size: 20px;
	color: var(--ot-text-1);
}

.e-5e42fbb5 .arrow:hover
{
	transform: translateY(-1px);
}

.e-5e42fbb5 .arrow.is-dim
{
	opacity: 0.4;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5e42fbb5 .title
	{
		font-size: 22px;
	}
}

@media (max-width: 640px)
{
	.e-5e42fbb5 > .holder
	{
		padding: 16px;
	}

	.e-5e42fbb5 .title
	{
		font-size: 20px;
	}
}

/* ===== END: section-sponsored-hotels-1 ===== */
/* ===== BEGIN: section-summer-destinations-1 ===== */

.e-676d8d29
{
	display: block;
	width: 100%;
}

.e-676d8d29 > .holder
{
	width: 100%;
}

/* ===== HEADER (centrirani plavi dvoredni naslov) ===== */

.e-676d8d29 > .holder > .title
{
	margin: 0 0 34px;
	text-align: center;
	color: var(--ot-blue);
	font-size: 32px;
	font-weight: 600;
	line-height: 1.25;
}

/* ===== MREŽA 3x3 ===== */

.e-676d8d29 .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

/* ===== KARTICA (full-cover slika, klikabilna) ===== */

.e-676d8d29 .card
{
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(15, 40, 80, 0.14);
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-676d8d29 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 40, 80, 0.22);
}

.e-676d8d29 .card > .card-image
{
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-676d8d29 .card:hover > .card-image
{
	transform: scale(1.06);
}

.e-676d8d29 .card > .card-shade
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 62%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0));
	transition: opacity var(--ot-transition);
}

.e-676d8d29 .card:hover > .card-shade
{
	opacity: 0.9;
}

/* ===== DONJI RED (levo pin + naziv, desno staklasto dugme) ===== */

.e-676d8d29 .card > .card-bottom
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding: 18px;
}

.e-676d8d29 .card-bottom > .card-place
{
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.e-676d8d29 .card-place > .card-pin
{
	color: var(--ot-orange);
	font-size: 20px;
	line-height: 1;
}

.e-676d8d29 .card-place > .card-name
{
	color: #ffffff;
	font-weight: 700;
	font-size: 18px;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}

.e-676d8d29 .card-bottom > .card-button
{
	flex: none;
	padding: 8px 14px;
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: var(--ot-radius-m);
	background: rgba(255, 255, 255, 0.16);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-676d8d29 .card:hover .card-button
{
	background: rgba(255, 255, 255, 0.3);
	border-color: rgba(255, 255, 255, 0.6);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 1024px)
{
	.e-676d8d29 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-676d8d29 > .holder > .title
	{
		font-size: 26px;
	}

	.e-676d8d29 .grid
	{
		grid-template-columns: repeat(1, 1fr);
	}
}

/* ===== END: section-summer-destinations-1 ===== */
/* ===== BEGIN: section-summer-recommend-1 ===== */

.e-5edc1cc0
{
	display: block;
	width: 100%;
	--summer-orange: #f57c00;
	--summer-orange-hover: #e06f00;
}

.e-5edc1cc0 > .holder
{
	width: 100%;
	padding: 40px;
	border-radius: 24px;
	background: #f7f1e6;
}

/* ===== HEADER (levo poravnat veliki tamni naslov) ===== */

.e-5edc1cc0 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

.e-5edc1cc0 .title
{
	margin: 0;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== GRID (red 1: 4 uske; red 2: 2 sire) ===== */

.e-5edc1cc0 .grid
{
	display: grid;
	gap: 20px;
	align-items: stretch;
}

.e-5edc1cc0 .grid-narrow
{
	grid-template-columns: repeat(4, 1fr);
}

.e-5edc1cc0 .grid-wide
{
	grid-template-columns: repeat(2, 1fr);
	margin-top: 20px;
}

/* ===== CARD (slika gore + svetlo plavi blok dole) ===== */

.e-5edc1cc0 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 18px;
	background: #ffffff;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5edc1cc0 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
}

.e-5edc1cc0 .card-image
{
	display: block;
	width: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-5edc1cc0 .card-narrow .card-image
{
	height: 170px;
}

.e-5edc1cc0 .card-wide .card-image
{
	height: 260px;
}

.e-5edc1cc0 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (svetlo plavi gradijent, footer poravnat na dno) ===== */

.e-5edc1cc0 .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 18px 20px 20px;
	background: linear-gradient(180deg, #eef6fe 0%, #e2f0fc 100%);
}

.e-5edc1cc0 .card-title
{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-5edc1cc0 .card-wide .card-title
{
	font-size: 21px;
}

.e-5edc1cc0 .card-text
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: #334155;
}

/* Prostor iznad footera se rasteze da kartice budu jednake visine. */

.e-5edc1cc0 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 14px;
}

.e-5edc1cc0 .card-price
{
	font-size: 17px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
}

.e-5edc1cc0 .card-wide .card-price
{
	font-size: 19px;
}

/* Uske kartice: narandzasti kruzic sa strelicom. */

.e-5edc1cc0 .card-arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--summer-orange);
	color: #ffffff;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-5edc1cc0 .card-arrow > i
{
	font-size: 22px;
}

.e-5edc1cc0 .card-narrow:hover .card-arrow
{
	background: var(--summer-orange-hover);
	transform: translateX(3px);
}

/* Sire kartice: narandzasto dugme sa tekstom. */

.e-5edc1cc0 .card-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 22px;
	flex-shrink: 0;
	border-radius: 12px;
	background: var(--summer-orange);
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	transition: background var(--ot-transition);
}

.e-5edc1cc0 .card-wide:hover .card-button
{
	background: var(--summer-orange-hover);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 900px)
{
	.e-5edc1cc0 .grid-narrow
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-5edc1cc0 .grid-wide
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-5edc1cc0 .title
	{
		font-size: 30px;
	}
}

@media (max-width: 560px)
{
	.e-5edc1cc0 > .holder
	{
		padding: 24px 18px;
	}

	.e-5edc1cc0 .grid-narrow,
	.e-5edc1cc0 .grid-wide
	{
		grid-template-columns: 1fr;
	}

	.e-5edc1cc0 .card-wide .card-image
	{
		height: 200px;
	}

	.e-5edc1cc0 .card-foot
	{
		flex-wrap: wrap;
	}

	.e-5edc1cc0 .card-button
	{
		flex: 1 1 auto;
	}
}

/* ===== END: section-summer-recommend-1 ===== */
/* ===== BEGIN: section-summer-recommend-2 ===== */

.e-5edc1cc1
{
	display: block;
	width: 100%;
	--summer-orange: #f57c00;
	--summer-orange-hover: #e06f00;
}

.e-5edc1cc1 > .holder
{
	width: 100%;
	padding: 40px;
	border-radius: 24px;
	background: #f7f1e6;
}

/* ===== HEADER (levo poravnat veliki tamni naslov) ===== */

.e-5edc1cc1 > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

.e-5edc1cc1 .title
{
	margin: 0;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ot-text-1);
}

/* ===== GRID (jedan red: 4 kartice jednake sirine) ===== */

.e-5edc1cc1 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	align-items: stretch;
}

/* ===== CARD (slika gore + svetlo plavi blok dole) ===== */

.e-5edc1cc1 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 18px;
	background: #ffffff;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-5edc1cc1 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
}

.e-5edc1cc1 .card-image
{
	display: block;
	width: 100%;
	height: 170px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-5edc1cc1 .card:hover .card-image
{
	transform: scale(1.05);
}

/* ===== BODY (svetlo plavi gradijent, footer poravnat na dno) ===== */

.e-5edc1cc1 .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 18px 20px 20px;
	background: linear-gradient(180deg, #eef6fe 0%, #e2f0fc 100%);
}

.e-5edc1cc1 .card-title
{
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ot-text-1);
}

.e-5edc1cc1 .card-text
{
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: #334155;
}

/* Prostor iznad footera se rasteze da kartice budu jednake visine. */

.e-5edc1cc1 .card-foot
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 14px;
}

.e-5edc1cc1 .card-price
{
	font-size: 17px;
	font-weight: 700;
	color: var(--ot-text-1);
	white-space: nowrap;
}

/* Narandzasti kruzic sa strelicom udesno. */

.e-5edc1cc1 .card-arrow
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--summer-orange);
	color: #ffffff;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-5edc1cc1 .card-arrow > i
{
	font-size: 22px;
}

.e-5edc1cc1 .card:hover .card-arrow
{
	background: var(--summer-orange-hover);
	transform: translateX(3px);
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 900px)
{
	.e-5edc1cc1 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-5edc1cc1 .title
	{
		font-size: 30px;
	}
}

@media (max-width: 560px)
{
	.e-5edc1cc1 > .holder
	{
		padding: 24px 18px;
	}

	.e-5edc1cc1 .grid
	{
		grid-template-columns: 1fr;
	}
}

/* ===== END: section-summer-recommend-2 ===== */
.e-7f1d5d3f
{
	display: block;
	width: 100%;
}

.e-7f1d5d3f > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	gap: 10px;
}

/* ===== ITEM ===== */

.e-7f1d5d3f .item
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 16px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-1);
	text-decoration: none;
	transition: border-color 220ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-7f1d5d3f .item:hover
{
	border-color: var(--ot-bg-3-border);
	background: var(--ot-bg-2);
	transform: translateY(-1px);
}

.e-7f1d5d3f .item > .pin
{
	flex-shrink: 0;
	font-size: 19px;
	color: var(--ot-brand);
}

.e-7f1d5d3f .item > .label
{
	flex: 1;
	min-width: 0;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.e-7f1d5d3f .item > .count
{
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-3);
}

.e-7f1d5d3f .item > .arrow
{
	flex-shrink: 0;
	font-size: 18px;
	color: var(--ot-text-3);
	transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), color 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-7f1d5d3f .item:hover > .arrow
{
	color: var(--ot-brand);
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-7f1d5d3f > .holder { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px)
{
	.e-7f1d5d3f > .holder { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px)
{
	.e-7f1d5d3f > .holder { grid-template-columns: 1fr; }
}
/* ===== BEGIN: section-tailor-hero-1 ===== */

.e-56a9d2ba
{
	display: block;
	width: 100%;
	--th-red: #b0202e;
	--th-cream: #f5efe6;
	--th-green: #00b67a;
	--th-teeth: 22px;
	--th-pad: clamp(20px, 4.5vw, 64px);
}

/* Krem pozadina drzi ceo blok, pa nazubljeni zarezi na dnu fotografije otkrivaju bas nju. */

.e-56a9d2ba > .holder
{
	width: 100%;
	background: var(--th-cream);
}

/* ===== TRAKA POVERENJA (tanka crvena traka na samom vrhu) ===== */

.e-56a9d2ba > .holder > .trustbar
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px var(--th-pad);
	background: var(--th-red);
	color: #ffffff;
}

.e-56a9d2ba .trustbar > .trustbar-mid
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 14px;
	line-height: 1.2;
}

.e-56a9d2ba .trustbar-mid > .trust-word
{
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.e-56a9d2ba .trustbar-mid > .trust-stars
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--th-green);
	font-size: 15px;
	line-height: 1;
}

.e-56a9d2ba .trustbar-mid > .trust-brand
{
	font-weight: 600;
}

.e-56a9d2ba .trustbar > .trust-contact
{
	position: absolute;
	top: 50%;
	right: var(--th-pad);
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transform: translateY(-50%);
	transition: opacity 0.15s ease;
}

.e-56a9d2ba .trust-contact:hover
{
	opacity: 0.78;
}

.e-56a9d2ba .trust-contact > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-style: normal;
	line-height: 1;
}

/* ===== POZORNICA (fotografija koja nosi i meni i hero, sa pocepanom donjom ivicom) ===== */

/* Dvoslojna maska: prvi sloj su trouglovi okrenuti nadole prikovani uz dno, drugi sloj je pun pravougaonik koji pokriva sve iznad zuba, pa se ivica cepa a ostatak slike ostaje ceo. */

.e-56a9d2ba > .holder > .stage
{
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 640px;
	padding-bottom: calc(var(--th-teeth) + 24px);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2018%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%200%20L12%2018%20L24%200%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	-webkit-mask-size: 24px var(--th-teeth), 100% calc(100% - var(--th-teeth));
	-webkit-mask-position: bottom left, top left;
	-webkit-mask-repeat: repeat-x, no-repeat;
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2018%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0%200%20L12%2018%20L24%200%20Z%22%20fill=%22black%22/%3E%3C/svg%3E"), linear-gradient(#000000, #000000);
	mask-size: 24px var(--th-teeth), 100% calc(100% - var(--th-teeth));
	mask-position: bottom left, top left;
	mask-repeat: repeat-x, no-repeat;
}

.e-56a9d2ba .stage > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(12, 18, 28, 0.68) 0%, rgba(12, 18, 28, 0.38) 52%, rgba(12, 18, 28, 0.18) 100%);
	pointer-events: none;
}

/* ===== MENI (preko slike, sav tekst beo) ===== */

.e-56a9d2ba .stage > .menu
{
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	padding: 26px var(--th-pad);
}

.e-56a9d2ba .menu > .menu-logo
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	color: #ffffff;
	text-decoration: none;
}

.e-56a9d2ba .menu-logo > .menu-logo-image
{
	display: block;
	max-height: 40px;
	width: auto;
}

.e-56a9d2ba .menu-logo > .menu-logo-text
{
	font-family: var(--ot-font-primary);
	font-size: 26px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.1;
}

.e-56a9d2ba .menu-logo > .menu-logo-sub
{
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.14em;
	opacity: 0.86;
	text-transform: uppercase;
}

.e-56a9d2ba .menu > .menu-nav
{
	display: flex;
	align-items: center;
	gap: 30px;
}

.e-56a9d2ba .menu-nav > .menu-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #ffffff;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: opacity 0.15s ease;
}

.e-56a9d2ba .menu-nav > .menu-link:hover
{
	opacity: 0.75;
}

.e-56a9d2ba .menu-link > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	font-style: normal;
	line-height: 1;
}

/* Hamburger se pojavljuje tek na uskom ekranu; ovde stoji sklonjen. */

.e-56a9d2ba .menu > .menu-burger
{
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 42px;
	height: 42px;
	padding: 0 9px;
	border: 1px solid rgba(255, 255, 255, 0.55);
	border-radius: 8px;
	cursor: pointer;
}

.e-56a9d2ba .menu-burger > .burger-line
{
	display: block;
	height: 2px;
	width: 100%;
	background: #ffffff;
	border-radius: 2px;
}

/* ===== HERO (beli serifni naslov levo i dva dugmeta u redu) ===== */

.e-56a9d2ba .stage > .hero
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	flex: 1;
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	padding: 60px var(--th-pad) 70px;
	text-align: left;
}

.e-56a9d2ba .hero > .hero-title
{
	margin: 0;
	max-width: 780px;
	color: #ffffff;
	font-family: var(--ot-font-secondary);
	font-size: 58px;
	font-weight: 700;
	line-height: 1.1;
}

.e-56a9d2ba .hero > .hero-sub
{
	margin: 16px 0 0;
	max-width: 620px;
	color: rgba(255, 255, 255, 0.9);
	font-family: var(--ot-font-secondary);
	font-size: 21px;
	font-weight: 400;
	line-height: 1.5;
}

.e-56a9d2ba .hero > .hero-actions
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 32px;
}

.e-56a9d2ba .hero-actions > .hero-primary
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 28px;
	background: var(--th-red);
	border: 1px solid var(--th-red);
	border-radius: 4px;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.e-56a9d2ba .hero-actions > .hero-primary:hover
{
	background: #911a26;
	border-color: #911a26;
}

.e-56a9d2ba .hero-actions > .hero-secondary
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 28px;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.85);
	border-radius: 4px;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.e-56a9d2ba .hero-actions > .hero-secondary:hover
{
	background: #ffffff;
	color: #14202c;
}

/* ===== UVODNI BLOK (krem podloga, tekst levo i polaroid desno) ===== */

.e-56a9d2ba > .holder > .intro
{
	display: grid;
	grid-template-columns: 1fr minmax(300px, 430px);
	align-items: center;
	gap: 60px;
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	padding: 64px var(--th-pad) 78px;
}

.e-56a9d2ba .intro > .intro-text
{
	min-width: 0;
}

.e-56a9d2ba .intro-text > .intro-dots
{
	display: flex;
	align-items: center;
	gap: 7px;
	margin-bottom: 20px;
}

.e-56a9d2ba .intro-dots > .intro-dot
{
	display: block;
	width: 9px;
	height: 9px;
	background: var(--th-red);
	border-radius: 50%;
}

.e-56a9d2ba .intro-text > .intro-title
{
	margin: 0;
	color: var(--th-red);
	font-family: var(--ot-font-secondary);
	font-size: 40px;
	font-weight: 700;
	line-height: 1.15;
}

.e-56a9d2ba .intro-text > .intro-desc
{
	margin: 20px 0 0;
	color: #3d3a35;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.75;
}

.e-56a9d2ba .intro-text > .usp
{
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.e-56a9d2ba .usp > .usp-item
{
	display: flex;
	align-items: center;
	gap: 12px;
}

.e-56a9d2ba .usp-item > .usp-mark
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	background: var(--th-red);
	border-radius: 50%;
	color: #ffffff;
}

.e-56a9d2ba .usp-mark > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 16px;
	font-style: normal;
	line-height: 1;
}

.e-56a9d2ba .usp-item > .usp-label
{
	color: #24303a;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
}

/* Polaroid: slika u belom ramu, blago zarotirana i podignuta mekom senkom. */

.e-56a9d2ba .intro > .intro-photo
{
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
}

.e-56a9d2ba .intro-photo > .polaroid
{
	display: block;
	max-width: 100%;
	padding: 14px 14px 46px;
	background: #ffffff;
	box-shadow: 0 14px 34px rgba(15, 23, 42, 0.2);
	transform: rotate(-3deg);
}

.e-56a9d2ba .polaroid > .polaroid-image
{
	display: block;
	width: 100%;
	height: 300px;
	object-fit: cover;
}

/* ===== TABLET ===== */

@media (max-width: 1024px)
{
	.e-56a9d2ba > .holder > .stage
	{
		min-height: 560px;
	}

	.e-56a9d2ba .menu > .menu-nav
	{
		gap: 18px;
	}

	.e-56a9d2ba .menu-nav > .menu-link
	{
		font-size: 14px;
	}

	.e-56a9d2ba .hero > .hero-title
	{
		font-size: 46px;
	}

	.e-56a9d2ba > .holder > .intro
	{
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.e-56a9d2ba .intro > .intro-photo
	{
		justify-content: flex-start;
	}

	.e-56a9d2ba .intro-photo > .polaroid
	{
		max-width: 460px;
	}
}

/* ===== MOBILNI ===== */

@media (max-width: 640px)
{
	.e-56a9d2ba
	{
		--th-teeth: 16px;
	}

	.e-56a9d2ba .trustbar > .trustbar-mid
	{
		justify-content: flex-start;
		font-size: 13px;
	}

	.e-56a9d2ba > .holder > .trustbar
	{
		justify-content: flex-start;
		padding-right: 110px;
	}

	.e-56a9d2ba > .holder > .stage
	{
		min-height: 520px;
	}

	.e-56a9d2ba .stage > .menu
	{
		flex-wrap: wrap;
		padding-top: 18px;
		padding-bottom: 18px;
	}

	.e-56a9d2ba .menu > .menu-burger
	{
		display: flex;
	}

	.e-56a9d2ba .menu > .menu-nav
	{
		display: none;
		order: 3;
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
		width: 100%;
		margin-top: 16px;
		padding-top: 16px;
		border-top: 1px solid rgba(255, 255, 255, 0.35);
	}

	.e-56a9d2ba .menu > .menu-nav.is-open
	{
		display: flex;
	}

	.e-56a9d2ba .hero > .hero-title
	{
		font-size: 34px;
	}

	.e-56a9d2ba .hero > .hero-sub
	{
		font-size: 17px;
	}

	.e-56a9d2ba .hero > .hero-actions
	{
		align-items: stretch;
		flex-direction: column;
		width: 100%;
	}

	.e-56a9d2ba .hero-actions > .hero-primary
	{
		width: 100%;
		text-align: center;
	}

	.e-56a9d2ba .hero-actions > .hero-secondary
	{
		width: 100%;
		text-align: center;
	}

	.e-56a9d2ba .intro-text > .intro-title
	{
		font-size: 30px;
	}

	.e-56a9d2ba .intro-photo > .polaroid
	{
		max-width: 100%;
	}

	.e-56a9d2ba .polaroid > .polaroid-image
	{
		height: 230px;
	}
}

/* ===== END: section-tailor-hero-1 ===== */
.e-6705b62a
{
	display: block;
	width: 100%;
}

.e-6705b62a > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 3), 1fr);
	gap: 24px;
}

/* ===== TESTIMONIAL ===== */

.e-6705b62a .testimonial
{
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 32px 30px 26px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-l);
	margin: 0;
	transition: border-color 320ms cubic-bezier(0.22, 1, 0.36, 1), transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6705b62a .testimonial:hover
{
	border-color: var(--ot-bg-3-border);
	transform: translateY(-3px);
}

/* Decorative quote mark */

.e-6705b62a .testimonial > .quote
{
	position: absolute;
	top: 22px;
	right: 26px;
	font-size: 56px;
	color: var(--ot-bg-3);
	line-height: 1;
	pointer-events: none;
	font-variation-settings: 'FILL' 1;
}

/* Stars */

.e-6705b62a .testimonial > .stars
{
	display: inline-flex;
	gap: 1px;
}

.e-6705b62a .testimonial > .stars > i
{
	font-size: 14px;
	color: rgba(220, 165, 50, 1);
	font-variation-settings: 'FILL' 1;
}

/* Quote text */

.e-6705b62a .testimonial > .text
{
	font-family: var(--ot-font-secondary);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.55;
	letter-spacing: -0.012em;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

/* Footer (author info) */

.e-6705b62a .testimonial > .footer
{
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: auto;
	padding-top: 18px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-6705b62a .avatar
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
	border-radius: 50%;
	flex-shrink: 0;
}

.e-6705b62a .avatar-fallback > i
{
	font-size: 22px;
	color: var(--ot-text-3);
}

.e-6705b62a .author
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
	line-height: 1.3;
}

.e-6705b62a .name
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-1);
	letter-spacing: -0.005em;
}

.e-6705b62a .meta
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.e-6705b62a .meta > .meta-dot
{
	width: 3px;
	height: 3px;
	background: var(--ot-bg-3-border);
	border-radius: 50%;
}

.e-6705b62a .date
{
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-3);
	flex-shrink: 0;
	letter-spacing: 0.005em;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-6705b62a > .holder
	{
		grid-template-columns: 1fr;
	}

	.e-6705b62a .testimonial
	{
		padding: 26px 24px 22px;
	}

	.e-6705b62a .testimonial > .text
	{
		font-size: 15.5px;
	}
}
/* ===== BEGIN: section-tile-mozaik-1 (mozaik mesovitih plocica) ===== */

.e-25ae7d10
{
	display: block;
	width: 100%;
}

.e-25ae7d10 > .holder
{
	width: 100%;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-25ae7d10 > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Sirine i visina reda stizu inline kao --cols i --row-h, pa media query moze da ih pregazi. */

.e-25ae7d10 > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	gap: 22px;
}

/* ===== TILE (klikabilan link, jednaka visina unutar reda) ===== */

.e-25ae7d10 .tile
{
	position: relative;
	display: block;
	height: var(--row-h, 210px);
	overflow: hidden;
	border-radius: 12px;
	background-color: var(--ot-bg-3);
	text-decoration: none;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-25ae7d10 .tile:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.16);
}

.e-25ae7d10 .tile > .cover
{
	display: block;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* ===== LINK PLOCICA (cela je fotografija, natpis dole levo, strelica gore desno) ===== */

.e-25ae7d10 .is-link > .cover
{
	position: absolute;
	inset: 0;
	z-index: 0;
}

.e-25ae7d10 .is-link:hover > .cover
{
	transform: scale(1.06);
}

.e-25ae7d10 .is-link > .scrim
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.10) 30%, rgba(0, 0, 0, 0.62) 100%);
}

/* Jednobojna varijanta nema fotografiju, pa joj ni zatamnjenje ne treba. */

.e-25ae7d10 .is-flat > .scrim
{
	background: none;
}

.e-25ae7d10 .is-link > .arrow
{
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	transition: transform 300ms ease;
}

.e-25ae7d10 .is-link > .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

.e-25ae7d10 .is-link:hover > .arrow
{
	transform: translateX(4px);
}

.e-25ae7d10 .is-link > .label
{
	position: absolute;
	right: 20px;
	bottom: 18px;
	left: 20px;
	z-index: 2;
	font-family: var(--ot-font-primary);
	font-size: 25px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #ffffff;
}

/* Razmak izmedju vodece reci i naslova nosi prazan prostor u templatu, pa margina nije potrebna. */

.e-25ae7d10 .is-link > .label > .lead
{
	margin-right: 0;
}

/* ===== INFO BLOK (dvostruke sirine, slika levo, tekst i dugme desno) ===== */

.e-25ae7d10 .is-info
{
	display: flex;
	align-items: stretch;
	background-color: #ffffff;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.07);
}

.e-25ae7d10 .is-info > .cover
{
	flex: 0 0 44%;
	width: 44%;
}

.e-25ae7d10 .is-info:hover > .cover
{
	transform: scale(1.04);
}

.e-25ae7d10 .is-info > .panel
{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	padding: 28px 30px;
	overflow: hidden;
}

.e-25ae7d10 .is-info > .panel > .panel-title
{
	margin: 0 0 10px 0;
	font-family: var(--ot-font-primary);
	font-size: 25px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #24303a;
}

.e-25ae7d10 .is-info > .panel > .panel-text
{
	margin: 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
	color: #64748b;
}

.e-25ae7d10 .is-info > .panel > .panel-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	padding: 11px 24px;
	border: 1px solid rgba(36, 48, 58, 0.28);
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	color: #24303a;
	transition: border-color 260ms ease, background-color 260ms ease;
}

.e-25ae7d10 .is-info:hover > .panel > .panel-cta
{
	border-color: #24303a;
	background-color: rgba(36, 48, 58, 0.06);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-25ae7d10 > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-25ae7d10 .tile
	{
		height: 230px;
	}

	.e-25ae7d10 .is-link > .label
	{
		font-size: 22px;
	}

	.e-25ae7d10 .is-info > .panel
	{
		padding: 20px 22px;
	}

	.e-25ae7d10 .is-info > .panel > .panel-title
	{
		font-size: 21px;
	}

	.e-25ae7d10 .is-info > .panel > .panel-text
	{
		font-size: 14px;
	}
}

@media (max-width: 640px)
{
	.e-25ae7d10 > .holder > .grid
	{
		gap: 18px;
	}

	.e-25ae7d10 > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-25ae7d10 .tile
	{
		height: 220px;
	}

	.e-25ae7d10 .is-info
	{
		flex-direction: column;
		height: auto;
	}

	.e-25ae7d10 .is-info > .cover
	{
		flex: 0 0 190px;
		width: 100%;
		height: 190px;
	}

	.e-25ae7d10 .is-info > .panel
	{
		padding: 22px 22px 24px 22px;
	}

	.e-25ae7d10 .is-info > .panel > .panel-cta
	{
		margin-top: 20px;
	}
}

/* ===== END: section-tile-mozaik-1 ===== */
/* ===== BEGIN: section-top-countries-1 ===== */

.e-4d4c82de
{
	--tc-dark: #14181f;
	--tc-blue: #2f6feb;
	--tc-pink: #e6197d;
	--tc-grey: #6b7280;
	--tc-gap: 16px;
	--tc-radius: 10px;

	display: block;
	background-color: transparent;
}

.e-4d4c82de > .holder
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Zaglavlje: naslov u dva stila levo, plavo pill dugme desno. */

.e-4d4c82de > .holder > .top
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.e-4d4c82de > .holder > .top > .title
{
	margin: 0;
	padding: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	line-height: 1.15;
	font-weight: 800;
	color: var(--tc-dark);
}

.e-4d4c82de > .holder > .top > .title > .lead
{
	white-space: pre-wrap;
}

.e-4d4c82de > .holder > .top > .title > .script
{
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 38px;
	font-style: italic;
	font-weight: 400;
	color: var(--tc-pink);
}

.e-4d4c82de > .holder > .top > .cta
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 12px 22px;
	border-radius: 999px;
	background-color: var(--tc-blue);
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	text-decoration: none;
	transition: background-color 200ms ease, transform 200ms ease;
}

.e-4d4c82de > .holder > .top > .cta:hover
{
	background-color: #2358c4;
	transform: translateY(-1px);
}

.e-4d4c82de > .holder > .top > .cta > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 19px;
	font-weight: 400;
	line-height: 1;
}

/* Tabovi zemalja sa zastavicama. */

.e-4d4c82de > .holder > .tabs
{
	display: flex;
	align-items: stretch;
	gap: 26px;
	border-bottom: 1px solid #e6e8ec;
}

.e-4d4c82de > .holder > .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	margin: 0;
	padding: 0 0 12px;
	border: 0;
	border-bottom: 3px solid transparent;
	background: none;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 600;
	color: var(--tc-grey);
	cursor: pointer;
	transition: color 200ms ease, border-color 200ms ease;
}

.e-4d4c82de > .holder > .tabs > .tab:hover
{
	color: var(--tc-dark);
}

.e-4d4c82de > .holder > .tabs > .tab.active
{
	border-bottom-color: var(--tc-blue);
	font-weight: 800;
	color: var(--tc-dark);
}

.e-4d4c82de > .holder > .tabs > .tab > .flag
{
	display: block;
	width: 20px;
	height: 14px;
	flex: 0 0 auto;
	border-radius: 2px;
	background-color: #eef0f3;
	background-size: cover;
	background-position: center;
}

.e-4d4c82de > .holder > .tabs > .tab > .tab-label
{
	white-space: nowrap;
}

/* Bento: velika kartica levo, mreža 3x2 desno. */

.e-4d4c82de > .holder > .bento
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	gap: var(--tc-gap);
}

.e-4d4c82de > .holder > .bento > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	gap: var(--tc-gap);
}

.e-4d4c82de .card
{
	position: relative;
	display: flex;
	overflow: hidden;
	height: 100%;
	border-radius: var(--tc-radius);
	background-color: #dfe3e8;
	text-decoration: none;
}

.e-4d4c82de .card > .card-image
{
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-4d4c82de .card:hover > .card-image
{
	transform: scale(1.07);
}

.e-4d4c82de .card > .shade
{
	position: absolute;
	inset: 0;
	z-index: 1;
}

.e-4d4c82de .card > .shade-big
{
	background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.48) 100%);
}

.e-4d4c82de .card > .shade-small
{
	background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0.12) 62%, rgba(0, 0, 0, 0.28) 100%);
}

/* Velika kartica: centriran beli tekst i belo pill dugme sa plavim tekstom. */

.e-4d4c82de .card-big
{
	min-height: 420px;
}

.e-4d4c82de .card-big > .big-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 30px 24px;
	text-align: center;
	z-index: 2;
}

.e-4d4c82de .card-big > .big-body > .big-name
{
	display: block;
	font-family: var(--ot-font-primary);
	font-size: 42px;
	line-height: 1.1;
	font-weight: 800;
	color: #ffffff;
}

.e-4d4c82de .card-big > .big-body > .big-count
{
	display: block;
	font-size: 16px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.9);
}

.e-4d4c82de .card-big > .big-body > .big-btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 12px;
	padding: 11px 30px;
	border-radius: 999px;
	background-color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	color: var(--tc-blue);
	transition: background-color 200ms ease;
}

.e-4d4c82de .card-big:hover > .big-body > .big-btn
{
	background-color: #eaf0ff;
}

/* Male kartice: ime i broj ponuda gore-levo. */

.e-4d4c82de .card-small
{
	min-height: 150px;
}

.e-4d4c82de .card-small > .small-body
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-self: flex-start;
	gap: 3px;
	width: 100%;
	padding: 16px 18px;
	z-index: 2;
}

.e-4d4c82de .card-small > .small-body > .small-name
{
	display: block;
	font-family: var(--ot-font-primary);
	font-size: 19px;
	line-height: 1.2;
	font-weight: 800;
	color: #ffffff;
}

.e-4d4c82de .card-small > .small-body > .small-count
{
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.88);
}

@media (max-width: 1024px)
{
	.e-4d4c82de > .holder > .top > .title
	{
		font-size: 28px;
	}

	.e-4d4c82de > .holder > .top > .title > .script
	{
		font-size: 31px;
	}

	.e-4d4c82de > .holder > .tabs
	{
		gap: 20px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.e-4d4c82de > .holder > .bento
	{
		grid-template-columns: 1fr;
	}

	.e-4d4c82de .card-big
	{
		min-height: 300px;
	}
}

@media (max-width: 640px)
{
	.e-4d4c82de > .holder > .top > .title
	{
		font-size: 24px;
	}

	.e-4d4c82de > .holder > .top > .title > .script
	{
		font-size: 27px;
	}

	.e-4d4c82de > .holder > .bento > .grid
	{
		grid-template-columns: 1fr;
	}

	.e-4d4c82de .card-big
	{
		min-height: 260px;
	}

	.e-4d4c82de .card-big > .big-body > .big-name
	{
		font-size: 32px;
	}

	.e-4d4c82de .card-small
	{
		min-height: 170px;
	}
}

/* ===== END: section-top-countries-1 ===== */
/* ===== BEGIN: section-top-destinations (grupe top destinacija — naslov grupe + red kartica slika/lila traka) ===== */

.e-5f0f3781
{
	display: block;
	width: 100%;
}

.e-5f0f3781 > .holder
{
	width: 100%;
}

/* ===== GROUP (grupe jedna ispod druge, razmak samo izmedju njih) ===== */

.e-5f0f3781 > .holder > .group + .group
{
	margin-top: 48px;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-5f0f3781 > .holder > .group > .group-title
{
	margin: 0 0 24px 0;
	font-family: var(--ot-font-primary);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: left;
	color: #3b1f5c;
}

/* ===== GRID (3 kolone; grid-auto-rows: 1fr izjednacava visine kartica) ===== */

.e-5f0f3781 > .holder > .group > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	gap: 24px;
}

/* ===== CARD (klikabilna, jednake visine) ===== */

.e-5f0f3781 > .holder > .group > .grid > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-5f0f3781 > .holder > .group > .grid > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== MEDIA (fiksne proporcije da su sve slike iste visine) ===== */

.e-5f0f3781 > .holder > .group > .grid > .card > .card-media
{
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
}

.e-5f0f3781 > .holder > .group > .grid > .card > .card-media > .card-image
{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-5f0f3781 > .holder > .group > .grid > .card:hover > .card-media > .card-image
{
	transform: scale(1.05);
}

/* ===== BAR (lila traka: naziv levo, ljubicasta strelica desno) ===== */

.e-5f0f3781 > .holder > .group > .grid > .card > .card-bar
{
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 62px;
	padding: 14px 18px;
	background: #f3edf7;
}

.e-5f0f3781 > .holder > .group > .grid > .card > .card-bar > .card-name
{
	min-width: 0;
	font-family: var(--ot-font-primary);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.25;
	color: #3b1f5c;
}

.e-5f0f3781 > .holder > .group > .grid > .card > .card-bar > .card-arrow
{
	flex-shrink: 0;
	margin-left: auto;
	font-size: 24px;
	line-height: 1;
	color: #7b1fa2;
	transition: transform 220ms ease;
}

.e-5f0f3781 > .holder > .group > .grid > .card:hover > .card-bar > .card-arrow
{
	transform: translateX(3px);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-5f0f3781 > .holder > .group > .grid
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.e-5f0f3781 > .holder > .group + .group { margin-top: 40px; }
	.e-5f0f3781 > .holder > .group > .group-title { font-size: 27px; }
}

@media (max-width: 640px)
{
	.e-5f0f3781 > .holder > .group > .grid
	{
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.e-5f0f3781 > .holder > .group + .group { margin-top: 32px; }
	.e-5f0f3781 > .holder > .group > .group-title { font-size: 24px; margin-bottom: 18px; }
	.e-5f0f3781 > .holder > .group > .grid > .card > .card-bar { min-height: 58px; padding: 14px 16px; }
}

/* ===== END: section-top-destinations ===== */
/* ===== BEGIN: section-top-locations-1 ===== */

.e-2c7bb74c
{
	display: block;
	width: 100%;
	background: #efebe6;
	border-radius: 16px;
}

.e-2c7bb74c > .holder
{
	width: 100%;
	padding: 32px;
	box-sizing: border-box;
}

/* ===== ZAGLAVLJE (sponzorstvo + naslov) ===== */

.e-2c7bb74c > .holder > .head
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-2c7bb74c > .holder > .head > .sponsor-row
{
	display: flex;
	align-items: center;
	gap: 6px;
}

.e-2c7bb74c > .holder > .head > .sponsor-row > .info
{
	font-size: 16px;
	line-height: 1;
	color: var(--ot-text-2);
}

.e-2c7bb74c > .holder > .head > .sponsor-row > .sponsor
{
	font-size: 13px;
	color: var(--ot-text-2);
}

/* Naslov mora eksplicitno da traži sans-serif — sites aplikacija gura serif na naslove. */

.e-2c7bb74c > .holder > .head > .title
{
	font-family: var(--ot-font-primary);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ot-text-1);
}

/* ===== SLAJDER ===== */

.e-2c7bb74c > .holder > .viewport
{
	position: relative;
	overflow: hidden;
	margin-top: 20px;
}

.e-2c7bb74c > .holder > .viewport > .track
{
	display: flex;
	align-items: stretch;
	gap: 20px;
	transition: transform 0.4s ease;
}

.e-2c7bb74c > .holder > .viewport > .track > .cell
{
	flex: 0 0 calc((100% - (var(--per-view) - 1) * 20px) / var(--per-view));
	min-width: 0;
}

/* ===== KARTICA ===== */

.e-2c7bb74c .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.e-2c7bb74c .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.e-2c7bb74c .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	transition: transform 0.4s ease;
}

.e-2c7bb74c .card:hover > .card-image
{
	transform: scale(1.05);
}

.e-2c7bb74c .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 4px;
	padding: 14px 16px;
}

.e-2c7bb74c .card > .card-body > .name
{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-2c7bb74c .card > .card-body > .location
{
	font-size: 13px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== STRELICE (dve u jednoj pill grupi, dole desno) ===== */

.e-2c7bb74c > .holder > .arrows
{
	display: flex;
	justify-content: flex-end;
	margin-top: 16px;
}

.e-2c7bb74c > .holder > .arrows > .arrows-pill
{
	display: inline-flex;
	align-items: center;
	background: #ffffff;
	border-radius: 999px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
	overflow: hidden;
}

.e-2c7bb74c .arrow
{
	width: 44px;
	height: 40px;
	border: 0;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.2s ease, opacity 0.2s ease;
}

.e-2c7bb74c .arrow-next
{
	border-left: 1px solid rgba(0, 0, 0, 0.08);
}

.e-2c7bb74c .arrow > i
{
	font-size: 22px;
	color: var(--ot-text-1);
}

.e-2c7bb74c .arrow:hover
{
	background: rgba(0, 0, 0, 0.04);
}

.e-2c7bb74c .arrow.is-off
{
	opacity: 0.35;
	cursor: default;
}

.e-2c7bb74c .arrow.is-off:hover
{
	background: transparent;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-2c7bb74c > .holder
	{
		padding: 24px;
	}

	.e-2c7bb74c > .holder > .head > .title
	{
		font-size: 22px;
	}
}

@media (max-width: 640px)
{
	.e-2c7bb74c > .holder
	{
		padding: 16px;
	}

	.e-2c7bb74c > .holder > .head > .title
	{
		font-size: 20px;
	}
}

/* ===== END: section-top-locations-1 ===== */
.e-34d8bab7
{
	display: block;
	width: 100%;
}

.e-34d8bab7 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 28px;
}

/* ===== TABS ===== */

.e-34d8bab7 .tabs
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* shared tab base */
.e-34d8bab7 .tabs > .tab
{
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	transition: all 200ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- country mode: flag + name pill --- */
.e-34d8bab7 > .holder.source-country .tabs > .tab
{
	gap: 9px;
	height: 46px;
	padding: 0 20px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-34d8bab7 > .holder.source-country .tabs > .tab:hover
{
	border-color: var(--ot-brand-border, var(--ot-brand));
	color: var(--ot-text-1);
}

.e-34d8bab7 > .holder.source-country .tabs > .tab.active
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: #fff;
}

.e-34d8bab7 .tabs > .tab > .tab-flag
{
	font-size: 18px;
	line-height: 1;
}

/* --- company mode: logo box --- */
.e-34d8bab7 > .holder.source-company .tabs > .tab
{
	justify-content: center;
	height: 64px;
	min-width: 120px;
	padding: 0 22px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}

.e-34d8bab7 > .holder.source-company .tabs > .tab:hover
{
	border-color: var(--ot-brand-border, var(--ot-brand));
	transform: translateY(-1px);
}

.e-34d8bab7 > .holder.source-company .tabs > .tab.active
{
	border-color: var(--ot-brand);
	box-shadow: 0 0 0 1px var(--ot-brand);
}

.e-34d8bab7 .tabs > .tab > .tab-logo
{
	max-height: 38px;
	max-width: 120px;
	width: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.65;
	transition: filter 200ms, opacity 200ms;
}

.e-34d8bab7 .tabs > .tab:hover > .tab-logo,
.e-34d8bab7 .tabs > .tab.active > .tab-logo
{
	filter: grayscale(0);
	opacity: 1;
}

.e-34d8bab7 > .holder.source-company .tabs > .tab > .tab-name
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-34d8bab7 > .holder.source-company .tabs > .tab.active > .tab-name
{
	color: var(--ot-brand);
}

/* ===== PANEL ===== */

.e-34d8bab7 .panel
{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.e-34d8bab7 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.e-34d8bab7 .card-link
{
	display: block;
}

/* ===== SKELETON ===== */

.e-34d8bab7 .grid.loading > .skeleton
{
	height: 360px;
	border-radius: var(--ot-radius-m);
	background: linear-gradient(100deg, var(--ot-bg-2) 30%, var(--ot-bg-3) 50%, var(--ot-bg-2) 70%);
	background-size: 200% 100%;
	animation: e-34d8bab7-shimmer 1.4s ease-in-out infinite;
}

@keyframes e-34d8bab7-shimmer
{
	0%   { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* ===== EMPTY ===== */

.e-34d8bab7 .empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 56px 20px;
	background: var(--ot-bg-2);
	border: 1px dashed var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-3);
	text-align: center;
}

.e-34d8bab7 .empty > i
{
	font-size: 34px;
	opacity: 0.7;
}

.e-34d8bab7 .empty > span
{
	font-size: 14px;
	font-weight: 500;
}

/* ===== MORE LINK ===== */

.e-34d8bab7 .more
{
	display: inline-flex;
	align-items: center;
	align-self: center;
	gap: 8px;
	padding: 12px 26px;
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 220ms cubic-bezier(0.22, 1, 0.36, 1), gap 220ms;
}

.e-34d8bab7 .more:hover
{
	background: var(--ot-brand);
	color: #fff;
	gap: 12px;
}

.e-34d8bab7 .more > i
{
	font-size: 18px;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-34d8bab7 .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px)
{
	.e-34d8bab7 .grid { grid-template-columns: repeat(2, 1fr); }
	.e-34d8bab7 .grid.loading > .skeleton { height: 300px; }
}

@media (max-width: 520px)
{
	.e-34d8bab7 .grid { grid-template-columns: 1fr; }

	.e-34d8bab7 > .holder.source-company .tabs > .tab
	{
		height: 56px;
		min-width: 100px;
		padding: 0 16px;
	}

	.e-34d8bab7 > .holder.source-company .tabs > .tab > .tab-logo { max-height: 30px; }
}
.e-3a3553bf
{
	display: block;
	width: 100%;
}

.e-3a3553bf > .holder
{
	position: relative;
	width: 100%;
}

/* ===== GRID ===== */

.e-3a3553bf > .holder.layout-grid > .track
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px 24px;
}

.e-3a3553bf > .holder.layout-grid.cols-2 > .track { grid-template-columns: repeat(2, 1fr); }
.e-3a3553bf > .holder.layout-grid.cols-3 > .track { grid-template-columns: repeat(3, 1fr); }
.e-3a3553bf > .holder.layout-grid.cols-4 > .track { grid-template-columns: repeat(4, 1fr); }

/* ===== SLIDER ===== */

.e-3a3553bf > .holder.layout-slider > .track
{
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 3 * 24px) / 4);
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	scroll-padding: 0;
}

.e-3a3553bf > .holder.layout-slider > .track::-webkit-scrollbar
{
	display: none;
}

/* ===== NAV STRELICE (slider) ===== */

.e-3a3553bf .nav
{
	position: absolute;
	top: 38%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 50%;
	background: var(--ot-bg-1);
	color: var(--ot-text-1);
	cursor: pointer;
	transition: background 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms, transform 240ms, opacity 240ms;
}

.e-3a3553bf .nav-prev { left: -12px; transform: translateY(-50%); }
.e-3a3553bf .nav-next { right: -12px; transform: translateY(-50%); }

.e-3a3553bf .nav:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-3a3553bf .nav-prev:hover { transform: translateY(-50%) scale(1.04); }
.e-3a3553bf .nav-next:hover { transform: translateY(-50%) scale(1.04); }

.e-3a3553bf .nav.disabled
{
	opacity: 0;
	pointer-events: none;
}

.e-3a3553bf .nav > i
{
	font-size: 20px;
}

.e-3a3553bf > .holder.layout-slider.cols-2 > .track { grid-auto-columns: calc((100% - 24px) / 2); }
.e-3a3553bf > .holder.layout-slider.cols-3 > .track { grid-auto-columns: calc((100% - 2 * 24px) / 3); }

.e-3a3553bf > .holder.layout-slider > .track > .card-link
{
	scroll-snap-align: start;
}

/* ===== CARD LINK ===== */

.e-3a3553bf .card-link
{
	display: block;
	min-width: 0;
}

/* card-tour je grid child preko .e-hash wrappera — spreči kolaps. */

.e-3a3553bf .card-link .e-5677af83
{
	min-width: 100%;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-3a3553bf > .holder.layout-grid.cols-4 > .track,
	.e-3a3553bf > .holder.layout-grid > .track
	{
		grid-template-columns: repeat(3, 1fr);
	}

	.e-3a3553bf > .holder.layout-slider > .track
	{
		grid-auto-columns: calc((100% - 2 * 24px) / 3);
	}
}

@media (max-width: 900px)
{
	.e-3a3553bf > .holder.layout-grid > .track,
	.e-3a3553bf > .holder.layout-grid.cols-3 > .track,
	.e-3a3553bf > .holder.layout-grid.cols-4 > .track
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 24px 18px;
	}

	.e-3a3553bf > .holder.layout-slider > .track
	{
		grid-auto-columns: calc((100% - 20px) / 2);
		gap: 20px;
	}

	.e-3a3553bf .nav
	{
		display: none;
	}
}

@media (max-width: 600px)
{
	.e-3a3553bf > .holder.layout-grid > .track,
	.e-3a3553bf > .holder.layout-grid.cols-3 > .track,
	.e-3a3553bf > .holder.layout-grid.cols-4 > .track
	{
		grid-template-columns: 1fr;
	}

	.e-3a3553bf > .holder.layout-slider > .track
	{
		grid-auto-columns: 78%;
	}
}
/* ===== BEGIN: section-transport-1 ===== */

.e-6a1b85cf
{
	display: block;
	width: 100%;
}

.e-6a1b85cf > .holder
{
	width: 100%;
}

/* ===== HEAD (left aligned title + subtitle) ===== */

.e-6a1b85cf > .holder > .head
{
	margin: 0 0 32px;
}

.e-6a1b85cf > .holder > .head > .title
{
	margin: 0;
	text-align: left;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

.e-6a1b85cf > .holder > .head > .subtitle
{
	margin: 10px 0 0;
	text-align: left;
	font-weight: 400;
	font-size: 17px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== GRID (row of 4 equal cards) ===== */

.e-6a1b85cf .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, overflow visible so pill overhangs) ===== */

.e-6a1b85cf .card
{
	position: relative;
	display: block;
	height: 100%;
	text-decoration: none;
	background: transparent;
	overflow: visible;
	box-sizing: border-box;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6a1b85cf .card:hover
{
	transform: translateY(-4px);
}

/* ===== CARD IMAGE (rounded, full-cover, landscape, own overflow for zoom) ===== */

.e-6a1b85cf .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--ot-radius-m);
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-6a1b85cf .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== PILL (white, overhanging left edge, blue accent bar + dark name) ===== */

.e-6a1b85cf .card > .pill
{
	position: absolute;
	left: -12px;
	bottom: 16px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: calc(100% - 8px);
	box-sizing: border-box;
	padding: 9px 14px;
	background: white;
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(20, 18, 16, 0.16);
	transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 260ms ease;
}

.e-6a1b85cf .card:hover > .pill
{
	transform: translateY(-4px);
	box-shadow: 0 14px 28px rgba(20, 18, 16, 0.22);
}

.e-6a1b85cf .card > .pill > .pill-bar
{
	flex: 0 0 auto;
	width: 4px;
	height: 16px;
	border-radius: 2px;
	background: var(--ot-brand);
}

.e-6a1b85cf .card > .pill > .pill-name
{
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--ot-text-1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6a1b85cf .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-6a1b85cf .grid
	{
		grid-template-columns: 1fr;
	}

	.e-6a1b85cf > .holder > .head
	{
		margin-bottom: 24px;
	}

	.e-6a1b85cf > .holder > .head > .title
	{
		font-size: 28px;
	}

	.e-6a1b85cf > .holder > .head > .subtitle
	{
		font-size: 15px;
	}
}

/* ===== END: section-transport-1 ===== */
/* ===== BEGIN: section-travel-mozaik-1 (mozaik vrsta putovanja) ===== */

.e-39331e5c
{
	display: block;
	width: 100%;
}

.e-39331e5c > .holder
{
	width: 100%;
}

/* Naslov je podrazumevano prazan; kad se ukljuci mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-39331e5c > .holder > .title
{
	margin: 0 0 28px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-39331e5c > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Sirine kolona stizu inline kao --cols, pa media query moze da ih pregazi. */

.e-39331e5c > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	gap: 22px;
}

/* ===== VISINE REDOVA (unutar reda jednake, redovi namerno razliciti) ===== */

.e-39331e5c > .holder > .grid > .row > .card
{
	height: 280px;
}

.e-39331e5c > .holder > .grid > .row:nth-of-type(1) > .card
{
	height: 300px;
}

.e-39331e5c > .holder > .grid > .row:nth-of-type(2) > .card
{
	height: 230px;
}

.e-39331e5c > .holder > .grid > .row:nth-of-type(3) > .card
{
	height: 330px;
}

/* ===== CARD (klikabilan link, cela kartica je fotografija) ===== */

.e-39331e5c .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-39331e5c .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.e-39331e5c .card > .card-image
{
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-39331e5c .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== OVERLAY (blago tamnjenje, kontrast nosi label) ===== */

.e-39331e5c .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.06);
	transition: background 360ms ease;
}

.e-39331e5c .card:hover > .overlay
{
	background: rgba(0, 0, 0, 0.12);
}

/* ===== LABEL (poluprovidni tamni pill, centriran, beo serifni bold) ===== */

.e-39331e5c .card > .label
{
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	max-width: calc(100% - 40px);
	padding: 12px 22px;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.55);
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-39331e5c > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-39331e5c > .holder > .grid > .row > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(1) > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(2) > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(3) > .card
	{
		height: 240px;
	}

	.e-39331e5c > .holder > .title
	{
		font-size: 30px;
	}

	.e-39331e5c .card > .label
	{
		font-size: 20px;
	}
}

@media (max-width: 640px)
{
	.e-39331e5c > .holder > .grid
	{
		gap: 18px;
	}

	.e-39331e5c > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-39331e5c > .holder > .grid > .row > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(1) > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(2) > .card,
	.e-39331e5c > .holder > .grid > .row:nth-of-type(3) > .card
	{
		height: 220px;
	}

	.e-39331e5c > .holder > .title
	{
		font-size: 26px;
	}

	.e-39331e5c .card > .label
	{
		padding: 10px 16px;
		font-size: 19px;
	}
}

/* ===== END: section-travel-mozaik-1 ===== */
/* ===== BEGIN: section-travel-mozaik-2 (mozaik vrsta putovanja, dva reda) ===== */

.e-39331e5b
{
	display: block;
	width: 100%;
}

.e-39331e5b > .holder
{
	width: 100%;
}

/* Naslov je podrazumevano prazan; kad se ukljuci mora eksplicitno sans-serif jer sites gura serif na h1-h6. */

.e-39331e5b > .holder > .title
{
	margin: 0 0 28px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== GRID (redovi jedan ispod drugog, isti gutter po obe ose) ===== */

.e-39331e5b > .holder > .grid
{
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* Sirine kolona stizu inline kao --cols, pa media query moze da ih pregazi. */

.e-39331e5b > .holder > .grid > .row
{
	display: grid;
	grid-template-columns: var(--cols, 1fr);
	gap: 22px;
}

/* ===== VISINE REDOVA (unutar reda jednake, prvi red namerno visi) ===== */

.e-39331e5b > .holder > .grid > .row > .card
{
	height: 280px;
}

.e-39331e5b > .holder > .grid > .row:nth-of-type(1) > .card
{
	height: 300px;
}

.e-39331e5b > .holder > .grid > .row:nth-of-type(2) > .card
{
	height: 230px;
}

/* ===== CARD (klikabilan link, cela kartica je fotografija) ===== */

.e-39331e5b .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-39331e5b .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.e-39331e5b .card > .card-image
{
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-39331e5b .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== OVERLAY (blago tamnjenje, kontrast nosi label) ===== */

.e-39331e5b .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.06);
	transition: background 360ms ease;
}

.e-39331e5b .card:hover > .overlay
{
	background: rgba(0, 0, 0, 0.12);
}

/* ===== LABEL (poluprovidni tamni pill, centriran, beo serifni bold) ===== */

.e-39331e5b .card > .label
{
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	max-width: calc(100% - 40px);
	padding: 12px 22px;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.55);
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	color: #ffffff;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-39331e5b > .holder > .grid > .row
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-39331e5b > .holder > .grid > .row > .card,
	.e-39331e5b > .holder > .grid > .row:nth-of-type(1) > .card,
	.e-39331e5b > .holder > .grid > .row:nth-of-type(2) > .card
	{
		height: 240px;
	}

	.e-39331e5b > .holder > .title
	{
		font-size: 30px;
	}

	.e-39331e5b .card > .label
	{
		font-size: 20px;
	}
}

@media (max-width: 640px)
{
	.e-39331e5b > .holder > .grid
	{
		gap: 18px;
	}

	.e-39331e5b > .holder > .grid > .row
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-39331e5b > .holder > .grid > .row > .card,
	.e-39331e5b > .holder > .grid > .row:nth-of-type(1) > .card,
	.e-39331e5b > .holder > .grid > .row:nth-of-type(2) > .card
	{
		height: 220px;
	}

	.e-39331e5b > .holder > .title
	{
		font-size: 26px;
	}

	.e-39331e5b .card > .label
	{
		padding: 10px 16px;
		font-size: 19px;
	}
}

/* ===== END: section-travel-mozaik-2 ===== */
/* ===== BEGIN: section-travel-slider-1 ===== */

.e-7a8769da
{
	display: block;
	width: 100%;
}

.e-7a8769da > .holder
{
	width: 100%;
	outline: none;
}

/* ===== STAGE ===== */

.e-7a8769da .stage
{
	position: relative;
}

/* ===== VIEWPORT + TRACK ===== */

.e-7a8769da .viewport
{
	position: relative;
	overflow: hidden;
	padding: 12px 34px;
}

.e-7a8769da .track
{
	display: flex;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL + CARD (tall portrait, full-cover image) ===== */

.e-7a8769da .cell
{
	flex: 0 0 calc(100% / var(--per-view, 5.2));
	max-width: calc(100% / var(--per-view, 5.2));
	padding: 0 8px;
	box-sizing: border-box;
}

.e-7a8769da .card
{
	position: relative;
	display: block;
	aspect-ratio: 3 / 4.4;
	text-decoration: none;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	box-shadow: 0 14px 34px rgba(20, 18, 16, 0.22);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-7a8769da .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 22px 48px rgba(20, 18, 16, 0.30);
}

.e-7a8769da .card > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-7a8769da .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== DARK GRADIENT — tamnije na vrhu i na dnu, providno u sredini ===== */

.e-7a8769da .card > .card-shade
{
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to bottom, rgba(10, 11, 14, 0.72) 0%, rgba(10, 11, 14, 0.28) 22%, rgba(10, 11, 14, 0) 42%),
		linear-gradient(to top, rgba(10, 11, 14, 0.86) 0%, rgba(10, 11, 14, 0.44) 30%, rgba(10, 11, 14, 0) 58%);
	transition: opacity 320ms ease;
}

.e-7a8769da .card:hover > .card-shade
{
	opacity: 0.92;
}

/* ===== CARD TOP (badge, price, duration) ===== */

.e-7a8769da .card > .card-top
{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 20px 20px 0;
}

.e-7a8769da .badge
{
	display: inline-flex;
	align-items: center;
	margin-bottom: 8px;
	padding: 6px 12px;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	line-height: 1;
}

.e-7a8769da .badge--promo
{
	background: #f5c518;
	color: #1a1400;
}

.e-7a8769da .badge--new
{
	background: #e0218a;
	color: white;
}

.e-7a8769da .price-label
{
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: rgba(255, 255, 255, 0.85);
}

.e-7a8769da .price
{
	font-size: 30px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.01em;
	color: white;
}

.e-7a8769da .duration
{
	margin-top: 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.8);
}

/* ===== CARD BODY (country, serif title, description, link — bottom) ===== */

.e-7a8769da .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 20px 20px 22px;
}

.e-7a8769da .card-country
{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.9);
}

.e-7a8769da .card-title
{
	font-family: Georgia, 'Times New Roman', 'Playfair Display', serif;
	font-weight: 700;
	font-size: 25px;
	line-height: 1.12;
	letter-spacing: 0.005em;
	color: white;
}

.e-7a8769da .card-desc
{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 13px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.82);
}

.e-7a8769da .card-cta
{
	margin-top: 4px;
	padding-bottom: 4px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.14em;
	color: white;
	transition: border-color 240ms ease, letter-spacing 240ms ease;
}

.e-7a8769da .card:hover .card-cta
{
	border-color: white;
	letter-spacing: 0.18em;
}

/* ===== ARROWS (circular, vertically centered over the edges) ===== */

.e-7a8769da .arrow
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: rgba(28, 31, 38, 0.92);
	border: 0;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 10px 26px rgba(20, 18, 16, 0.28);
	transition: background 240ms ease, transform 240ms ease;
}

.e-7a8769da .arrow-prev
{
	left: 2px;
}

.e-7a8769da .arrow-next
{
	right: 2px;
}

.e-7a8769da .arrow:hover
{
	background: black;
	transform: translateY(-50%) scale(1.06);
}

.e-7a8769da .arrow > i
{
	font-size: 22px;
}

/* ===== PROGRESS BAR (bottom center, gold fill) ===== */

.e-7a8769da .progress
{
	position: relative;
	width: 220px;
	max-width: 60%;
	height: 4px;
	margin: 26px auto 0;
	background: var(--ot-bg-3);
	border-radius: 100px;
	overflow: hidden;
}

.e-7a8769da .progress > .progress-fill
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #f5c518;
	border-radius: 100px;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), width 0.3s ease;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-7a8769da .viewport { padding: 12px 26px; }
	.e-7a8769da .price { font-size: 27px; }
	.e-7a8769da .card-title { font-size: 23px; }
}

@media (max-width: 640px)
{
	.e-7a8769da .viewport { padding: 10px 16px; }
	.e-7a8769da .cell { padding: 0 6px; }
	.e-7a8769da .price { font-size: 26px; }
	.e-7a8769da .card-title { font-size: 22px; }
	.e-7a8769da .arrow { width: 42px; height: 42px; }
	.e-7a8769da .progress { max-width: 78%; }
}

/* ===== END: section-travel-slider-1 ===== */
/* ===== BEGIN: section-travel-styles-1 ===== */

.e-3d778d9b
{
	display: block;
	width: 100%;
	--ts-dark: #24303a;
	--ts-orange: #f57c00;
}

/* Pozadina sekcije (krem) dolazi iz section style.background full-bleed omotaca, ne odavde. */

.e-3d778d9b > .holder
{
	width: 100%;
}

/* ===== HEADER (levo poravnat krupan tamni sans-serif naslov + sivi podnaslov) ===== */

.e-3d778d9b > .holder > .head
{
	margin-bottom: 28px;
	text-align: left;
}

/* Sites app globalno postavlja serif na sve h1-h6, pa se sans-serif mora eksplicitno vratiti. */

.e-3d778d9b .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 38px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--ts-dark);
}

.e-3d778d9b .subtitle
{
	margin: 10px 0 0;
	max-width: 720px;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-3);
}

/* ===== GRID (jedan red: dve siroke kartice jednake sirine i visine) ===== */

.e-3d778d9b .grid
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px;
	align-items: stretch;
}

/* ===== CARD (velika slika gore, tekst ispod, link prikacen za dno) ===== */

.e-3d778d9b .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 6px 18px rgba(36, 48, 58, 0.08);
	overflow: hidden;
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-3d778d9b .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(36, 48, 58, 0.16);
}

.e-3d778d9b .card-media
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.e-3d778d9b .card-image
{
	position: absolute;
	inset: 0;
	display: block;
	background-color: var(--ot-bg-2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-3d778d9b .card:hover .card-image
{
	transform: scale(1.04);
}

/* ===== CARD BODY (naslov, opis, prazan prostor, link na dnu) ===== */

.e-3d778d9b .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 22px 24px 24px;
}

.e-3d778d9b .card-body > .card-title
{
	font-family: var(--ot-font-primary);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--ts-dark);
}

.e-3d778d9b .card-body > .card-desc
{
	margin-top: 8px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-3);
}

/* Prazan prostor upija razliku u duzini opisa pa oba linka ostaju u istoj liniji. */

.e-3d778d9b .card-body > .spacer
{
	flex: 1;
	min-height: 16px;
}

.e-3d778d9b .card-body > .card-link
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ts-orange);
	transition: color var(--ot-transition);
}

.e-3d778d9b .card:hover .card-link
{
	color: #d96a00;
	text-decoration: underline;
}

/* ===== RESPONSIVE (tablet ostaje dve kolone, mobilni jedna) ===== */

@media (max-width: 1024px)
{
	.e-3d778d9b .title
	{
		font-size: 30px;
	}

	.e-3d778d9b .card-body > .card-title
	{
		font-size: 20px;
	}
}

@media (max-width: 720px)
{
	.e-3d778d9b .grid
	{
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px)
{
	.e-3d778d9b .card-body
	{
		padding: 18px 18px 20px;
	}
}

/* ===== END: section-travel-styles-1 ===== */
/* ===== BEGIN: section-travel-tips-1 (saveti i preporuke — karusel od 3 vidljive kartice sa strelicama sa strane) ===== */

.e-6813144f
{
	display: block;
	width: 100%;
}

.e-6813144f > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif) ===== */

.e-6813144f > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-6813144f > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== STAGE (karusel + strelice sa strane) ===== */

.e-6813144f > .holder > .stage
{
	position: relative;
	padding: 0 60px;
	outline: none;
}

.e-6813144f > .holder > .stage > .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
}

.e-6813144f > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (jednake sirine, razmak kroz padding) ===== */

.e-6813144f > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 3));
	padding: 0 12px;
}

/* ===== CARD (bela kartica, klikabilna, jednake visine) ===== */

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card
{
	display: flex;
	flex-direction: column;
	overflow: hidden;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
	transition: transform 220ms ease, box-shadow 220ms ease;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card:hover
{
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

/* ===== IMAGE (fiksne proporcije, iste visine u svim karticama) ===== */

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	background-color: var(--ot-bg-3);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 320ms ease;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card:hover > .card-image
{
	transform: scale(1.05);
}

/* ===== BADGE (zuta oznaka gore levo, samo na nekim karticama) ===== */

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-image > .badge
{
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-block;
	padding: 6px 10px;
	border-radius: 999px;
	background: #f5d94e;
	font-family: var(--ot-font-primary);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1;
	text-transform: uppercase;
	color: #24303a;
}

/* ===== BODY (naslov, opis, link na dnu) ===== */

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px 20px 20px 20px;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body > .card-name
{
	font-family: var(--ot-font-primary);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	color: #24303a;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body > .card-text
{
	margin-top: 8px;
	font-family: var(--ot-font-primary);
	font-size: 14.5px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--ot-text-2);
}

/* margin-top auto pribija link na DNO kartice — svi linkovi u istoj liniji. */

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body > .card-link
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: auto;
	padding-top: 16px;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	color: #e0701a;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body > .card-link > i
{
	font-size: 20px;
	line-height: 1;
	transition: transform 220ms ease;
}

.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card:hover > .card-body > .card-link > i
{
	transform: translateX(3px);
}

/* ===== ARROWS (kruzna dugmad sa strane, centrirana po visini kartica) ===== */

.e-6813144f > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(15, 23, 42, 0.10);
	border-radius: 50%;
	background: #ffffff;
	color: #24303a;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
	transform: translateY(-50%);
	transition: transform 220ms ease, background 220ms ease;
}

.e-6813144f > .holder > .stage > .arrow:hover
{
	background: #f2f2f2;
	transform: translateY(-50%) scale(1.06);
}

.e-6813144f > .holder > .stage > .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

/* Kad u tom smeru nema kuda — strelica ostaje vidljiva ali prigusena. */

.e-6813144f > .holder > .stage > .arrow.is-off
{
	color: rgba(36, 48, 58, 0.35);
	cursor: default;
	opacity: 0.55;
}

.e-6813144f > .holder > .stage > .arrow.is-off:hover
{
	background: #ffffff;
	transform: translateY(-50%);
}

.e-6813144f > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-6813144f > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-6813144f > .holder > .stage { padding: 0 50px; }
	.e-6813144f > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-6813144f > .holder > .stage
	{
		padding: 0;
	}

	.e-6813144f > .holder > .stage > .viewport > .track > .cell
	{
		padding: 0 6px;
	}

	.e-6813144f > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-6813144f > .holder > .stage > .arrow-prev { left: 6px; }
	.e-6813144f > .holder > .stage > .arrow-next { right: 6px; }

	.e-6813144f > .holder > .head > .title { font-size: 26px; }
	.e-6813144f > .holder > .stage > .viewport > .track > .cell > .card > .card-body > .card-name { font-size: 18px; }
}

/* ===== END: section-travel-tips-1 ===== */
/* ===== BEGIN: section-travel-ways-1 (red kartica načina putovanja) ===== */

.e-63612f23
{
	display: block;
	width: 100%;
}

.e-63612f23 > .holder
{
	width: 100%;
}

/* ===== TITLE (levo poravnat, tamni, jako bold; sans-serif eksplicitno jer sites globalno gura serif na h1-h6) ===== */

.e-63612f23 > .holder > .title
{
	margin: 0 0 24px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: left;
	color: var(--ot-text-1);
}

/* ===== GRID (4 kartice jednake širine i visine, jednak razmak) ===== */

.e-63612f23 > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}

/* ===== STAGE (opcioni slajder — strelice stoje SA STRANE reda, pa je pozornica uvucena) ===== */

.e-63612f23 > .holder > .stage
{
	position: relative;
	padding: 0 60px;
}

.e-63612f23 > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-63612f23 > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	margin: 0 -9px;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-63612f23 > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 4.5));
	max-width: calc(100% / var(--per-view, 4.5));
	padding: 0 9px;
	box-sizing: border-box;
}

.e-63612f23 > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.14);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-63612f23 > .holder > .stage > .arrow > i
{
	font-size: 24px;
	color: var(--ot-text-1);
}

.e-63612f23 > .holder > .stage > .arrow:hover
{
	background: #f1f4f8;
	transform: translateY(-50%) scale(1.06);
}

.e-63612f23 > .holder > .stage > .arrow.is-off
{
	opacity: 0.5;
	cursor: default;
}

.e-63612f23 > .holder > .stage > .arrow.is-off:hover
{
	background: #ffffff;
	transform: translateY(-50%);
}

.e-63612f23 > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-63612f23 > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== CARD (klikabilan link, full-cover slika, portret, zaobljeni uglovi) ===== */

.e-63612f23 .card
{
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 2 / 3;
	border-radius: 18px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.10);
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
}

.e-63612f23 .card::before
{
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-image: inherit;
	transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 0;
}

.e-63612f23 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.e-63612f23 .card:hover::before
{
	transform: scale(1.07);
}

/* ===== OVERLAY (blag tamni preliv samo pri dnu, radi čitljivosti) ===== */

.e-63612f23 .card > .overlay
{
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 45%, rgba(6, 10, 20, 0.70) 100%);
	transition: background 360ms ease;
}

.e-63612f23 .card:hover > .overlay
{
	background: linear-gradient(to bottom, rgba(6, 10, 20, 0) 35%, rgba(6, 10, 20, 0.82) 100%);
}

/* ===== NAME (naziv načina putovanja, dole levo, beo bold) ===== */

.e-63612f23 .card > .name
{
	position: absolute;
	left: 18px;
	right: 74px;
	bottom: 20px;
	z-index: 2;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
}

/* ===== ACTION (dole desno, beli krug sa tamnom dijagonalnom strelicom) ===== */

.e-63612f23 .card > .action
{
	position: absolute;
	right: 16px;
	bottom: 16px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
	transition: transform 260ms ease;
}

.e-63612f23 .card:hover > .action
{
	transform: scale(1.10);
}

.e-63612f23 .card > .action > i
{
	font-size: 22px;
	line-height: 1;
	color: var(--ot-text-1);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-63612f23 > .holder > .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-63612f23 > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-63612f23 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2.5));
		max-width: calc(100% / var(--per-view, 2.5));
	}

	.e-63612f23 > .holder > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-63612f23 > .holder > .grid
	{
		grid-template-columns: 1fr;
	}

	.e-63612f23 .card
	{
		aspect-ratio: 3 / 4;
	}

	.e-63612f23 > .holder > .stage
	{
		padding: 0;
	}

	.e-63612f23 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 1.4));
		max-width: calc(100% / var(--per-view, 1.4));
		padding: 0 6px;
	}

	.e-63612f23 > .holder > .stage > .viewport > .track
	{
		margin: 0 -6px;
	}

	.e-63612f23 > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-63612f23 > .holder > .stage > .arrow-prev { left: 4px; }
	.e-63612f23 > .holder > .stage > .arrow-next { right: 4px; }

	.e-63612f23 > .holder > .title { font-size: 26px; }
	.e-63612f23 .card > .name { font-size: 17px; }
}

/* ===== END: section-travel-ways-1 ===== */
/* ===== BEGIN: section-trip-cards-1 ===== */

.e-74fc3b9d
{
	display: block;
	width: 100%;
}

.e-74fc3b9d > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned) ===== */

.e-74fc3b9d > .holder > .title
{
	margin: 0 0 32px;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (4 columns x 3 rows, equal gap) ===== */

.e-74fc3b9d .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-74fc3b9d .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-74fc3b9d .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE + LABELS (bottom-left) ===== */

.e-74fc3b9d .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-74fc3b9d .card-image > .labels
{
	position: absolute;
	left: 10px;
	bottom: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	max-width: calc(100% - 20px);
}

.e-74fc3b9d .labels > .label
{
	display: inline-flex;
	align-items: center;
	padding: 3px 9px;
	background: var(--ot-brand);
	border-radius: var(--ot-radius-s);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.05em;
	line-height: 1.3;
	text-transform: uppercase;
	color: white;
	white-space: nowrap;
}

/* ===== CARD BODY (flex column, footer pinned to bottom) ===== */

.e-74fc3b9d .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	gap: 10px;
	padding: 16px;
	min-width: 0;
}

/* ===== TRIP NAME (bold dark, 1-2 lines) ===== */

.e-74fc3b9d .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

/* ===== META ROW (small grey icons + tiny dark text) ===== */

.e-74fc3b9d .card-body > .meta
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 16px;
	min-width: 0;
}

.e-74fc3b9d .meta > .meta-item
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 13px;
	color: var(--ot-text-1);
}

.e-74fc3b9d .meta-item > i
{
	font-size: 16px;
	line-height: 1;
	color: var(--ot-text-3);
}

/* ===== DATES ROW (bordered pills, optional) ===== */

.e-74fc3b9d .card-body > .dates
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	min-width: 0;
}

.e-74fc3b9d .dates > .date-pill
{
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
	white-space: nowrap;
}

/* ===== SPACER (stretches so the price row pins to the bottom) ===== */

.e-74fc3b9d .card-body > .spacer
{
	flex: 1;
	min-height: 8px;
}

/* ===== FOOTER (single left-aligned price row) ===== */

.e-74fc3b9d .card-body > .footer
{
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
}

.e-74fc3b9d .footer > .price-prefix,
.e-74fc3b9d .footer > .price-suffix
{
	font-size: 12px;
	color: var(--ot-text-1);
}

.e-74fc3b9d .footer > .old-price
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
	text-decoration: line-through;
}

.e-74fc3b9d .footer > .new-price
{
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	color: var(--ot-red);
	white-space: nowrap;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-74fc3b9d .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-74fc3b9d .grid
	{
		grid-template-columns: 1fr;
	}

	.e-74fc3b9d > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}
}

/* ===== END: section-trip-cards-1 ===== */
/* ===== BEGIN: section-trip-finder-1 ===== */

.e-287dbb4
{
	--tf-ink: #24303a;
	--tf-arrow-bg: #eef0f2;
	--tf-arrow-bg-hover: #e3e6ea;

	display: block;
}

.e-287dbb4 > .holder
{
	outline: none;
}

.e-287dbb4 > .holder > .title
{
	margin: 0 0 26px;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--tf-ink);
}

/* Strelice stoje SA STRANE reda kartica, pa je pozornica uvucena za njihovu sirinu. */

.e-287dbb4 > .holder > .stage
{
	position: relative;
	padding: 0 60px;
	outline: none;
}

.e-287dbb4 > .holder > .stage > .viewport
{
	overflow: hidden;
}

.e-287dbb4 > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

.e-287dbb4 > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 5.5));
	max-width: calc(100% / var(--per-view, 5.5));
	padding: 0 10px;
	box-sizing: border-box;
}

/* Kartica nema panel — slika, pa natpis ISPOD nje na pozadini sekcije. */

.e-287dbb4 > .holder > .stage > .viewport > .track > .cell > .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
}

.e-287dbb4 > .holder > .stage > .viewport > .track > .cell > .card > .card-image
{
	display: block;
	aspect-ratio: 5 / 4;
	overflow: hidden;
	border-radius: 10px;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-287dbb4 > .holder > .stage > .viewport > .track > .cell > .card:hover > .card-image
{
	transform: scale(1.05);
}

.e-287dbb4 > .holder > .stage > .viewport > .track > .cell > .card > .card-name
{
	display: block;
	margin-top: 14px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	color: var(--tf-ink);
}

/* Sive kruzne strelice levo i desno od reda, vertikalno centrirane. */

.e-287dbb4 > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 50%;
	background: var(--tf-arrow-bg);
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-287dbb4 > .holder > .stage > .arrow > i
{
	font-size: 24px;
	color: var(--tf-ink);
}

.e-287dbb4 > .holder > .stage > .arrow:hover
{
	background: var(--tf-arrow-bg-hover);
	transform: translateY(-50%) scale(1.06);
}

.e-287dbb4 > .holder > .stage > .arrow.is-off
{
	opacity: 0.5;
	cursor: default;
}

.e-287dbb4 > .holder > .stage > .arrow.is-off:hover
{
	background: var(--tf-arrow-bg);
	transform: translateY(-50%);
}

.e-287dbb4 > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-287dbb4 > .holder > .stage > .arrow-next
{
	right: 0;
}

@media (max-width: 1024px)
{
	.e-287dbb4 > .holder > .title
	{
		font-size: 28px;
	}

	.e-287dbb4 > .holder > .stage
	{
		padding: 0 50px;
	}

	.e-287dbb4 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 4.5));
		max-width: calc(100% / var(--per-view, 4.5));
	}
}

@media (max-width: 640px)
{
	.e-287dbb4 > .holder > .title
	{
		font-size: 24px;
		margin-bottom: 20px;
	}

	.e-287dbb4 > .holder > .stage
	{
		padding: 0;
	}

	.e-287dbb4 > .holder > .stage > .viewport > .track > .cell
	{
		flex: 0 0 calc(100% / var(--per-view, 2.4));
		max-width: calc(100% / var(--per-view, 2.4));
		padding: 0 6px;
	}

	.e-287dbb4 > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-287dbb4 > .holder > .stage > .arrow-prev
	{
		left: 4px;
	}

	.e-287dbb4 > .holder > .stage > .arrow-next
	{
		right: 4px;
	}
}

/* ===== END: section-trip-finder-1 ===== */
/* ===== BEGIN: section-trip-grid-1 ===== */

.e-55d77954
{
	display: block;
	width: 100%;
}

.e-55d77954 > .holder
{
	width: 100%;
}

/* ===== TITLE (left aligned) ===== */

.e-55d77954 > .holder > .title
{
	margin: 0 0 32px;
	text-align: left;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-text-1);
}

/* ===== GRID (4 columns x 2 rows, equal gap) ===== */

.e-55d77954 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-55d77954 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: var(--ot-radius-m);
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-55d77954 .card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.14);
}

/* ===== CARD IMAGE + OVERLAYS ===== */

.e-55d77954 .card > .card-image
{
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.e-55d77954 .card-image > .country
{
	position: absolute;
	top: 10px;
	left: 10px;
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background: #f5c518;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.2;
	color: #1a1205;
}

.e-55d77954 .card-image > .transport
{
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: white;
	border-radius: var(--ot-radius-s);
	box-shadow: 0 4px 12px rgba(20, 18, 16, 0.14);
}

.e-55d77954 .card-image > .transport > i
{
	font-size: 20px;
	line-height: 1;
	color: #7c3aed;
}

/* ===== CARD BODY (flex column, footer pinned to bottom) ===== */

.e-55d77954 .card > .card-body
{
	display: flex;
	flex-direction: column;
	flex: 1;
	box-sizing: border-box;
	padding: 16px;
}

/* ===== TRIP NAME (long, bold, purple, 2-3 lines) ===== */

.e-55d77954 .card-body > .name
{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	color: #7c3aed;
}

/* ===== DIVIDER (thin light line) ===== */

.e-55d77954 .card-body > .divider
{
	height: 1px;
	margin: 14px 0;
	background: var(--ot-bg-3-border);
}

/* ===== TERMINI (grows to equalize card heights) ===== */

.e-55d77954 .card-body > .termini
{
	display: flex;
	flex-direction: column;
	flex: 1;
}

.e-55d77954 .termini > .termini-label
{
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ot-text-1);
}

.e-55d77954 .termini > .pills
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
	margin-top: 8px;
}

.e-55d77954 .pills > .pill
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 6px;
	background: #efeafc;
	border-radius: var(--ot-radius-s);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	color: #2f2a3a;
}

.e-55d77954 .termini > .termini-text
{
	margin-top: 8px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--ot-text-2);
}

/* ===== FOOTER (green price + two buttons, bottom aligned) ===== */

.e-55d77954 .card-body > .footer
{
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: auto;
}

.e-55d77954 .footer > .price
{
	font-size: 20px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-green);
}

.e-55d77954 .footer > .actions
{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.e-55d77954 .actions > .btn
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	min-width: 0;
	box-sizing: border-box;
	padding: 10px 12px;
	border-radius: var(--ot-radius-s);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-align: center;
	transition: background 220ms ease, border-color 220ms ease, color 220ms ease;
}

.e-55d77954 .actions > .btn-solid
{
	background: #7c3aed;
	border: 1px solid #7c3aed;
	color: white;
}

.e-55d77954 .card:hover .actions > .btn-solid
{
	background: #6d28d9;
	border-color: #6d28d9;
}

.e-55d77954 .actions > .btn-outline
{
	background: transparent;
	border: 1px solid #7c3aed;
	color: #7c3aed;
}

.e-55d77954 .card:hover .actions > .btn-outline
{
	background: #7c3aed;
	color: white;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-55d77954 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-55d77954 .grid
	{
		grid-template-columns: 1fr;
	}

	.e-55d77954 > .holder > .title
	{
		margin-bottom: 24px;
		font-size: 28px;
	}

	.e-55d77954 .actions > .btn
	{
		flex: 1 1 100%;
	}
}

/* ===== END: section-trip-grid-1 ===== */
/* ===== BEGIN: section-trip-grid-2 ===== */

.e-55d77955
{
	display: block;
	width: 100%;
}

.e-55d77955 > .holder
{
	width: 100%;
}

/* ===== HEADER (opcioni levo poravnat naslov) ===== */

.e-55d77955 > .holder > .title
{
	margin: 0 0 24px;
	color: var(--ot-text-1);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.25;
}

/* ===== MREŽA 4x2 ===== */

.e-55d77955 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
}

/* ===== KARTICA (bela, klikabilna, jednake visine) ===== */

.e-55d77955 .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-55d77955 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

.e-55d77955 .card > .card-image
{
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-55d77955 .card:hover > .card-image
{
	transform: scale(1.06);
}

/* ===== TELO KARTICE (naziv, spacer, cena, koralni link) ===== */

.e-55d77955 .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 18px;
}

.e-55d77955 .card-body > .card-name
{
	color: var(--ot-text-1);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-55d77955 .card-body > .spacer
{
	flex: 1;
	min-height: 18px;
}

.e-55d77955 .card-body > .card-price
{
	color: var(--ot-text-1);
	font-size: 16px;
	font-weight: 700;
}

.e-55d77955 .card-body > .card-link
{
	margin-top: 10px;
	color: #ef6c57;
	font-size: 14px;
	font-weight: 500;
	transition: color var(--ot-transition);
}

.e-55d77955 .card:hover .card-link
{
	color: #d94f38;
	text-decoration: underline;
}

/* ===== RESPONSIVE (tablet 2 kolone, mobilni 1 kolona) ===== */

@media (max-width: 1024px)
{
	.e-55d77955 .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px)
{
	.e-55d77955 > .holder > .title
	{
		font-size: 24px;
	}

	.e-55d77955 .grid
	{
		grid-template-columns: repeat(1, 1fr);
	}
}

/* ===== END: section-trip-grid-2 ===== */
.e-351651c2
{
	display: block;
	width: 100%;
}

.e-351651c2 > .holder
{
	display: grid;
	grid-template-columns: repeat(var(--columns, 4), 1fr);
	gap: 0;
}

/* ===== ITEM ===== */

.e-351651c2 .item
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 0 28px;
	position: relative;
}

.e-351651c2 .item:first-child
{
	padding-left: 0;
}

.e-351651c2 .item:last-child
{
	padding-right: 0;
}

/* Border variant: dividers between items */

.e-351651c2 > .holder.border .item:not(:first-child)::before
{
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	bottom: 8px;
	width: 1px;
	background: var(--ot-bg-2-border);
}

/* ===== ICON ===== */

.e-351651c2 .item > .icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	background: var(--ot-brand-opacity);
	border-radius: 14px;
	flex-shrink: 0;
}

.e-351651c2 .item > .icon > i
{
	font-size: 24px;
	color: var(--ot-brand);
}

/* ===== STAT (when present, replaces icon) ===== */

.e-351651c2 .item > .stat
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	line-height: 1;
}

.e-351651c2 .item > .stat > .stat-value
{
	font-family: var(--ot-font-secondary);
	font-size: 56px;
	font-weight: 400;
	letter-spacing: -0.035em;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144;
}

.e-351651c2 .item > .stat > .stat-label
{
	font-size: 11px;
	font-weight: 700;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	margin-top: 6px;
}

/* Stats variant: bigger numbers, no description box */

.e-351651c2 > .holder.stats .item > .stat > .stat-value
{
	font-size: 72px;
}

.e-351651c2 > .holder.stats .item > .title
{
	font-size: 13px;
	font-weight: 600;
	color: var(--ot-text-2);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.e-351651c2 > .holder.stats .item > .description
{
	font-size: 13px;
	color: var(--ot-text-3);
}

/* ===== TITLE ===== */

.e-351651c2 .item > .title
{
	font-family: var(--ot-font-secondary);
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -0.012em;
	line-height: 1.25;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
}

/* ===== DESCRIPTION ===== */

.e-351651c2 .item > .description
{
	font-size: 13.5px;
	line-height: 1.65;
	color: var(--ot-text-2);
	margin: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1100px)
{
	.e-351651c2 > .holder
	{
		grid-template-columns: repeat(2, 1fr);
		gap: 32px 0;
	}

	.e-351651c2 .item
	{
		padding: 0 16px;
	}

	.e-351651c2 .item:nth-child(2n + 1)
	{
		padding-left: 0;
	}

	.e-351651c2 .item:nth-child(2n)
	{
		padding-right: 0;
	}

	.e-351651c2 > .holder.border .item:not(:first-child)::before
	{
		display: none;
	}

	.e-351651c2 > .holder.border .item:nth-child(2n)::before
	{
		display: block;
	}
}

@media (max-width: 600px)
{
	.e-351651c2 > .holder
	{
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.e-351651c2 .item
	{
		padding: 0;
	}

	.e-351651c2 > .holder.border .item:not(:first-child)::before
	{
		display: none;
	}

	.e-351651c2 .item > .stat > .stat-value
	{
		font-size: 44px;
	}
}
/* ===== BEGIN: section-trust-hero-1 ===== */

.e-575ed131
{
	display: block;
	width: 100%;
	background: #ffffff;
}

.e-575ed131 > .holder
{
	width: 100%;
}

/* ===== DEO 1: TAMNA TRAKA POVERENJA ===== */

.e-575ed131 .trustbar
{
	width: 100%;
	background: #16294d;
}

.e-575ed131 .trustbar-inner
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 34px;
	width: min(96%, 1360px);
	margin: 0 auto;
	padding: 10px 0;
}

.e-575ed131 .trustbar-item
{
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: #ffffff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
}

.e-575ed131 .trustbar-item > i
{
	font-size: 17px;
	color: #8fd3c1;
}

/* ===== DEO 2: BELI MENI ===== */

.e-575ed131 .menu
{
	display: flex;
	align-items: center;
	gap: 24px;
	width: 100%;
	padding: 16px 40px;
	background: #ffffff;
	box-shadow: 0 1px 0 var(--ot-bg-3-border);
}

.e-575ed131 .menu-logo
{
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	color: #16294d;
	font-weight: 900;
	font-size: 24px;
	letter-spacing: 0.04em;
	text-decoration: none;
}

.e-575ed131 .menu-logo > img
{
	display: block;
	height: 34px;
	width: auto;
}

.e-575ed131 .menu-nav
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 26px;
	flex: 1 1 auto;
	min-width: 0;
}

.e-575ed131 .menu-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-575ed131 .menu-link:hover
{
	color: #1f7a66;
}

.e-575ed131 .menu-link > i
{
	font-size: 19px;
}

.e-575ed131 .menu-actions
{
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.e-575ed131 .btn-ghost
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 20px;
	border: 1px solid #1f7a66;
	border-radius: 100px;
	color: #1f7a66;
	background: transparent;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-575ed131 .btn-ghost:hover
{
	background: #1f7a66;
	color: #ffffff;
}

.e-575ed131 .btn-solid
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	border: 1px solid #1f7a66;
	border-radius: 100px;
	background: #1f7a66;
	color: #ffffff;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-575ed131 .btn-solid:hover
{
	background: #17604f;
	transform: translateY(-1px);
}

.e-575ed131 .btn-ghost > i,
.e-575ed131 .btn-solid > i
{
	font-size: 18px;
}

.e-575ed131 .menu-search
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 50%;
	background: #ffffff;
	color: #16294d;
	cursor: pointer;
	transition: border-color var(--ot-transition), color var(--ot-transition);
}

.e-575ed131 .menu-search:hover
{
	border-color: #1f7a66;
	color: #1f7a66;
}

.e-575ed131 .menu-search > i
{
	font-size: 21px;
}

.e-575ed131 .menu-burger
{
	display: none;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	background: none;
	color: #16294d;
	cursor: pointer;
}

.e-575ed131 .menu-burger > i
{
	font-size: 30px;
}

/* ===== DEO 3: HERO SA LUKOM U DONJEM DESNOM UGLU ===== */

.e-575ed131 .hero-wrap
{
	position: relative;
	width: 100%;
}

.e-575ed131 .hero
{
	position: relative;
	width: 100%;
	min-height: 640px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-bottom-right-radius: 280px;
	overflow: hidden;
}

/* Blag preliv radi citljivosti belog teksta preko fotografije. */

.e-575ed131 .hero > .scrim
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(11, 22, 44, 0.36) 0%, rgba(11, 22, 44, 0.14) 40%, rgba(11, 22, 44, 0.10) 70%, rgba(11, 22, 44, 0.30) 100%);
}

.e-575ed131 .hero-content
{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 16px;
	width: min(94%, 1000px);
	margin: 0 auto;
	padding: 120px 0 250px;
}

.e-575ed131 .hero-title
{
	margin: 0;
	color: #ffffff;
	font-family: var(--ot-font-primary);
	font-weight: 800;
	font-size: 56px;
	line-height: 1.08;
	text-shadow: 0 3px 22px rgba(0, 0, 0, 0.45);
}

.e-575ed131 .hero-sub
{
	margin: 0;
	color: #ffffff;
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-style: italic;
	font-size: 24px;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
}

/* ===== DEO 4: TRI KARTICE KOJE LEBDE PREKO DNA HERO SLIKE ===== */

.e-575ed131 .cards
{
	position: relative;
	z-index: 3;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	width: min(94%, 1240px);
	margin: -190px auto 0;
}

.e-575ed131 .card
{
	position: relative;
	display: block;
	padding: 8px;
	background: #ffffff;
	border-radius: 18px;
	box-shadow: 0 18px 44px rgba(11, 22, 44, 0.20);
	text-decoration: none;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-575ed131 .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 24px 54px rgba(11, 22, 44, 0.26);
}

.e-575ed131 .card-photo
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 12px;
	background-color: var(--ot-bg-2);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.e-575ed131 .card-label
{
	position: absolute;
	left: 26px;
	bottom: 30px;
	max-width: calc(100% - 100px);
	color: #ffffff;
	font-weight: 800;
	font-size: 20px;
	line-height: 1.2;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

.e-575ed131 .card-go
{
	position: absolute;
	right: 26px;
	bottom: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #ffffff;
	color: #1f7a66;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-575ed131 .card:hover .card-go
{
	background: #1f7a66;
	color: #ffffff;
}

.e-575ed131 .card-go > i
{
	font-size: 22px;
}

/* ===== DEO 5: TRAKA ZA PRETRAGU SA RUKOPISNOM NAPOMENOM ===== */

.e-575ed131 .searchrow
{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: min(94%, 1240px);
	margin: 0 auto;
	padding: 54px 0 0;
}

.e-575ed131 .search
{
	display: flex;
	align-items: stretch;
	gap: 0;
	width: min(100%, 720px);
	padding: 8px 8px 8px 10px;
	background: #ffffff;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 100px;
	box-shadow: 0 12px 34px rgba(11, 22, 44, 0.12);
}

.e-575ed131 .field
{
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 0;
	min-width: 0;
	padding: 12px 18px;
	border: none;
	background: none;
	color: var(--ot-text-1);
	font-weight: 600;
	font-size: 15px;
	text-align: left;
	cursor: pointer;
}

.e-575ed131 .field-label
{
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-575ed131 .field-icon
{
	flex: 0 0 auto;
	font-size: 20px;
	color: #1f7a66;
}

.e-575ed131 .field-chev
{
	flex: 0 0 auto;
	font-size: 20px;
	color: var(--ot-text-3);
}

.e-575ed131 .divider
{
	flex: 0 0 auto;
	width: 1px;
	align-self: stretch;
	margin: 8px 0;
	background: var(--ot-bg-3-border);
}

.e-575ed131 .search-button
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex: 0 0 auto;
	padding: 14px 28px;
	border: none;
	border-radius: 100px;
	background: #1f7a66;
	color: #ffffff;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	cursor: pointer;
	transition: background var(--ot-transition), transform var(--ot-transition);
}

.e-575ed131 .search-button:hover
{
	background: #17604f;
	transform: translateY(-1px);
}

.e-575ed131 .search-button > i
{
	font-size: 19px;
}

/* Napomena je apsolutna da bi traka ostala tacno centrirana na strani. */

.e-575ed131 .hint
{
	position: absolute;
	top: 58%;
	left: calc(50% + 372px);
	display: flex;
	align-items: flex-start;
	gap: 6px;
	width: 200px;
}

.e-575ed131 .hint-arrow
{
	flex: 0 0 auto;
	font-size: 26px;
	color: #1f7a66;
	transform: rotate(-40deg);
}

.e-575ed131 .hint-text
{
	color: var(--ot-text-2);
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-style: italic;
	font-size: 16px;
	line-height: 1.3;
}

/* ===== DEO 6: RED POVERENJA ===== */

.e-575ed131 .proof
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px 16px;
	width: min(94%, 1240px);
	margin: 0 auto;
	padding: 34px 0 56px;
}

.e-575ed131 .proof-word
{
	color: var(--ot-text-1);
	font-weight: 800;
	font-size: 16px;
}

.e-575ed131 .proof-stars
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	color: #1f7a66;
}

/* Material Symbols ima FILL osu prikovanu na 0, pa pun glif dolazi iz Unicode zvezdice. */

.e-575ed131 .proof-star
{
	font-size: 21px;
	line-height: 1;
}

.e-575ed131 .proof-brand
{
	color: var(--ot-text-1);
	font-weight: 700;
	font-size: 16px;
}

.e-575ed131 .proof-logo
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 78px;
	margin-left: 10px;
	padding: 7px 14px;
	border: 1px solid var(--ot-bg-3-border);
	border-radius: 8px;
	color: var(--ot-text-3);
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.08em;
}

.e-575ed131 .proof-logo > img
{
	display: block;
	height: 22px;
	width: auto;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1240px)
{
	.e-575ed131 .hint
	{
		position: static;
		width: auto;
		margin-left: 18px;
	}

	.e-575ed131 .hint-text
	{
		max-width: 170px;
	}
}

@media (max-width: 1024px)
{
	.e-575ed131 .trustbar-inner
	{
		gap: 14px 20px;
		padding: 9px 16px;
	}

	.e-575ed131 .trustbar-item
	{
		font-size: 12px;
	}

	.e-575ed131 .menu
	{
		gap: 14px;
		padding: 12px 20px;
	}

	.e-575ed131 .menu-nav
	{
		display: none;
	}

	.e-575ed131 .menu-actions
	{
		margin-left: auto;
	}

	.e-575ed131 .menu-burger
	{
		display: inline-flex;
	}

	.e-575ed131 .hero
	{
		min-height: 540px;
		border-bottom-right-radius: 180px;
	}

	.e-575ed131 .hero-content
	{
		padding: 88px 0 210px;
	}

	.e-575ed131 .hero-title
	{
		font-size: 42px;
	}

	.e-575ed131 .cards
	{
		gap: 16px;
		margin-top: -160px;
	}

	.e-575ed131 .card-label
	{
		left: 20px;
		bottom: 24px;
		font-size: 17px;
	}

	.e-575ed131 .card-go
	{
		right: 18px;
		bottom: 20px;
		width: 38px;
		height: 38px;
	}

	.e-575ed131 .searchrow
	{
		flex-direction: column;
		gap: 12px;
		padding-top: 44px;
	}

	.e-575ed131 .hint
	{
		justify-content: center;
		margin-left: 0;
	}

	.e-575ed131 .hint-arrow
	{
		transform: rotate(-140deg);
	}

	.e-575ed131 .hint-text
	{
		max-width: none;
	}
}

@media (max-width: 640px)
{
	.e-575ed131 .trustbar
	{
		display: none;
	}

	.e-575ed131 .btn-ghost,
	.e-575ed131 .menu-search
	{
		display: none;
	}

	.e-575ed131 .menu-logo
	{
		font-size: 20px;
	}

	.e-575ed131 .btn-solid
	{
		padding: 10px 16px;
		font-size: 13px;
	}

	.e-575ed131 .hero
	{
		min-height: 420px;
		border-bottom-right-radius: 90px;
	}

	.e-575ed131 .hero-content
	{
		width: calc(100% - 32px);
		padding: 56px 0 120px;
		gap: 12px;
	}

	.e-575ed131 .hero-title
	{
		font-size: 30px;
	}

	.e-575ed131 .hero-sub
	{
		font-size: 19px;
	}

	.e-575ed131 .cards
	{
		grid-template-columns: 1fr;
		gap: 14px;
		margin-top: -80px;
	}

	.e-575ed131 .search
	{
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		width: 100%;
		padding: 12px;
		border-radius: 22px;
	}

	.e-575ed131 .field
	{
		width: 100%;
		padding: 12px 10px;
	}

	.e-575ed131 .divider
	{
		width: auto;
		height: 1px;
		align-self: auto;
		margin: 0 10px;
	}

	.e-575ed131 .search-button
	{
		width: 100%;
		margin-top: 8px;
		padding: 14px 22px;
	}

	.e-575ed131 .proof
	{
		padding: 26px 0 44px;
	}

	.e-575ed131 .proof-logo
	{
		margin-left: 0;
	}
}

/* ===== END: section-trust-hero-1 ===== */
/* ===== BEGIN: section-usluge-1 ===== */

.e-1fcefc27
{
	display: block;
	width: 100%;
}

.e-1fcefc27 > .holder
{
	width: 100%;
}

/* ===== INTRO (illustration left, blue title + paragraph right) ===== */

.e-1fcefc27 > .holder > .intro
{
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	align-items: center;
	gap: 40px;
	margin-bottom: 44px;
}

.e-1fcefc27 .intro > .intro-media
{
	width: 100%;
}

.e-1fcefc27 .intro-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l);
}

.e-1fcefc27 .intro-text > .title
{
	margin: 0 0 16px;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

.e-1fcefc27 .intro-text > .lead
{
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== GRID (4 equal cards per row, wraps down on smaller screens) ===== */

.e-1fcefc27 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-1fcefc27 .card
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
	height: 100%;
	padding: 28px 20px;
	text-align: center;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, border-color 320ms ease;
}

.e-1fcefc27 .card:hover
{
	transform: translateY(-6px);
	border-color: var(--ot-brand);
	box-shadow: 0 16px 36px rgba(20, 18, 16, 0.14);
}

/* ===== CARD ICON (filled blue circle with a white glyph) ===== */

.e-1fcefc27 .card > .card-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--ot-brand);
	color: white;
}

.e-1fcefc27 .card-icon > i
{
	font-size: 30px;
	line-height: 1;
}

/* ===== CARD NAME (uppercase bold blue, one or two lines) ===== */

.e-1fcefc27 .card > .card-name
{
	font-weight: 700;
	font-size: 14px;
	line-height: 1.35;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ot-brand);
}

/* ===== RESPONSIVE (3 tablet, 2 smaller tablet, 2 mobile; intro stacks) ===== */

@media (max-width: 1024px)
{
	.e-1fcefc27 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 820px)
{
	.e-1fcefc27 > .holder > .intro
	{
		grid-template-columns: 1fr;
		gap: 24px;
		margin-bottom: 32px;
	}

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

@media (max-width: 640px)
{
	.e-1fcefc27 .grid
	{
		gap: 16px;
	}

	.e-1fcefc27 .intro-text > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-usluge-1 ===== */
/* ===== BEGIN: section-usluge-2 ===== */

.e-1fcefc28
{
	display: block;
	width: 100%;
}

.e-1fcefc28 > .holder
{
	width: 100%;
}

/* ===== INTRO (centered blue title + paragraph, no illustration) ===== */

.e-1fcefc28 > .holder > .intro
{
	max-width: 720px;
	margin: 0 auto 44px;
	text-align: center;
}

.e-1fcefc28 .intro > .title
{
	margin: 0 0 16px;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

.e-1fcefc28 .intro > .lead
{
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== GRID (4 equal cards per row, wraps down on smaller screens) ===== */

.e-1fcefc28 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height) ===== */

.e-1fcefc28 .card
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
	height: 100%;
	padding: 28px 20px;
	text-align: center;
	text-decoration: none;
	background: white;
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, border-color 320ms ease;
}

.e-1fcefc28 .card:hover
{
	transform: translateY(-6px);
	border-color: var(--ot-brand);
	box-shadow: 0 16px 36px rgba(20, 18, 16, 0.14);
}

/* ===== CARD ICON (filled blue circle with a white glyph) ===== */

.e-1fcefc28 .card > .card-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--ot-brand);
	color: white;
}

.e-1fcefc28 .card-icon > i
{
	font-size: 30px;
	line-height: 1;
}

/* ===== CARD NAME (uppercase bold blue, one or two lines) ===== */

.e-1fcefc28 .card > .card-name
{
	font-weight: 700;
	font-size: 14px;
	line-height: 1.35;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ot-brand);
}

/* ===== RESPONSIVE (3 tablet, 2 smaller tablet, 2 mobile; intro tightens) ===== */

@media (max-width: 1024px)
{
	.e-1fcefc28 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 820px)
{
	.e-1fcefc28 > .holder > .intro
	{
		margin-bottom: 32px;
	}

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

@media (max-width: 640px)
{
	.e-1fcefc28 .grid
	{
		gap: 16px;
	}

	.e-1fcefc28 .intro > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-usluge-2 ===== */
/* ===== BEGIN: section-usluge-3 ===== */

.e-1fcefc29
{
	display: block;
	width: 100%;
}

.e-1fcefc29 > .holder
{
	width: 100%;
}

/* ===== INTRO (illustration left, blue title + paragraph right) ===== */

.e-1fcefc29 > .holder > .intro
{
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	align-items: center;
	gap: 40px;
	margin-bottom: 44px;
}

.e-1fcefc29 .intro > .intro-media
{
	width: 100%;
}

.e-1fcefc29 .intro-image
{
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--ot-radius-l);
}

.e-1fcefc29 .intro-text > .title
{
	margin: 0 0 16px;
	font-weight: 800;
	font-size: 34px;
	letter-spacing: -0.02em;
	line-height: 1.1;
	color: var(--ot-brand);
}

.e-1fcefc29 .intro-text > .lead
{
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ot-text-2);
}

/* ===== GRID (4 equal cards per row, wraps down on smaller screens) ===== */

.e-1fcefc29 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD (single clickable unit, equal height — rotated palette: blue card) ===== */

.e-1fcefc29 .card
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
	height: 100%;
	padding: 28px 20px;
	text-align: center;
	text-decoration: none;
	background: var(--ot-brand);
	border: 1px solid var(--ot-bg-3);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 6px 18px rgba(20, 18, 16, 0.06);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease, border-color 320ms ease;
}

.e-1fcefc29 .card:hover
{
	transform: translateY(-6px);
	border-color: white;
	box-shadow: 0 16px 36px rgba(20, 18, 16, 0.14);
}

/* ===== CARD ICON (filled white circle with a blue glyph — rotated palette) ===== */

.e-1fcefc29 .card > .card-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: white;
	color: var(--ot-brand);
}

.e-1fcefc29 .card-icon > i
{
	font-size: 30px;
	line-height: 1;
}

/* ===== CARD NAME (uppercase bold white, one or two lines — rotated palette) ===== */

.e-1fcefc29 .card > .card-name
{
	font-weight: 700;
	font-size: 14px;
	line-height: 1.35;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: white;
}

/* ===== RESPONSIVE (3 tablet, 2 smaller tablet, 2 mobile; intro stacks) ===== */

@media (max-width: 1024px)
{
	.e-1fcefc29 .grid
	{
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 820px)
{
	.e-1fcefc29 > .holder > .intro
	{
		grid-template-columns: 1fr;
		gap: 24px;
		margin-bottom: 32px;
	}

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

@media (max-width: 640px)
{
	.e-1fcefc29 .grid
	{
		gap: 16px;
	}

	.e-1fcefc29 .intro-text > .title
	{
		font-size: 26px;
	}
}

/* ===== END: section-usluge-3 ===== */
/* ===== BEGIN: section-vacation-picks (tri uspravne kartice tipova odmora — foto ili video + ukrasni natpis + bela pill dugmad) ===== */

.e-766d675c
{
	display: block;
	width: 100%;
}

.e-766d675c > .holder
{
	width: 100%;
}

/* ===== TITLE (jedan red, tri stila: crno bold + roze rukopis + crno bold) ===== */
/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-766d675c > .holder > .title
{
	margin: 0 0 26px 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: left;
	color: #111111;
}

.e-766d675c > .holder > .title > .title-accent
{
	/* Rukopisni rez ima kosi zavrsetak pa mu treba mrvica prostora sa obe strane. */
	padding: 0 8px 0 4px;
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 1.12em;
	font-style: italic;
	font-weight: 400;
	color: #e6197d;
}

/* ===== GRID (tri uspravne kartice; aspect-ratio drzi jednake visine) ===== */

.e-766d675c > .holder > .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: stretch;
	gap: 20px;
}

/* ===== CELL (nosac kartice; pauza stoji van linka da klik ne pokrene navigaciju) ===== */

.e-766d675c > .holder > .grid > .cell
{
	position: relative;
	display: block;
}

/* ===== CARD (cela klikabilna, medij preko cele povrsine) ===== */

.e-766d675c > .holder > .grid > .cell > .card
{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	aspect-ratio: 3 / 4;
	padding: 0 16px 22px 16px;
	overflow: hidden;
	border-radius: 12px;
	background-color: var(--ot-bg-3);
	text-decoration: none;
}

.e-766d675c > .holder > .grid > .cell > .card > .card-image,
.e-766d675c > .holder > .grid > .cell > .card > .card-video
{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: transform 420ms ease;
}

.e-766d675c > .holder > .grid > .cell > .card:hover > .card-image,
.e-766d675c > .holder > .grid > .cell > .card:hover > .card-video
{
	transform: scale(1.05);
}

/* ===== SHADE (blagi tamni preliv radi citljivosti belog teksta) ===== */

.e-766d675c > .holder > .grid > .cell > .card > .card-shade
{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.12) 40%, rgba(0, 0, 0, 0.62) 100%);
	transition: opacity 260ms ease;
}

.e-766d675c > .holder > .grid > .cell > .card:hover > .card-shade
{
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.22) 40%, rgba(0, 0, 0, 0.70) 100%);
}

/* ===== CAPTION (ukrasni beli natpis u gornjoj/srednjoj zoni, isti pojas na svim karticama) ===== */

.e-766d675c > .holder > .grid > .cell > .card > .caption
{
	position: absolute;
	top: 24%;
	left: 18px;
	right: 18px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	text-align: center;
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.e-766d675c > .holder > .grid > .cell > .card > .caption > .caption-star-row
{
	font-size: 13px;
	line-height: 1;
	letter-spacing: 5px;
	color: #ffffff;
}

.e-766d675c > .holder > .grid > .cell > .card > .caption > .caption-rule
{
	display: block;
	width: 62px;
	height: 2px;
	background: rgba(255, 255, 255, 0.85);
}

.e-766d675c > .holder > .grid > .cell > .card > .caption > .caption-text
{
	font-family: var(--ot-font-primary);
	line-height: 1.1;
}

.e-766d675c > .holder > .grid > .cell > .card > .caption-stars > .caption-text
{
	font-size: 27px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.e-766d675c > .holder > .grid > .cell > .card > .caption-block > .caption-text
{
	font-size: 34px;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.e-766d675c > .holder > .grid > .cell > .card > .caption-script > .caption-text
{
	font-family: 'Segoe Script', 'Brush Script MT', 'Snell Roundhand', cursive;
	font-size: 44px;
	font-style: italic;
	font-weight: 400;
}

/* ===== CTA (bela pill sa plavim tekstom, prikovana na dno i centrirana) ===== */

.e-766d675c > .holder > .grid > .cell > .card > .card-cta
{
	position: relative;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-width: calc(100% - 84px);
	min-height: 42px;
	margin: 0 auto;
	padding: 10px 22px;
	border-radius: 999px;
	background: #ffffff;
	font-family: var(--ot-font-primary);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	color: #2f6feb;
	transition: transform 220ms ease;
}

.e-766d675c > .holder > .grid > .cell > .card:hover > .card-cta
{
	transform: translateY(-2px);
}

/* ===== PAUSE (mala kontrola u donjem desnom uglu, samo na video karticama) ===== */

.e-766d675c > .holder > .grid > .cell > .card-pause
{
	position: absolute;
	right: 14px;
	bottom: 22px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85);
	color: #1b2434;
	cursor: pointer;
	transition: background 200ms ease;
}

.e-766d675c > .holder > .grid > .cell > .card-pause:hover
{
	background: #ffffff;
}

.e-766d675c > .holder > .grid > .cell > .card-pause > i
{
	font-size: 20px;
	line-height: 1;
}

.e-766d675c > .holder > .grid > .cell > .card-pause > .pause-off
{
	display: none;
}

.e-766d675c > .holder > .grid > .cell.is-paused > .card-pause > .pause-on
{
	display: none;
}

.e-766d675c > .holder > .grid > .cell.is-paused > .card-pause > .pause-off
{
	display: block;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-766d675c > .holder > .grid { gap: 16px; }
	.e-766d675c > .holder > .title { font-size: 30px; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-block > .caption-text { font-size: 27px; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-stars > .caption-text { font-size: 22px; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-script > .caption-text { font-size: 36px; }
	.e-766d675c > .holder > .grid > .cell > .card > .card-cta { font-size: 14px; padding: 9px 16px; max-width: calc(100% - 66px); }
}

@media (max-width: 640px)
{
	.e-766d675c > .holder > .grid { grid-template-columns: 1fr; gap: 16px; }
	.e-766d675c > .holder > .title { font-size: 26px; margin-bottom: 20px; }
	.e-766d675c > .holder > .grid > .cell > .card { aspect-ratio: 3 / 4; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-block > .caption-text { font-size: 34px; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-stars > .caption-text { font-size: 27px; }
	.e-766d675c > .holder > .grid > .cell > .card > .caption-script > .caption-text { font-size: 44px; }
	.e-766d675c > .holder > .grid > .cell > .card > .card-cta { font-size: 15px; padding: 10px 22px; max-width: calc(100% - 84px); }
}

/* ===== END: section-vacation-picks ===== */
/* ===== BEGIN: section-vacation-types-1 ===== */

.e-792d86eb
{
	display: block;
	width: 100%;
}

.e-792d86eb > .holder
{
	width: 100%;
}

/* ===== HEADER (left-aligned bold dark title + grey subtitle) ===== */

.e-792d86eb > .holder > .head
{
	margin-bottom: 28px;
}

.e-792d86eb .head > .title
{
	margin: 0;
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ot-text-1);
}

.e-792d86eb .head > .subtitle
{
	margin: 8px 0 0;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.4;
	color: var(--ot-text-2);
}

/* ===== ROWS (bento — unequal widths, equal height within a row) ===== */

.e-792d86eb .row
{
	display: grid;
	gap: 16px;
}

.e-792d86eb .row-1
{
	grid-template-columns: repeat(3, 1fr);
}

.e-792d86eb .row-2
{
	grid-template-columns: 1fr 1.25fr;
	margin-top: 16px;
}

.e-792d86eb .row-1 > .card
{
	height: 260px;
}

.e-792d86eb .row-2 > .card
{
	height: 320px;
}

/* ===== CARD (full-cover image, clickable, rounded) ===== */

.e-792d86eb .card
{
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--ot-radius-l);
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-792d86eb .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(20, 18, 16, 0.22);
}

.e-792d86eb .card > .card-image-wrap
{
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.e-792d86eb .card > .card-image-wrap > .card-image
{
	position: absolute;
	inset: 0;
	background-color: var(--ot-bg-3);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-792d86eb .card:hover > .card-image-wrap > .card-image
{
	transform: scale(1.06);
}

/* ===== DARK BOTTOM GRADIENT (readability) ===== */

.e-792d86eb .card > .card-shade
{
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(10, 10, 12, 0.82) 0%, rgba(10, 10, 12, 0.30) 34%, rgba(10, 10, 12, 0) 60%);
	transition: opacity 320ms ease;
}

.e-792d86eb .card:hover > .card-shade
{
	background: linear-gradient(to top, rgba(10, 10, 12, 0.88) 0%, rgba(10, 10, 12, 0.40) 38%, rgba(10, 10, 12, 0) 64%);
}

/* ===== CARD BODY (white name + thin chevron link, bottom-left) ===== */

.e-792d86eb .card > .card-body
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding: 18px 20px 20px;
}

.e-792d86eb .card-body > .card-name
{
	font-weight: 700;
	font-size: 22px;
	line-height: 1.15;
	color: white;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}

.e-792d86eb .card-body > .card-link
{
	display: inline-flex;
	align-items: center;
	gap: 2px;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.2;
	color: white;
	opacity: 0.9;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

.e-792d86eb .card-link > .chev
{
	font-family: 'Material Symbols Rounded', 'Material Symbols Outlined', 'Material Icons';
	font-size: 18px;
	line-height: 1;
	font-style: normal;
	transition: transform 260ms ease;
}

.e-792d86eb .card:hover .card-link > .chev
{
	transform: translateX(4px);
}

/* ===== RESPONSIVE — 2 columns on tablet, uniform heights ===== */

@media (max-width: 1024px)
{
	.e-792d86eb .head > .title { font-size: 27px; }

	.e-792d86eb .row-1,
	.e-792d86eb .row-2
	{
		grid-template-columns: 1fr 1fr;
	}

	.e-792d86eb .row-1 > .card,
	.e-792d86eb .row-2 > .card
	{
		height: auto;
		aspect-ratio: 16 / 10;
	}
}

/* ===== RESPONSIVE — 1 full-width column on mobile ===== */

@media (max-width: 640px)
{
	.e-792d86eb > .holder > .head { margin-bottom: 22px; }
	.e-792d86eb .head > .title { font-size: 23px; }
	.e-792d86eb .head > .subtitle { font-size: 15px; }

	.e-792d86eb .row-1,
	.e-792d86eb .row-2
	{
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.e-792d86eb .row-2 { margin-top: 14px; }

	.e-792d86eb .row-1 > .card,
	.e-792d86eb .row-2 > .card
	{
		height: auto;
		aspect-ratio: 16 / 10;
	}
}

/* ===== END: section-vacation-types-1 ===== */
/* ===== BEGIN: section-why-choose ===== */

.e-3b8f035e
{
	display: block;
	width: 100%;
}

.e-3b8f035e > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, uvodni pasus desno) ===== */

.e-3b8f035e > .holder > .head
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: start;
	margin-bottom: 38px;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-3b8f035e .head > .title
{
	max-width: 420px;
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: #16294d;
}

.e-3b8f035e .head > .intro
{
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	color: #55617a;
}

/* ===== GRID (tri kartice jednake sirine i jednake ukupne visine) ===== */

.e-3b8f035e .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	gap: 24px;
	align-items: stretch;
}

/* ===== KARTICA (bela; srednja obrce redosled slike i teksta) ===== */

.e-3b8f035e .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 22px rgba(15, 40, 80, 0.08);
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-3b8f035e .card.is-reverse
{
	flex-direction: column-reverse;
}

.e-3b8f035e .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(15, 40, 80, 0.16);
}

/* ===== MEDIA (ista visina bez obzira na to da li je slika gore ili dole) ===== */

.e-3b8f035e .card > .card-media
{
	position: relative;
	flex: 0 0 220px;
	display: block;
	overflow: hidden;
}

.e-3b8f035e .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-3b8f035e .card:hover .card-image
{
	transform: scale(1.06);
}

/* ===== TELO KARTICE (naslov + opis) ===== */

.e-3b8f035e .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 24px;
}

.e-3b8f035e .card-body > .card-title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.3;
	color: #16294d;
}

.e-3b8f035e .card-body > .card-desc
{
	margin: 10px 0 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
	color: #6b7280;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna sa slikom uvek gore) ===== */

@media (max-width: 1024px)
{
	.e-3b8f035e > .holder > .head
	{
		grid-template-columns: 1fr;
		gap: 16px;
		margin-bottom: 30px;
	}

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

@media (max-width: 640px)
{
	.e-3b8f035e .head > .title
	{
		font-size: 26px;
	}

	.e-3b8f035e .grid
	{
		grid-template-columns: 1fr;
	}

	.e-3b8f035e .card.is-reverse
	{
		flex-direction: column;
	}

	.e-3b8f035e .card > .card-media
	{
		flex: 0 0 190px;
	}
}

/* ===== END: section-why-choose ===== */
/* ===== BEGIN: section-why-travel-1 (zašto putovati sa nama — tekstualni karusel prednosti, bez slika) ===== */

.e-1af9d7a1
{
	display: block;
	width: 100%;
}

.e-1af9d7a1 > .holder
{
	width: 100%;
}

/* ===== HEAD (naslov levo, sans-serif) ===== */

.e-1af9d7a1 > .holder > .head
{
	margin: 0 0 28px 0;
	text-align: left;
}

/* Sans-serif eksplicitno jer sites globalno gura serif na h1-h6. */

.e-1af9d7a1 > .holder > .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #24303a;
}

/* ===== STAGE (karusel + strelice sa strane) ===== */

.e-1af9d7a1 > .holder > .stage
{
	position: relative;
	padding: 0 60px;
	outline: none;
}

.e-1af9d7a1 > .holder > .stage > .viewport
{
	position: relative;
	overflow: hidden;
	padding: 6px 0;
}

.e-1af9d7a1 > .holder > .stage > .viewport > .track
{
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

/* ===== CELL (jednake sirine, razmak kroz padding) ===== */

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell
{
	flex: 0 0 calc(100% / var(--per-view, 3));
	box-sizing: border-box;
	max-width: calc(100% / var(--per-view, 3));
	padding: 0 12px;
}

/* ===== CARD (bez slike, sadrzaj centriran po obe ose, jednake visine) ===== */

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card
{
	display: flex;
	box-sizing: border-box;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	min-height: 196px;
	padding: 34px 30px;
	border-radius: 10px;
	text-align: center;
	text-decoration: none;
	transition: transform 220ms ease, box-shadow 220ms ease, filter 220ms ease;
}

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card:hover
{
	transform: translateY(-3px);
	filter: brightness(0.97);
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.12);
}

/* ===== NAME (kratak naslov prednosti, velika slova) ===== */

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card > .card-name
{
	font-family: var(--ot-font-primary);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-transform: uppercase;
	color: #24303a;
}

/* ===== TEXT (opis od dva reda, sevron zavrsava POSLEDNJI red inline) ===== */

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card > .card-text
{
	display: block;
	margin-top: 12px;
	font-family: var(--ot-font-primary);
	font-size: 14.5px;
	font-weight: 400;
	line-height: 1.6;
	color: rgba(36, 48, 58, 0.72);
}

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card > .card-text > .card-text-body
{
	display: inline;
}

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card > .card-text > i
{
	display: inline;
	margin-left: 2px;
	font-size: 18px;
	line-height: 1;
	vertical-align: -4px;
	transition: transform 220ms ease;
}

.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card:hover > .card-text > i
{
	transform: translateX(3px);
}

/* ===== ARROWS (kruzna dugmad sa strane, centrirana po visini kartica) ===== */

.e-1af9d7a1 > .holder > .stage > .arrow
{
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(15, 23, 42, 0.10);
	border-radius: 50%;
	background: #ffffff;
	color: #24303a;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
	transform: translateY(-50%);
	transition: transform 220ms ease, background 220ms ease;
}

.e-1af9d7a1 > .holder > .stage > .arrow:hover
{
	background: #f2f2f2;
	transform: translateY(-50%) scale(1.06);
}

.e-1af9d7a1 > .holder > .stage > .arrow > i
{
	font-size: 26px;
	line-height: 1;
}

/* Kad u tom smeru nema kuda — strelica ostaje vidljiva ali prigusena. */

.e-1af9d7a1 > .holder > .stage > .arrow.is-off
{
	color: rgba(36, 48, 58, 0.35);
	cursor: default;
	opacity: 0.55;
}

.e-1af9d7a1 > .holder > .stage > .arrow.is-off:hover
{
	background: #ffffff;
	transform: translateY(-50%);
}

.e-1af9d7a1 > .holder > .stage > .arrow-prev
{
	left: 0;
}

.e-1af9d7a1 > .holder > .stage > .arrow-next
{
	right: 0;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 1024px)
{
	.e-1af9d7a1 > .holder > .stage { padding: 0 50px; }
	.e-1af9d7a1 > .holder > .head > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-1af9d7a1 > .holder > .stage
	{
		padding: 0;
	}

	.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell
	{
		padding: 0 6px;
	}

	.e-1af9d7a1 > .holder > .stage > .arrow
	{
		width: 40px;
		height: 40px;
	}

	.e-1af9d7a1 > .holder > .stage > .arrow-prev { left: 6px; }
	.e-1af9d7a1 > .holder > .stage > .arrow-next { right: 6px; }

	.e-1af9d7a1 > .holder > .head > .title { font-size: 26px; }

	/* Kartica je bez slike, pa strelice lebde nad samom povrsinom — bocni padding ih drzi dalje od teksta. */

	.e-1af9d7a1 > .holder > .stage > .viewport > .track > .cell > .card
	{
		padding: 30px 52px;
	}
}

/* ===== END: section-why-travel-1 ===== */
/* ===== BEGIN: section-winter-destinations-1 ===== */

.e-141d18ad
{
	display: block;
	width: 100%;
	--wd-navy: #16294d;
	--wd-grey: #6b7280;
	--wd-blue: #2f6feb;
	--wd-blue-dark: #2559c4;
	--wd-green: #dff3e4;
	--wd-green-text: #14532d;
}

.e-141d18ad > .holder
{
	width: 100%;
}

/* ===== HEAD (levo poravnat tamnoplavi sans naslov) ===== */

.e-141d18ad > .holder > .head
{
	margin-bottom: 26px;
	text-align: left;
}

/* Globalno pravilo daje svim h1-h6 serif --ot-font-secondary, pa naslov vraca sans eksplicitno. */

.e-141d18ad .head > .title
{
	margin: 0;
	font-family: var(--ot-font-primary);
	font-size: 34px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--wd-navy);
}

/* ===== MREZA (tri kartice po redu; nepopunjen red ostaje levo poravnat i iste sirine) ===== */

.e-141d18ad .grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
	align-items: stretch;
	justify-items: stretch;
	gap: 26px 24px;
}

/* ===== KARTICA ===== */

.e-141d18ad .card
{
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(16, 24, 40, 0.08);
	overflow: hidden;
	transition: transform var(--ot-transition), box-shadow var(--ot-transition);
}

.e-141d18ad .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(16, 24, 40, 0.16);
}

/* ===== MEDIA (slika na vrhu + svetlozelena sezonska pilula gore levo) ===== */

.e-141d18ad .card > .card-media
{
	position: relative;
	display: block;
	height: 210px;
	overflow: hidden;
}

.e-141d18ad .card-media > .card-image
{
	position: absolute;
	inset: 0;
	background-color: #eef2f6;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform var(--ot-transition);
}

.e-141d18ad .card:hover .card-image
{
	transform: scale(1.06);
}

.e-141d18ad .card-media > .card-badge
{
	position: absolute;
	top: 14px;
	left: 14px;
	display: inline-flex;
	align-items: center;
	max-width: calc(100% - 28px);
	padding: 6px 13px;
	border-radius: 100px;
	background: var(--wd-green);
	font-family: var(--ot-font-primary);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
	color: var(--wd-green-text);
	white-space: nowrap;
}

/* ===== TELO KARTICE (naziv + aerodrom + dugme prikovano na dno) ===== */

.e-141d18ad .card > .card-body
{
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 18px 20px 22px;
}

.e-141d18ad .card-body > .card-name
{
	font-family: var(--ot-font-primary);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.28;
	color: var(--wd-navy);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-141d18ad .card:hover .card-name
{
	color: var(--wd-blue);
}

.e-141d18ad .card-body > .card-airport
{
	margin-top: 7px;
	margin-bottom: 18px;
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--wd-grey);
}

/* margin-top: auto drzi dugme na dnu, pa se sva dugmad poklapaju u istoj liniji. */

.e-141d18ad .card-body > .card-cta
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: auto;
	min-height: 44px;
	padding: 0 22px;
	border-radius: 100px;
	background: var(--wd-blue);
	font-family: var(--ot-font-primary);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	transition: background var(--ot-transition);
}

.e-141d18ad .card-body > .card-cta:hover
{
	background: var(--wd-blue-dark);
}

.e-141d18ad .card-cta > .cta-arrow
{
	font-size: 15px;
}

/* ===== RESPONSIVE (tablet dve kolone, mobilni jedna sa dugmetom pune sirine) ===== */

@media (max-width: 1024px)
{
	.e-141d18ad .head > .title
	{
		font-size: 28px;
	}

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

@media (max-width: 640px)
{
	.e-141d18ad .head > .title
	{
		font-size: 24px;
	}

	.e-141d18ad .grid
	{
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.e-141d18ad .card > .card-media
	{
		height: 195px;
	}

	.e-141d18ad .card-body > .card-name
	{
		font-size: 19px;
	}

	.e-141d18ad .card-body > .card-cta
	{
		width: 100%;
	}
}

/* ===== END: section-winter-destinations-1 ===== */
.p-6bcc54f9 .content
{
	display: flex;
	flex-direction: column;
}

.p-6bcc54f9 .page-body
{
	padding: 80px 0 64px;
}

.p-6bcc54f9 .page-contact
{
	padding: 32px 32px 120px;
}

@media (max-width: 900px)
{
	.p-6bcc54f9 .page-body
	{
		padding: 56px 0 40px;
	}

	.p-6bcc54f9 .page-contact
	{
		padding: 24px 20px 80px;
	}
}
.e-49a5f2a5
{
	display: block;
	width: 100%;
	min-height: 100vh;
}

.e-49a5f2a5 > .split
{
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	min-height: 100vh;
	width: 100%;
}

/* ===== SHOWCASE ===== */

.e-49a5f2a5 > .split > .showcase
{
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
	padding: var(--ot-spacing-l);
	background-image: url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=1800&q=80');
	background-size: cover;
	background-position: center;
}

.e-49a5f2a5 > .split > .showcase > .overlay
{
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20, 20, 30, 0.15) 0%, rgba(20, 20, 30, 0.72) 100%);
	pointer-events: none;
}

.e-49a5f2a5 > .split > .showcase > .content
{
	position: relative;
	padding: 48px;
	color: white;
	max-width: 600px;
}

.e-49a5f2a5 > .split > .showcase > .content > .brand
{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 12px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.20);
	border-radius: 100px;
	margin-bottom: var(--ot-spacing-l);
	backdrop-filter: blur(12px);
}

.e-49a5f2a5 > .split > .showcase > .content > .brand > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 18px;
	color: white;
}

.e-49a5f2a5 > .split > .showcase > .content > .brand > span
{
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: white;
}

.e-49a5f2a5 > .split > .showcase > .content > h2
{
	font-family: var(--ot-font-secondary);
	font-size: 52px;
	font-weight: 400;
	line-height: 1.02;
	letter-spacing: -0.025em;
	color: white;
	margin: 0 0 var(--ot-spacing-m);
	font-variation-settings: 'opsz' 144;
}

.e-49a5f2a5 > .split > .showcase > .content > h2 em
{
	font-style: italic;
	color: white;
	opacity: 0.92;
}

.e-49a5f2a5 > .split > .showcase > .content > p
{
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
	max-width: 460px;
	margin: 0;
}

/* ===== FORM ===== */

.e-49a5f2a5 > .split > .form
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--ot-spacing-l);
	background: var(--ot-bg-1);
}

.e-49a5f2a5 > .split > .form > .holder
{
	width: 100%;
	max-width: 380px;
	display: flex;
	flex-direction: column;
	gap: var(--ot-spacing-m);
}

.e-49a5f2a5 > .split > .form > .holder > .header > h1
{
	font-family: var(--ot-font-secondary);
	font-size: 32px;
	font-weight: 400;
	color: var(--ot-text-1);
	margin: 0 0 6px;
	font-variation-settings: 'opsz' 144;
}

.e-49a5f2a5 > .split > .form > .holder > .header > p
{
	font-size: 14px;
	color: var(--ot-text-2);
	margin: 0;
}

.e-49a5f2a5 .auth-field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: var(--ot-spacing-s);
}

.e-49a5f2a5 .auth-field > label
{
	font-size: 12px;
	font-weight: 600;
	color: var(--ot-text-2);
}

.e-49a5f2a5 > .split > .form > .holder > .footer
{
	text-align: center;
	padding-top: var(--ot-spacing-s);
}

.e-49a5f2a5 > .split > .form > .holder > .footer > a
{
	font-size: 13px;
	color: var(--ot-text-2);
	text-decoration: none;
	transition: color var(--ot-transition);
}

.e-49a5f2a5 > .split > .form > .holder > .footer > a:hover
{
	color: var(--ot-brand);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 900px)
{
	.e-49a5f2a5 > .split
	{
		grid-template-columns: 1fr;
	}

	.e-49a5f2a5 > .split > .showcase
	{
		min-height: 280px;
	}
}
.p-41e4856a .content
{
	display: flex;
	flex-direction: column;
}

.p-41e4856a .listing
{
	display: grid;
	grid-template-columns: 320px 1fr;
	gap: 32px;
	padding: 48px 32px 96px;
	align-items: flex-start;
}

.p-41e4856a .listing-sidebar
{
	min-width: 0;
}

.p-41e4856a .listing-results
{
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.p-41e4856a .results-grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.p-41e4856a .atlas-card-link
{
	display: block;
	min-width: 0;
}

@media (max-width: 1300px)
{
	.p-41e4856a .results-grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 900px)
{
	.p-41e4856a .listing
	{
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 32px 20px 64px;
	}
}

@media (max-width: 600px)
{
	.p-41e4856a .results-grid
	{
		grid-template-columns: 1fr;
	}
}
.p-6950b728 .content
{
	display: flex;
	flex-direction: column;
}

.p-6950b728 .k-hero
{
	padding: 72px 32px 40px;
	text-align: center;
}

.p-6950b728 .k-hero-inner
{
	max-width: 760px;
	margin: 0 auto;
}

.p-6950b728 .k-hero-title
{
	margin: 0;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--ot-brand);
}

.p-6950b728 .k-hero-subtitle
{
	margin: 16px 0 0;
	font-size: 18px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.p-6950b728 .k-card-title
{
	margin: 0 0 20px;
	font-size: 20px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.p-6950b728 .k-card
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
	padding: 32px;
}

/* ===== 2. Centrala + pravni podaci ===== */

.p-6950b728 .k-primary
{
	padding: 24px 32px 40px;
}

.p-6950b728 .k-primary-grid
{
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 24px;
	max-width: 1120px;
	margin: 0 auto;
	align-items: start;
}

.p-6950b728 .k-central-rows
{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.p-6950b728 .k-central-row
{
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.p-6950b728 .k-central-icon
{
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: var(--ot-radius-m);
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

.p-6950b728 .k-central-icon i
{
	font-size: 24px;
}

.p-6950b728 .k-central-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.p-6950b728 .k-central-label
{
	font-size: 13px;
	color: var(--ot-text-3);
}

.p-6950b728 .k-central-value
{
	font-size: 16px;
	color: var(--ot-text-1);
	text-decoration: none;
}

.p-6950b728 a.k-central-value:hover
{
	color: var(--ot-brand);
}

.p-6950b728 .k-central-value.is-strong
{
	font-size: 20px;
	font-weight: 700;
}

.p-6950b728 .k-central-note
{
	font-size: 13px;
	color: var(--ot-text-3);
}

.p-6950b728 .k-central-hint
{
	margin: 24px 0 0;
	padding: 14px 16px;
	border-radius: var(--ot-radius-m);
	background: var(--ot-bg-2);
	font-size: 14px;
	line-height: 1.5;
	color: var(--ot-text-2);
}

.p-6950b728 .k-legal-rows
{
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.p-6950b728 .k-legal-row
{
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.p-6950b728 .k-legal-row:last-child
{
	border-bottom: none;
	padding-bottom: 0;
}

.p-6950b728 .k-legal-label
{
	margin: 0;
	font-size: 13px;
	color: var(--ot-text-3);
}

.p-6950b728 .k-legal-value
{
	margin: 0;
	font-size: 14px;
	text-align: right;
	color: var(--ot-text-2);
}

/* ===== 3. Poslovnice ===== */

.p-6950b728 .k-branches
{
	padding: 40px 32px;
	background: var(--ot-bg-2);
}

.p-6950b728 .k-branches-inner
{
	max-width: 1120px;
	margin: 0 auto;
}

.p-6950b728 .k-section-title
{
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.p-6950b728 .k-branches-head
{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	margin-bottom: 28px;
	flex-wrap: wrap;
}

.p-6950b728 .k-search
{
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 320px;
	padding: 0 16px;
	height: var(--ot-height-l);
	border-radius: var(--ot-radius-l);
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
}

.p-6950b728 .k-search-icon
{
	font-size: 20px;
	color: var(--ot-text-3);
}

.p-6950b728 .k-search-input
{
	flex: 1;
	border: none;
	outline: none;
	background: transparent;
	font-size: 15px;
	color: var(--ot-text-1);
}

.p-6950b728 .k-branches-split
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}

.p-6950b728 .k-branch-list
{
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.p-6950b728 .k-branch-card
{
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
	padding: 20px 24px;
}

.p-6950b728 .k-branch-name
{
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
	color: var(--ot-text-1);
}

.p-6950b728 .k-branch-row
{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 8px;
	font-size: 14px;
	color: var(--ot-text-2);
}

.p-6950b728 .k-branch-row:last-child
{
	margin-bottom: 0;
}

.p-6950b728 .k-branch-row i
{
	font-size: 18px;
	color: var(--ot-brand);
}

.p-6950b728 .k-branch-row a
{
	color: var(--ot-text-2);
	text-decoration: none;
}

.p-6950b728 .k-branch-row a:hover
{
	color: var(--ot-brand);
}

.p-6950b728 .k-branch-map
{
	position: sticky;
	top: 24px;
}

/* ===== 4. Kontakt forma ===== */

.p-6950b728 .k-form
{
	padding: 48px 32px;
}

/* ===== 5. Društvene mreže ===== */

.p-6950b728 .k-socials
{
	padding: 8px 32px 72px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

.p-6950b728 .k-socials-label
{
	font-size: 14px;
	color: var(--ot-text-3);
}

.p-6950b728 .k-socials-row
{
	display: flex;
	gap: 14px;
}

.p-6950b728 .k-social
{
	width: 48px;
	height: 48px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--ot-bg-2);
	color: var(--ot-text-2);
	transition: var(--ot-transition);
}

.p-6950b728 .k-social:hover
{
	background: var(--ot-brand);
	color: #ffffff;
}

/* ===== Responsive ===== */

@media (max-width: 900px)
{
	.p-6950b728 .k-hero
	{
		padding: 48px 20px 32px;
	}

	.p-6950b728 .k-hero-title
	{
		font-size: 36px;
	}

	.p-6950b728 .k-primary
	{
		padding: 16px 20px 32px;
	}

	.p-6950b728 .k-primary-grid
	{
		grid-template-columns: 1fr;
	}

	.p-6950b728 .k-card
	{
		padding: 24px;
	}

	.p-6950b728 .k-branches
	{
		padding: 32px 20px;
	}

	.p-6950b728 .k-search
	{
		min-width: 0;
		width: 100%;
	}

	.p-6950b728 .k-branches-split
	{
		grid-template-columns: 1fr;
	}

	.p-6950b728 .k-branch-map
	{
		position: static;
		order: -1;
	}

	.p-6950b728 .k-form
	{
		padding: 32px 20px;
	}

	.p-6950b728 .k-socials
	{
		padding: 8px 20px 56px;
	}
}
.e-54f75aaa
{
	display: contents;
}

.e-54f75aaa > .holder
{
	display: contents;
}

/* ===== Section spacing — veći vertikalni padding/margin SAMO za sekcije (page-sections) ===== */
/* Globalne ot-py-* ostaju netaknute. Vrednost = duplo od ot-spacing skale (s=20, m=40, l=80). */

/* Anchor sekcije — offset za sticky navbar (76px) pri skrolu na hash. */

.sp-anchor { scroll-margin-top: 92px; }

/* Numeracija sekcija — mali badge gore desno (radna pomoć, samo tema /3). */

.sp-item { position: relative; }

.sp-number
{
	position: absolute;
	top: 8px;
	right: 12px;
	z-index: 20;
	font-size: 11px;
	letter-spacing: 0.02em;
	padding: 2px 8px;
	border-radius: 100px;
	background: rgba(0, 0, 0, 0.55);
	color: #fff;
	pointer-events: none;
}

.sp-py-x { padding-top: var(--ot-spacing-s);  padding-bottom: var(--ot-spacing-s); }
.sp-py-s { padding-top: var(--ot-spacing-m);  padding-bottom: var(--ot-spacing-m); }
.sp-py-m { padding-top: var(--ot-spacing-l);  padding-bottom: var(--ot-spacing-l); }
.sp-py-l { padding-top: 60px; padding-bottom: 60px; }
.sp-py-xl { padding-top: 120px; padding-bottom: 120px; }

.sp-my-x { margin-top: var(--ot-spacing-s);  margin-bottom: var(--ot-spacing-s); }
.sp-my-s { margin-top: var(--ot-spacing-m);  margin-bottom: var(--ot-spacing-m); }
.sp-my-m { margin-top: var(--ot-spacing-l);  margin-bottom: var(--ot-spacing-l); }
.sp-my-l { margin-top: 60px; margin-bottom: 60px; }
.sp-my-xl { margin-top: 120px; margin-bottom: 120px; }

/* Granularno margin — samo top ili samo bottom (0 gasi). */

.sp-mt-0 { margin-top: 0; }
.sp-mt-x { margin-top: var(--ot-spacing-s); }
.sp-mt-s { margin-top: var(--ot-spacing-m); }
.sp-mt-m { margin-top: var(--ot-spacing-l); }
.sp-mt-l { margin-top: 60px; }
.sp-mt-xl { margin-top: 120px; }

.sp-mb-0 { margin-bottom: 0; }
.sp-mb-x { margin-bottom: var(--ot-spacing-s); }
.sp-mb-s { margin-bottom: var(--ot-spacing-m); }
.sp-mb-m { margin-bottom: var(--ot-spacing-l); }
.sp-mb-l { margin-bottom: 60px; }
.sp-mb-xl { margin-bottom: 120px; }

/* Granularno padding — samo top ili samo bottom (0 gasi). */

.sp-pt-0 { padding-top: 0; }
.sp-pt-x { padding-top: var(--ot-spacing-s); }
.sp-pt-s { padding-top: var(--ot-spacing-m); }
.sp-pt-m { padding-top: var(--ot-spacing-l); }
.sp-pt-l { padding-top: 60px; }
.sp-pt-xl { padding-top: 120px; }

.sp-pb-0 { padding-bottom: 0; }
.sp-pb-x { padding-bottom: var(--ot-spacing-s); }
.sp-pb-s { padding-bottom: var(--ot-spacing-m); }
.sp-pb-m { padding-bottom: var(--ot-spacing-l); }
.sp-pb-l { padding-bottom: 60px; }
.sp-pb-xl { padding-bottom: 120px; }

/* ===== TEMA 1 (config.theme = "1", ruta /theme-1) — tipografija ===== */
/* Pojedinacne sekcije eksplicitno postavljaju sans naslov (npr ".e-1af9d7a1 > .holder > .head > .title", 4 klase), pa tema mora da ih nadjaca. */
/* Prefiks ".e-54f75aaa > .holder.sp-theme-1" nosi 3 klase i svako pravilo ispod zavrsi na 5 klasa. */
/* Glavni naslovi idu u serif (--ot-font-secondary = Fraunces, isti font koji hero naslov vec koristi), a sve oko njih ostaje Inter u varijantama. */

/* Glavni naslovi sekcija — serif. */

.e-54f75aaa > .holder.sp-theme-1 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .intro > .title,
.e-54f75aaa > .holder.sp-theme-1 .hero-title
{
	font-family: var(--ot-font-secondary);
	letter-spacing: 0;
}

/* Nadnaslovi (eyebrow, sponzor red, hero eyebrow) — Inter 600, verzalno. */

.e-54f75aaa > .holder.sp-theme-1 .intro > .eyebrow,
.e-54f75aaa > .holder.sp-theme-1 .head > .sponsor-row > .sponsor,
.e-54f75aaa > .holder.sp-theme-1 .hero-eyebrow
{
	font-family: var(--ot-font-primary);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Podnaslovi ispod glavnog naslova — Inter 700. */

.e-54f75aaa > .holder.sp-theme-1 .head > .subtitle,
.e-54f75aaa > .holder.sp-theme-1 .intro > .subtitle,
.e-54f75aaa > .holder.sp-theme-1 .hero-subtitle
{
	font-family: var(--ot-font-primary);
	font-weight: 700;
}

/* Duzi uvodni pasus — Inter 400, prozracniji prored. */

.e-54f75aaa > .holder.sp-theme-1 .intro > .description
{
	font-family: var(--ot-font-primary);
	font-weight: 400;
	line-height: 1.75;
}

/* Editorijalne sekcije — opis u kurzivu. Ciljaju se BAS dva elementa preko svojih scope klasa (why-travel .e-1af9d7a1 i travel-tips .e-6813144f). */
/* Generickim imenom .card-text barata i active-trips (sekcije 20 i 60), koji mora da ostane uspravan. */

.e-54f75aaa > .holder.sp-theme-1 .e-1af9d7a1 .card-text > .card-text-body,
.e-54f75aaa > .holder.sp-theme-1 .e-6813144f .card-body > .card-text
{
	font-family: var(--ot-font-primary);
	font-style: italic;
	font-weight: 400;
}

/* ===== TEMA 1 — meni centriran po sredini strane ===== */
/* Tema se prosledjuje i globalnim (top) sekcijama, pa topbar (.e-47aff2f) i navbar (.e-452637df) ovde dobijaju rasporedjivanje. */
/* Trake ostaju pune sirine (pozadina ide od ivice do ivice), a sadrzaj se poravnava sa kolonom .ot-container-l */
/* preko paddinga: max(bocni padding kontejnera, polovina viska preko maksimalne sirine kolone). */
/* Omotac se NE koristi jer bi postao containing block i ubio position:sticky na navbaru. */

.e-54f75aaa > .holder.sp-theme-1 .e-47aff2f > .holder,
.e-54f75aaa > .holder.sp-theme-1 .e-452637df > .holder > .inner
{
	padding-left: max(calc(var(--ot-spacing-m) * 2), calc((100% - (1440px - var(--ot-spacing-m) * 4)) / 2));
	padding-right: max(calc(var(--ot-spacing-m) * 2), calc((100% - (1440px - var(--ot-spacing-m) * 4)) / 2));
}

/* Kolona je uza od podrazumevanog rasporeda navbara, pa se linkovi u temi drze zbijenije varijante na SVIM sirinama. */

.e-54f75aaa > .holder.sp-theme-1 .e-452637df > .holder > .inner > .links
{
	margin-left: 0;
}

.e-54f75aaa > .holder.sp-theme-1 .e-452637df .link
{
	padding: 10px 7px;
}

/* Izmedju 1361px (gde navbar jos prikazuje linkove) i 1400px kolona je uza od onoga sto svih 11 linkova trazi, */
/* pa se u tom pojasu linkovi dodatno stisnu umesto da desna grupa iscuri preko desne ivice kolone. */

@media (max-width: 1400px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-452637df .link
	{
		padding: 10px 5px;
	}
}

/* Ispod 900px kontejneri prelaze na jednostruki bocni razmak — meni ide za njima. */

@media (max-width: 900px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-47aff2f > .holder,
	.e-54f75aaa > .holder.sp-theme-1 .e-452637df > .holder > .inner
	{
		padding-left: var(--ot-spacing-m);
		padding-right: var(--ot-spacing-m);
	}
}

/* ===== TEMA 1 — sve sekcije u punoj sirini kolone ===== */
/* Referenca je sekcija "Letovanje" (active-trips, order 20): njen sadrzaj ide od ivice do ivice kolone .ot-container-l. */
/* Merenjem na 1440 odstupaju samo dva elementa: active-trips nosi plocu sa bocnim paddingom 40px, sponsored-hotels 32px. */
/* Obojene ploce i njihov vertikalni padding ostaju — nulira se iskljucivo bocni, da mreza dodirne ivicu kolone. */
/* Kod why-travel i travel-tips je red kartica uvucen 60px, ali to je zljeb u kome stoje strelice karusela — sekcija drzi punu sirinu. */

.e-54f75aaa > .holder.sp-theme-1 .e-1ae67f37 > .holder,
.e-54f75aaa > .holder.sp-theme-1 .e-5e42fbb5 > .holder
{
	padding-left: 0;
	padding-right: 0;
}

/* ===== TEMA 1 — jedinstvena tipografija glavnih naslova ===== */
/* Referentni naslov je "Evropski gradovi" (.e-5e42fbb5): Fraunces 34px / 800 / 1.15 / #24303a, izvorno prepisano iz why-travel.css. */
/* Porodicu fonta vec postavlja serifno pravilo teme iznad, a razmak izmedju slova je tamo svuda sveden na 0. */
/* Hero naslov (.e-fef9bfd) deli debljinu i visinu reda, ali ima svoju velicinu i belu boju jer stoji preko fotografije. */

.e-54f75aaa > .holder.sp-theme-1 .e-1ae67f37 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-7868f430 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-1af9d7a1 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-5e42fbb5 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-5fd1f102 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-6defae04 .intro > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-6813144f .head > .title
{
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
}

.e-54f75aaa > .holder.sp-theme-1 .e-1ae67f37 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-7868f430 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-1af9d7a1 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-5e42fbb5 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-5fd1f102 .head > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-6defae04 .intro > .title,
.e-54f75aaa > .holder.sp-theme-1 .e-6813144f .head > .title
{
	color: #24303a;
}

@media (max-width: 1024px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-1ae67f37 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-7868f430 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-1af9d7a1 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-5e42fbb5 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-5fd1f102 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-6defae04 .intro > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-6813144f .head > .title
	{
		font-size: 30px;
	}
}

@media (max-width: 640px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-1ae67f37 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-7868f430 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-1af9d7a1 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-5e42fbb5 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-5fd1f102 .head > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-6defae04 .intro > .title,
	.e-54f75aaa > .holder.sp-theme-1 .e-6813144f .head > .title
	{
		font-size: 26px;
	}
}

/* ===== TEMA 1 — glavni naslov hero slajdera ===== */
/* Naslov slajda ("Grcka — leto po tvojoj meri") do sada je delio velicinu sa naslovima sekcija (34/30/26px). */
/* Klijent trazi duplo vecu velicinu, pa hero dobija svoja tri praga; debljina i visina reda ostaju kao u temi. */

.e-54f75aaa > .holder.sp-theme-1 .e-fef9bfd .hero-title
{
	font-size: 68px;
	font-weight: 800;
	line-height: 1.15;
}

@media (max-width: 1024px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-fef9bfd .hero-title
	{
		font-size: 60px;
	}
}

@media (max-width: 640px)
{
	.e-54f75aaa > .holder.sp-theme-1 .e-fef9bfd .hero-title
	{
		font-size: 52px;
	}
}

/* ===== TEMA 1 — futer na dnu strane u svetlo plavoj ===== */
/* Globalna sekcija futera je podesena na tone-dark (tamna podloga, beo tekst) i deli se sa svim ostalim stranama sajta, */
/* pa se u temi ne dira njen config nego se povrsina prefarba i preslika kompletan set boja iz .tone-light varijante footer.css-a. */

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark
{
	background: #eaf4fb;
	color: var(--ot-text-2);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .brand > .brand-name,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .column-title,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .contact-title,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .contact-value
{
	color: var(--ot-text-1);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .link,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .contact-icon > i
{
	color: var(--ot-text-2);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .language,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .contact-label,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .trust-eyebrow,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .trust-logo,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .bottom-left,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .bottom-link
{
	color: var(--ot-text-3);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .brand-zone,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .main-zone,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .trust-zone
{
	border-bottom-color: var(--ot-bg-3-border);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .note-zone
{
	border-top-color: var(--ot-bg-3-border);
	color: var(--ot-text-3);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .languages
{
	background: var(--ot-bg-1);
	border-color: var(--ot-bg-2-border);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .language.active
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .social
{
	border-color: var(--ot-bg-3-border);
	color: var(--ot-text-2);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .contact-icon
{
	background: var(--ot-bg-3);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .trust-logo > img
{
	filter: grayscale(1);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .language:hover,
.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark a.trust-logo:hover
{
	color: var(--ot-text-1);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .link:hover
{
	color: var(--ot-brand);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .social:hover
{
	background: var(--ot-text-1);
	color: var(--ot-bg-1);
	border-color: var(--ot-text-1);
}

.e-54f75aaa > .holder.sp-theme-1 .e-55752aec > .holder.tone-dark .bottom-link:hover
{
	color: var(--ot-text-1);
	background: var(--ot-bg-1);
}

/* ===== TEME 6 i 8 — futer na dnu strane u toploj bez boji ===== */
/* Isti princip kao tema 1: globalni futer je tone-dark i deli se sa celim sajtom, pa se ovde samo prefarba. */
/* Sive vrednosti iz palete se na toploj podlozi gube, pa tema nosi svoje tople tonove teksta, ivica i povrsina. */
/* Naslovna /theme-8 nosi config.theme = "6" pa je vec pokrivena; lista /theme-8/ponude nosi theme = "8" da bi */
/* mogla da ima svoj skin, pa se futer deli kroz :is() i obe strane teme 8 stoje na istoj peskovitoj podlozi. */
/* Argumenti :is() su po jedna klasa, tako da specificnost ostaje ista kao pre. */

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark
{
	background: #ead5b9;
	color: #5a462e;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .brand > .brand-name,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .column-title,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .contact-title,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .contact-value
{
	color: #3b2a16;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .link,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .contact-icon > i
{
	color: #5a462e;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .language,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .contact-label,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .trust-eyebrow,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .trust-logo,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .bottom-left,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .bottom-link
{
	color: #6b573c;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .brand-zone,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .main-zone,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .trust-zone
{
	border-bottom-color: rgba(59, 42, 22, 0.20);
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .note-zone
{
	border-top-color: rgba(59, 42, 22, 0.20);
	color: #6b573c;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .languages
{
	background: rgba(255, 255, 255, 0.55);
	border-color: rgba(59, 42, 22, 0.20);
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .language.active
{
	background: #3b2a16;
	color: #ead5b9;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .social
{
	border-color: rgba(59, 42, 22, 0.20);
	color: #5a462e;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .contact-icon
{
	background: rgba(59, 42, 22, 0.09);
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .trust-logo > img
{
	filter: grayscale(1);
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .language:hover,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark a.trust-logo:hover,
.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .link:hover
{
	color: #3b2a16;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .social:hover
{
	background: #3b2a16;
	color: #ead5b9;
	border-color: #3b2a16;
}

.e-54f75aaa > .holder:is(.sp-theme-6, .sp-theme-8) .e-55752aec > .holder.tone-dark .bottom-link:hover
{
	color: #3b2a16;
	background: rgba(255, 255, 255, 0.55);
}

/* ===== TEMA 2 — jedinstvena tipografija glavnih naslova ===== */
/* Referentni naslov je "Gradovi i mesta po zemljama" (.e-24334945 .title): Inter 34px / 1.2 / navy #16294d. */
/* Zahtev je da svi glavni naslovi izgledaju tako, samo jos podebljanije, pa tema svuda gura tezinu 900. */
/* Bez ovoga naslovi mozaika i hotel-mozaik-a idu serifnim fontom, jer sites tema gura --ot-font-secondary na sve h1-h6. */
/* Ista globalna h1-h6 deklaracija u variables.css pribija i osu debljine promenljivog fonta ('wght' 400), */
/* pa gola tezina 900 ne bi promenila nista dok se ta osa ne prepise — mereno 491.84px pribijeno prema 516.72px na 900. */

.e-54f75aaa > .holder.sp-theme-2 .e-6b474285 > .holder > .stage .slide-title,
.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0e .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-101c6077 .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-5319357f .title,
.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0f .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-24334945 .title,
.e-54f75aaa > .holder.sp-theme-2 .e-202c02ec .text > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-63612f23 > .holder > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-4f7ee4a4 > .holder > .head > .title
{
	font-family: var(--ot-font-primary);
	font-weight: 900;
	font-variation-settings: 'wght' 900;
}

/* Velicinu i vodjenje dele samo naslovi sekcija; hero naslov zadrzava svoj clamp, a baner upita svoju banersku meru. */

.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0e .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-101c6077 .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-5319357f .title,
.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0f .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-24334945 .title,
.e-54f75aaa > .holder.sp-theme-2 .e-63612f23 > .holder > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-4f7ee4a4 > .holder > .head > .title
{
	font-size: 34px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

/* Boju uzimaju samo naslovi na svetloj podlozi — city-break stoji na tamnoj traci pa ostaje beo. */

.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0e .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-101c6077 .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0f .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-24334945 .title,
.e-54f75aaa > .holder.sp-theme-2 .e-63612f23 > .holder > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .head > .title,
.e-54f75aaa > .holder.sp-theme-2 .e-4f7ee4a4 > .holder > .head > .title
{
	color: #16294d;
}

@media (max-width: 1024px)
{
	.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0e .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-101c6077 .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-5319357f .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0f .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-24334945 .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-63612f23 > .holder > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-4f7ee4a4 > .holder > .head > .title
	{
		font-size: 30px;
	}
}

@media (max-width: 640px)
{
	.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0e .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-101c6077 .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-5319357f .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-23f7aa0f .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-24334945 .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-63612f23 > .holder > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .head > .title,
	.e-54f75aaa > .holder.sp-theme-2 .e-4f7ee4a4 > .holder > .head > .title
	{
		font-size: 26px;
	}
}

/* ===== TEMA 2 — futer na dnu strane u brend plavoj ===== */
/* Isti princip kao teme 1 i 6: globalni futer je tone-dark i deli se sa celim sajtom, pa se ovde samo prefarba. */
/* Podloga je brend plava #037ad5, pa sve mastilo ide u belo sa razlicitim stepenom prozirnosti. */

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark
{
	background: #037ad5;
	color: rgba(255, 255, 255, 0.86);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand > .brand-name,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .column-title,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .contact-title,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .contact-value
{
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .link,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .contact-icon > i
{
	color: rgba(255, 255, 255, 0.9);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .language,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .contact-label,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .trust-eyebrow,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .trust-logo,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .bottom-left,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .bottom-link
{
	color: rgba(255, 255, 255, 0.76);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand-zone,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .main-zone,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .trust-zone
{
	border-bottom-color: rgba(255, 255, 255, 0.28);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .note-zone
{
	border-top-color: rgba(255, 255, 255, 0.28);
	color: rgba(255, 255, 255, 0.76);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .languages
{
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.28);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .language.active
{
	background: #ffffff;
	color: #037ad5;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .social
{
	border-color: rgba(255, 255, 255, 0.32);
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .contact-icon
{
	background: rgba(255, 255, 255, 0.16);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .trust-logo > img
{
	filter: brightness(0) invert(1);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .language:hover,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark a.trust-logo:hover,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .link:hover
{
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .social:hover
{
	background: #ffffff;
	color: #037ad5;
	border-color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .bottom-link:hover
{
	color: #037ad5;
	background: #ffffff;
}

/* ===== TEMA 2 — plavi deo logotipa u futeru postaje beo ===== */
/* Logotip je jedan PNG: narandzasti znak zauzima kolone 0-33.64%, prazan procep ide do 37.16%, pa plavi natpis do kraja. */
/* Merenje je radjeno po kolonama piksela (1819x594), pa rez na 35% pada u sam procep i ne dodiruje ni jedno ni drugo slovo. */
/* Zato se sama slika sakriva, a crta se dva puta preko roditelja: levi rez ostaje u boji, desni se filterom pretvara u belo. */

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand
{
	position: relative;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand > .brand-logo
{
	opacity: 0;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand::before,
.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand::after
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('https://global.divhunt.com/bdf646ddbd25466a662abab6c85c83e7_82335.png');
	background-size: contain;
	background-position: left center;
	background-repeat: no-repeat;
	pointer-events: none;
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand::before
{
	clip-path: inset(0 65% 0 0);
}

.e-54f75aaa > .holder.sp-theme-2 .e-55752aec > .holder.tone-dark .brand::after
{
	clip-path: inset(0 0 0 35%);
	filter: brightness(0) invert(1);
}

/* ===== TEMA 2 — naziv hotela u velikim krugovima ide u Inter ===== */
/* Sam element (hotel-mozaik-11) crta naziv serifnim var(--ot-font-secondary); ovde se u okviru teme vraca na Inter. */
/* .card-title je span, ne naslov, pa ga globalno font-variation-settings pravilo ne dodiruje i debljina ostaje kakva jeste. */

.e-54f75aaa > .holder.sp-theme-2 .e-c90516b .card-title
{
	font-family: var(--ot-font-primary);
}

/* ===== TEMA 2 — talasasta traka promo banera dobija plavu temu ===== */
/* sale-banner drzi svoju nijansu u --sb-blue promenljivoj, pa je dovoljno pregaziti nju. */

.e-54f75aaa > .holder.sp-theme-2 .e-756a8ca8
{
	--sb-blue: #037ad5;
}

/* ===== TEMA 3 (config.theme = "3", ruta /theme-3) — jedinstven font glavnih naslova ===== */
/* Referentni naslov je "Grcka - Popularne destinacije" (.e-75a6f7c): element mu ne zadaje porodicu, */
/* pa ga pokriva globalno pravilo za h1-h6 i naslov se crta serifnim --ot-font-secondary. */
/* Tri sekcije na strani su porodicu eksplicitno vracale na sans (--ot-font-primary), sto je jedino */
/* odstupanje na strani; ovde se vracaju na istu serifnu porodicu, a velicine i boje ostaju njihove. */

.e-54f75aaa > .holder.sp-theme-3 .e-5d27025f > .holder > .head > .title,
.e-54f75aaa > .holder.sp-theme-3 .e-202c02ec .text > .title,
.e-54f75aaa > .holder.sp-theme-3 .e-694c905e .col-title
{
	font-family: var(--ot-font-secondary);
}

/* ========================================================================== */
/* ===== TAMNA LUKSUZNA BAZA — deljena osnova tema 6-dark i 7 =============== */
/* ========================================================================== */
/* Rute /theme-6-dark i /theme-7 nose config { "theme": "6-dark" } odnosno { "theme": "7" }, */
/* pa page-sections ispise klase sp-theme-6-dark odnosno sp-theme-7 na holderu. */
/* CSS poredi klase kao cele tokene, pa se pravila teme 6 (sp-theme-6) NE primenjuju ovde i obrnuto. */
/* Pozadine sekcija stizu inline iz baze (style.background), pa se tamna paleta upisuje u stranu, ne ovde. */
/* Obe teme dele isti skup pravila i razlikuju se samo vrednostima --dl-* promenljivih. */

/* ===== TAMNA LUKSUZNA BAZA — paleta ===== */
/* Podrazumevane vrednosti su tacno one koje tema 6-dark ima od pocetka: sampanj zlato na uglju. */
/* Tema 7 ih pregazi blokom na kraju fajla; broj klasa je isti, pa odlucuje redosled. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7)
{
	--dl-surface: #0b0b0c;
	--dl-surface-scrolled: rgba(11, 11, 12, 0.86);
	--dl-surface-deep: #161310;
	--dl-image: #1a1815;
	--dl-ink: #f3ece0;
	--dl-ink-86: rgba(243, 236, 224, 0.86);
	--dl-ink-78: rgba(243, 236, 224, 0.78);
	--dl-ink-76: rgba(243, 236, 224, 0.76);
	--dl-ink-72: rgba(243, 236, 224, 0.72);
	--dl-ink-68: rgba(243, 236, 224, 0.68);
	--dl-ink-56: rgba(243, 236, 224, 0.56);
	--dl-ink-on-gold: #161310;
	--dl-gold: #d9b26a;
	--dl-gold-hover: #c79e55;
	--dl-gold-wash: rgba(217, 178, 106, 0.14);
	--dl-gold-wash-strong: rgba(217, 178, 106, 0.24);
	--dl-gold-border: rgba(217, 178, 106, 0.32);
	--dl-gold-line: rgba(217, 178, 106, 0.22);
	--dl-gold-line-soft: rgba(217, 178, 106, 0.16);
	--dl-stars: #c9a227;
}

/* ===== TAMNA LUKSUZNA BAZA — zaglavlja sekcija ===== */
/* Naslov nema svoju boju u elementu nego nasledjuje --ot-text-1 iz globalnog h1-h6 pravila, pa se ovde prebojava. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-c90516b, .e-101c6073, .e-c90516d) .head > .title
{
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-c90516b, .e-101c6073, .e-c90516d) .head > .eyebrow
{
	color: var(--dl-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-c90516b, .e-101c6073, .e-c90516d) .eyebrow > .eyebrow-mark
{
	background: var(--dl-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-c90516b, .e-101c6073, .e-c90516d) .head > .subtitle
{
	color: var(--dl-ink-68);
}

/* ===== TAMNA LUKSUZNA BAZA — podloga slike u kartici ===== */
/* Dok se fotografija ne ucita svetla siva --ot-bg-3 bljesne preko tamne strane, pa se zamenjuje tamnom povrsinom. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-c90516b, .e-101c6073, .e-c90516d) .card-image
{
	background-color: var(--dl-image);
}

/* ===== TAMNA LUKSUZNA BAZA — tabovi u sekciji Letovanje ===== */
/* Neaktivan tab je siv tekst u svetlosivom okviru, pa na tamnoj podlozi nestane. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-101c6079 .tabs > .tab
{
	border-color: var(--dl-gold-border);
	color: var(--dl-ink-76);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-101c6079 .tabs > .tab:hover
{
	border-color: var(--dl-gold);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-101c6079 .tabs > .tab.is-active
{
	background: var(--dl-gold);
	border-color: var(--dl-gold);
	color: var(--dl-ink-on-gold);
}

/* ===== TAMNA LUKSUZNA BAZA — zlato umesto signalne zute ===== */
/* Zatecena #f5c518 je reklamna zuta; luksuzna varijanta je prigusen zlatan ton. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-23f7aa11 .card,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-23f7aa11, .e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-101c6073, .e-c90516d) .card-promo,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-101c6078, .e-101c6079, .e-101c6072) .foot > .cta
{
	background: var(--dl-gold);
	color: var(--dl-ink-on-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-23f7aa11 .card:hover .card-promo,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-c90516b .card-promo
{
	background: var(--dl-surface-deep);
	color: var(--dl-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-101c6078, .e-101c6079, .e-101c6072) .foot > .cta:hover
{
	background: var(--dl-gold-hover);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) :is(.e-101c6078, .e-101c6074, .e-101c6079, .e-101c6072, .e-101c6073, .e-c90516d) .card-stars
{
	color: var(--dl-stars);
}

/* ===== TAMNA LUKSUZNA BAZA — gornja traka sajta ===== */
/* Globalni topbar je tone-light; tema ga prefarbava bez diranja deljene konfiguracije sajta. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-47aff2f > .holder.tone-light
{
	background: var(--dl-surface);
	color: var(--dl-ink-72);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-47aff2f > .holder.tone-light .item:hover
{
	background: var(--dl-gold-wash);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-47aff2f > .holder.tone-light .item.phone
{
	color: var(--dl-ink);
}

/* ===== TAMNA LUKSUZNA BAZA — tanke linije oko navigacije ===== */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-20d399b0 > .holder.style-1 > .line
{
	background: var(--dl-gold-line);
}

/* ===== TAMNA LUKSUZNA BAZA — glavna navigacija ===== */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light
{
	background: var(--dl-surface);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light.scrolled
{
	background: var(--dl-surface-scrolled);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .link
{
	color: var(--dl-ink-78);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .link:hover
{
	background: var(--dl-gold-wash);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .link.active
{
	color: var(--dl-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .action
{
	color: var(--dl-ink-78);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .action:hover
{
	background: var(--dl-gold-wash);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .action > .action-badge
{
	border-color: var(--dl-surface);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .cta
{
	background: var(--dl-gold);
	color: var(--dl-ink-on-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .cta:hover
{
	background: var(--dl-gold-hover);
	color: var(--dl-ink-on-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .burger:hover
{
	background: var(--dl-gold-wash);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .burger-line
{
	background: var(--dl-ink);
}

/* ===== TAMNA LUKSUZNA BAZA — mobilna fioka navigacije ===== */
/* Fioka je fixed ali ostaje potomak navbar holdera, pa je tema dohvata i na 640px se ne otvara bela povrsina. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-panel,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-head
{
	background: var(--dl-surface);
	border-color: var(--dl-gold-line);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-item
{
	border-bottom-color: var(--dl-gold-line-soft);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-link
{
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-link:hover,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-sub-link.bottom
{
	color: var(--dl-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-sub-title,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-sub-icon
{
	color: var(--dl-ink-56);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-sub-link
{
	color: var(--dl-ink-76);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-sub-link:hover
{
	background: var(--dl-gold-wash);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-close
{
	background: var(--dl-gold-wash);
	color: var(--dl-ink-78);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-close:hover
{
	background: var(--dl-gold-wash-strong);
	color: var(--dl-ink);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-cta
{
	background: var(--dl-gold);
	color: var(--dl-ink-on-gold);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df .mobile-cta:hover
{
	background: var(--dl-gold-hover);
	color: var(--dl-ink-on-gold);
}

/* ===== TAMNA LUKSUZNA BAZA — logotip u navigaciji ===== */
/* Isti dvobojni PNG kao u temi 2: rez na 35% pada u procep izmedju znaka i natpisa, pa desna polovina ide u belo. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand
{
	position: relative;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand > .brand-logo
{
	opacity: 0;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand::before,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand::after
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('https://global.divhunt.com/bdf646ddbd25466a662abab6c85c83e7_82335.png');
	background-size: contain;
	background-position: left center;
	background-repeat: no-repeat;
	pointer-events: none;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand::before
{
	clip-path: inset(0 65% 0 0);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-452637df > .holder.tone-light .brand::after
{
	clip-path: inset(0 0 0 35%);
	filter: brightness(0) invert(1);
}

/* ===== TAMNA LUKSUZNA BAZA — info traka iznad navigacije ===== */
/* Zatecena tone-brand je signalna crvena; luksuzna varijanta je tamna povrsina sa zlatnim mastilom. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-7195b5f3 > .holder.tone-brand
{
	background: var(--dl-surface-deep);
	color: var(--dl-gold);
}

/* ===== TAMNA LUKSUZNA BAZA — pokretna traka na dnu ekrana ===== */
/* Traka je fixed preko celog dna, pa bi narandzasta ostala jedina svetla povrsina na tamnoj strani. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-4e98bf65 > .holder
{
	background: var(--dl-surface);
	color: var(--dl-ink-86);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-4e98bf65 > .holder > .label
{
	background: var(--dl-gold);
	color: var(--dl-ink-on-gold);
}

/* ===== TAMNA LUKSUZNA BAZA — futer ===== */
/* Globalni futer je tone-dark, ali njegova podloga je var(--ot-text-1) — boja teksta CELOG sajta */
/* (workspace_sites.color_text, koju core/back/items/commands/theme.js ubaci kao <style id="site-theme">). */
/* Na sajtu 332 je to tamnoplavo mastilo #1a093f, pa futer na tamnoj strani izgleda kao svetlija ploca. */
/* Boja se zato NE menja u bazi (prebojila bi naslove i tekst svih strana sajta) nego se prebija ovde, */
/* u scope-u teme, crnom povrsinom same teme; zlatna vlas odvaja futer od poslednje sekcije. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark
{
	background: var(--dl-surface);
	border-top: 1px solid var(--dl-gold-line);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .link:hover
{
	color: var(--dl-gold);
}

/* ===== TAMNA LUKSUZNA BAZA — plavi deo logotipa u futeru postaje beo ===== */
/* Na crnoj podlozi plavi natpis „travel" nestane, pa ide isti rez na 35% kao u temi 2 i u navigaciji. */

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand
{
	position: relative;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand > .brand-logo
{
	opacity: 0;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand::before,
.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand::after
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('https://global.divhunt.com/bdf646ddbd25466a662abab6c85c83e7_82335.png');
	background-size: contain;
	background-position: left center;
	background-repeat: no-repeat;
	pointer-events: none;
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand::before
{
	clip-path: inset(0 65% 0 0);
}

.e-54f75aaa > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-55752aec > .holder.tone-dark .brand::after
{
	clip-path: inset(0 0 0 35%);
	filter: brightness(0) invert(1);
}

/* ========================================================================== */
/* ===== TEMA 7 — crno-zlatna varijanta tamne luksuzne baze ================= */
/* ========================================================================== */
/* Ruta /theme-7 nosi config { "theme": "7" }. Klijent je trazio crne sekcije, a admin je odobrio */
/* kombinaciju crne i zlatne. Sve sekcije zato imaju #000000 u style.background u bazi, a ovde se */
/* menja samo paleta koju deljena baza vec cita — nijedno pravilo iznad se ne duplira. */
/* Broj klasa je isti kao u bazi (.e-54f75aaa + .holder + jedna tema), pa odlucuje redosled u fajlu. */

.e-54f75aaa > .holder.sp-theme-7
{
	--dl-surface: #000000;
	--dl-surface-scrolled: rgba(0, 0, 0, 0.86);
	--dl-surface-deep: #0a0a0a;
	--dl-image: #0f0f0f;
	--dl-ink: #f5f1e8;
	--dl-ink-86: rgba(245, 241, 232, 0.86);
	--dl-ink-78: rgba(245, 241, 232, 0.78);
	--dl-ink-76: rgba(245, 241, 232, 0.76);
	--dl-ink-72: rgba(245, 241, 232, 0.72);
	--dl-ink-68: rgba(245, 241, 232, 0.68);
	--dl-ink-56: rgba(245, 241, 232, 0.56);
	--dl-ink-on-gold: #0a0a0a;
	--dl-gold: #d4af37;
	--dl-gold-hover: #b9932c;
	--dl-gold-wash: rgba(212, 175, 55, 0.14);
	--dl-gold-wash-strong: rgba(212, 175, 55, 0.24);
	--dl-gold-border: rgba(212, 175, 55, 0.32);
	--dl-gold-line: rgba(212, 175, 55, 0.22);
	--dl-gold-line-soft: rgba(212, 175, 55, 0.16);
	--dl-stars: #d4af37;
}

/* ========================================================================== */
/* ===== TEMA 4 (config.theme = "4", ruta /theme-4) ========================= */
/* ========================================================================== */
/* Sve sekcije strane /theme-4 dele se sa ostalim stranama (overlap-cards-1 i -2 idu i na drugi sajt), */
/* pa se nijedan element fajl ne dira — ceo izgled teme zivi ovde, iza prefiksa .holder.sp-theme-4. */

/* ===== TEMA 4 — jedinstven font i boja glavnih naslova ===== */
/* Referenca je naziv kartice u slajderu ispod menija ("Leto u Tunisu", .e-6e587414 .card-name): */
/* taj span nema svoju porodicu pa nasledjuje body = --ot-font-primary (Inter). */
/* Cetiri overlap sekcije naslov crtaju serifom (Georgia), a travel-ways i blog-inspiration su vec Inter 800 — */
/* svih sest se ovde svodi na istu Inter 800 tipografiju i boju #182f52, dok velicine ostaju elementima (34/30/28px). */
/* font-variation-settings je OBAVEZAN: variables.css pribija 'wght' 400 na sva h1-h6, pa bi font-weight bez njega bio mrtav. */

.e-54f75aaa > .holder.sp-theme-4 .e-138f30fd > .holder > .title,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30fc > .holder > .title,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30fb > .holder > .title,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30f9 > .holder > .title,
.e-54f75aaa > .holder.sp-theme-4 .e-63612f23 > .holder > .title,
.e-54f75aaa > .holder.sp-theme-4 .e-5d27025f > .holder > .head > .title
{
	font-family: var(--ot-font-primary);
	font-weight: 800;
	font-variation-settings: 'wght' 800;
	letter-spacing: -0.01em;
	color: #182f52;
}

/* ===== TEMA 4 — naziv ponude na karticama ===== */
/* Sve cetiri overlap varijante naziv crtaju u var(--ot-brand), sto je za sajt 332 tacno #037AD5. */
/* Slajder ispod menija (.e-6e587414 .card-name) i blog kartice nose svoje tamne tonove i ostaju netaknuti. */

.e-54f75aaa > .holder.sp-theme-4 .e-138f30fd .card-body > .name,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30fc .card-body > .name,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30fb .card-body > .name,
.e-54f75aaa > .holder.sp-theme-4 .e-138f30f9 .card-body > .name
{
	color: #182f52;
}

/* ===== TEMA 4 — dugme sekcije Magazin preuzima dizajn dugmeta sekcije Daleka putovanja ===== */
/* Donor je .e-138f30f9 .foot > .cta (tirkizna pilula 48px, radius 999px); blog-inspiration ima plavi pravougaonik 46px/8px. */
/* Preslikavaju se samo vrednosti koje se razlikuju — poravnanje i margina .foot-a ostaju elementu. */

.e-54f75aaa > .holder.sp-theme-4 .e-5d27025f > .holder > .foot > .button
{
	min-height: 48px;
	padding: 0 34px;
	border-radius: 999px;
	background: #14b8a6;
	transition: background 200ms ease;
}

.e-54f75aaa > .holder.sp-theme-4 .e-5d27025f > .holder > .foot > .button:hover
{
	background: #0f9c92;
}

@media (max-width: 640px)
{
	.e-54f75aaa > .holder.sp-theme-4 .e-5d27025f > .holder > .foot > .button
	{
		width: 100%;
	}
}

/* ===== TEMA 4 — futer na dnu strane u tirkiznoj ===== */
/* Isti princip kao teme 1, 2 i 6: globalna sekcija futera je tone-dark i deli se sa celim sajtom, pa se ovde samo prefarba. */
/* Podloga #14b8a6 je ista tirkizna koju vec nose pilule i dugme sekcije Daleka putovanja, pa mastilo ide u belo sa stepenima prozirnosti. */

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark
{
	background: #14b8a6;
	color: rgba(255, 255, 255, 0.86);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .brand > .brand-name,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .column-title,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .contact-title,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .contact-value
{
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .link,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .contact-icon > i
{
	color: rgba(255, 255, 255, 0.9);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .language,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .contact-label,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .trust-eyebrow,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .trust-logo,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .bottom-left,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .bottom-link
{
	color: rgba(255, 255, 255, 0.78);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .brand-zone,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .main-zone,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .trust-zone
{
	border-bottom-color: rgba(255, 255, 255, 0.3);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .note-zone
{
	border-top-color: rgba(255, 255, 255, 0.3);
	color: rgba(255, 255, 255, 0.78);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .languages
{
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.3);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .language.active
{
	background: #ffffff;
	color: #0f766e;
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .social
{
	border-color: rgba(255, 255, 255, 0.34);
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .contact-icon
{
	background: rgba(255, 255, 255, 0.16);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .trust-logo > img
{
	filter: brightness(0) invert(1);
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .language:hover,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark a.trust-logo:hover,
.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .link:hover
{
	color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .social:hover
{
	background: #ffffff;
	color: #0f766e;
	border-color: #ffffff;
}

.e-54f75aaa > .holder.sp-theme-4 .e-55752aec > .holder.tone-dark .bottom-link:hover
{
	color: #0f766e;
	background: #ffffff;
}

/* ========================================================================== */
/* ===== TEMA 5 (config.theme = "5", ruta /theme-5) ========================= */
/* ========================================================================== */
/* Referentna sekcija strane je section-hotel-inspire-2 (.e-5118498) — zute kartice sa talasastim */
/* prelazom. Dve sekcije se na nju svode: city-explorer (.e-6059da07) i promo-banners (.e-629ff9af). */
/* Oba elementa se dele sa mnogo drugih strana (city-explorer 17, promo-banners 4), pa se element */
/* fajlovi ne prestiluju — ceo izgled teme zivi ovde, iza prefiksa .holder.sp-theme-5. */

/* ===== TEMA 5 — tabovi drzava preuzimaju zutu paletu referentne sekcije ===== */
/* Aktivan tab ide u #f5c518 sa tamnim mastilom #1c1a12 (telo zute kartice), neaktivni postaju bele */
/* pilule sa istom mekom senkom koju nose kartice, umesto brend-plave i sivog okvira. */

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .tabs > .tab
{
	background: var(--ot-bg-1);
	border-color: transparent;
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	color: #1c1a12;
}

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .tabs > .tab:hover
{
	border-color: transparent;
	box-shadow: 0 10px 24px rgba(20, 30, 55, 0.14);
}

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .tabs > .tab.active
{
	background: #f5c518;
	border-color: #f5c518;
	color: #1c1a12;
}

/* ===== TEMA 5 — mesto u mrezi postaje bela kartica sa dizanjem na hover ===== */
/* Radius, senka i pomeraj su prepisani sa .e-5118498 .card, pa mreza mesta cita kao isti sistem kartica. */

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item
{
	padding: 15px 18px;
	border-color: transparent;
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 320ms ease;
}

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item:hover
{
	background: var(--ot-bg-1);
	border-color: transparent;
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
	transform: translateY(-4px);
}

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item > .label
{
	font-weight: 700;
	color: #0d3b66;
}

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item > .pin,
.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item > .arrow,
.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item:hover > .arrow
{
	color: #0d3b66;
}

/* Broj ponuda uz mesto postaje ista pilula kakvu nose cipovi na zutim karticama. */

.e-54f75aaa > .holder.sp-theme-5 .e-6059da07 .item > .count
{
	padding: 2px 7px;
	border-radius: 100px;
	background: rgba(28, 26, 18, 0.10);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	color: #1c1a12;
}

/* ===== TEMA 5 — promo baneri dobijaju radius i senku kartica ===== */

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner
{
	border-radius: var(--ot-radius-l);
	box-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
}

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner:hover
{
	box-shadow: 0 18px 40px rgba(20, 30, 55, 0.16);
}

/* ===== TEMA 5 — kruzno ispupcenje banera postaje talas referentne sekcije ===== */
/* Maska je isti profil krive kao .e-5118498 .card > .wave, samo okrenut u vertikalu (x i y zamenjeni): */
/* teme krive su na 23 i 73 od 100 sirine trake. Boja i dalje stize kroz background-color: inherit, */
/* pa svaka kartica zadrzi svoj --pane ton. Ogledalni baner masku obrce preko scaleX(-1). */

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner .pane-wave
{
	border-radius: 0;
	-webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1200' preserveAspectRatio='none'><path d='M48,0 C23,200 73,400 48,600 C23,800 73,1000 48,1200 L100,1200 L100,0 Z' fill='%23ffffff'/></svg>");
	mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1200' preserveAspectRatio='none'><path d='M48,0 C23,200 73,400 48,600 C23,800 73,1000 48,1200 L100,1200 L100,0 Z' fill='%23ffffff'/></svg>");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner.is-photo-right .pane-wave
{
	transform: scaleX(-1);
}

/* Drugi, svetloplavi sloj talasa: crta se kao ::after samog banera da bi legao IZMEDJU fotografije */
/* (nepozicionirana, pa je nize u redosledu crtanja) i obojene povrsine (.banner-pane ima z-index: 1). */
/* Teme krive su pomerene na 5 i 55 tako da plavi sloj viri par piksela dublje u fotografiju. */

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner::after
{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(50% - 48px);
	z-index: 0;
	display: block;
	width: 86px;
	background-color: #8fc9f2;
	-webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1200' preserveAspectRatio='none'><path d='M30,0 C5,200 55,400 30,600 C5,800 55,1000 30,1200 L100,1200 L100,0 Z' fill='%23ffffff'/></svg>");
	mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1200' preserveAspectRatio='none'><path d='M30,0 C5,200 55,400 30,600 C5,800 55,1000 30,1200 L100,1200 L100,0 Z' fill='%23ffffff'/></svg>");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner.is-photo-right::after
{
	left: auto;
	right: calc(50% - 48px);
	transform: scaleX(-1);
}

/* Bez cene u bazi naziv destinacije vodi povrsinu, pa dobija velicinu koju je nosila cena. */

.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner .pane-name
{
	margin-top: 0;
	font-size: 34px;
	font-weight: 800;
	line-height: 1.1;
}

@media (max-width: 1024px)
{
	.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner .pane-name
	{
		font-size: 30px;
	}
}

@media (max-width: 560px)
{
	.e-54f75aaa > .holder.sp-theme-5 .e-629ff9af .banner .pane-name
	{
		font-size: 24px;
	}
}
.e-18c15f12
{
	display: block;
	width: 100%;
}

.e-18c15f12 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 48px;
	width: 100%;
	padding: 56px 0 96px;
}

/* ========================================== */
/* ===== HERO =============================== */
/* ========================================== */

.e-18c15f12 .hero
{
	display: flex;
	flex-direction: column;
	gap: 24px;
	text-align: center;
	align-items: center;
}

.e-18c15f12 .hero-meta
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	font-weight: 700;
	color: var(--ot-brand);
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.e-18c15f12 .hero-dot
{
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.5;
}

.e-18c15f12 .hero-reading
{
	color: var(--ot-text-3);
}

.e-18c15f12 .hero-title
{
	font-family: var(--ot-font-secondary);
	font-size: 52px;
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.08;
	color: var(--ot-text-1);
	margin: 0;
	font-variation-settings: 'opsz' 144;
	max-width: 14ch;
}

.e-18c15f12 .hero-lead
{
	font-size: 19px;
	line-height: 1.6;
	color: var(--ot-text-2);
	margin: 0;
	max-width: 620px;
}

/* Author */

.e-18c15f12 .hero-author
{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-top: 8px;
	padding-top: 24px;
	border-top: 1px solid var(--ot-bg-2-border);
}

.e-18c15f12 .hero-author-avatar
{
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid var(--ot-bg-2-border);
}

.e-18c15f12 .hero-author-text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	text-align: left;
}

.e-18c15f12 .hero-author-name
{
	font-size: 14px;
	font-weight: 600;
	color: var(--ot-text-1);
}

.e-18c15f12 .hero-author-role
{
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ot-text-3);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ========================================== */
/* ===== COVER ============================== */
/* ========================================== */

.e-18c15f12 .cover
{
	width: 100%;
}

.e-18c15f12 .cover-image
{
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--ot-radius-l);
}

/* ========================================== */
/* ===== BODY (e-global-markdown override) == */
/* Veći editorial tekst + Fraunces naslovi.   */
/* ========================================== */

.e-18c15f12 .body
{
	width: 100%;
}

.e-18c15f12 .body .prose
{
	font-size: 17px;
	line-height: 1.8;
	color: var(--ot-text-1);
}

.e-18c15f12 .body .prose :is(h1, h2, h3, h4)
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.02em;
	font-variation-settings: 'opsz' 144;
}

.e-18c15f12 .body .prose li::marker
{
	color: var(--ot-brand);
}

/* ========================================== */
/* ===== GALLERY ============================ */
/* ========================================== */

.e-18c15f12 .gallery
{
	width: 100%;
	margin-top: 16px;
}

/* ========================================== */
/* ===== RESPONSIVE ========================= */
/* ========================================== */

@media (max-width: 900px)
{
	.e-18c15f12 > .holder
	{
		gap: 36px;
		padding: 40px 0 72px;
	}

	.e-18c15f12 .hero-title
	{
		font-size: 38px;
	}

	.e-18c15f12 .hero-lead
	{
		font-size: 17px;
	}

	.e-18c15f12 .prose
	{
		font-size: 16px;
	}

	.e-18c15f12 .prose h2
	{
		font-size: 27px;
		margin-top: 44px;
	}
}

@media (max-width: 600px)
{
	.e-18c15f12 .hero-title
	{
		font-size: 30px;
	}

	.e-18c15f12 .cover-image
	{
		aspect-ratio: 4 / 3;
		border-radius: var(--ot-radius-m);
	}
}
.e-21ace7c7
{
	display: block;
	width: 100%;
}

.e-21ace7c7 > .holder
{
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Container (.ot-container-l) daje horizontalni okvir — element samo vertikalni razmak. */

.e-21ace7c7 > .holder > .hero-block
{
	padding-top: 40px;
}

/* Brand traka iza heroja ponude — boja sajta na velikoj površini. */

.e-21ace7c7 > .holder
{
	background: linear-gradient(180deg, var(--ot-brand-opacity) 0%, transparent 420px);
}

.e-21ace7c7 > .holder > .promo-bar
{
	padding-top: 20px;
}

.e-21ace7c7 > .holder > .promo-bar > .promo-inner
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 20px;
	border-radius: var(--ot-radius-l);
	background: var(--ot-brand-opacity);
	border: 1px solid var(--ot-brand);
	color: var(--ot-brand);
}

.e-21ace7c7 > .holder > .promo-bar > .promo-inner > .promo-icon
{
	font-family: 'Material Symbols Rounded';
	font-size: 22px;
	flex-shrink: 0;
}

.e-21ace7c7 > .holder > .promo-bar > .promo-inner > .promo-text
{
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
}

.e-21ace7c7 > .holder > .highlights-block
{
	padding-top: 20px;
}

.e-21ace7c7 > .holder > .gallery-block
{
	padding-top: 24px;
}

.e-21ace7c7 > .holder > .body-layout
{
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 48px;
	padding-top: 48px;
	padding-bottom: 96px;
	align-items: flex-start;
}

.e-21ace7c7 > .holder > .body-layout > .body-main
{
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.e-21ace7c7 > .holder > .body-layout > .body-sidebar
{
	min-width: 0;
	position: sticky;
	top: var(--ot-spacing-m);
}

.e-21ace7c7 .block-section
{
	display: flex;
	flex-direction: column;
	gap: 24px;
	scroll-margin-top: 160px;
}

.e-21ace7c7 .organizer-note > p
{
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--ot-text-3);
}

.e-21ace7c7 .organizer-note a
{
	color: var(--ot-brand);
	text-decoration: underline;
}

.e-21ace7c7 .organizer-note a:hover
{
	text-decoration: none;
}

@media (max-width: 1100px)
{
	.e-21ace7c7 > .holder > .body-layout
	{
		grid-template-columns: 1fr;
	}

	.e-21ace7c7 > .holder > .body-layout > .body-sidebar
	{
		position: relative;
		top: auto;
	}
}

@media (max-width: 900px)
{
	.e-21ace7c7 > .holder > .hero-block
	{
		padding-top: 28px;
	}

	.e-21ace7c7 > .holder > .body-layout
	{
		padding-top: 32px;
		padding-bottom: 64px;
		gap: 36px;
	}
}

/* ===== VIDEO ===== */

.e-21ace7c7 .video-frame
{
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--ot-radius-l);
	overflow: hidden;
	background: var(--ot-bg-2);
}

.e-21ace7c7 .video-frame > iframe
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* ===== CITIES (gradovi koji se obilaze) ===== */

.e-21ace7c7 .cities-grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
}

.e-21ace7c7 .cities-grid > .city-row
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
	color: var(--ot-text-1);
	text-decoration: none;
	transition: border-color 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.e-21ace7c7 .cities-grid > .city-row:hover
{
	border-color: var(--ot-brand-border);
	transform: translateY(-2px);
}

.e-21ace7c7 .cities-grid > .city-row > .city-cover
{
	width: 38px;
	height: 38px;
	border-radius: 50%;
	flex: none;
	background-size: cover;
	background-position: center;
	background-color: var(--ot-bg-3);
}

.e-21ace7c7 .cities-grid > .city-row > .city-icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	flex: none;
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
	font-size: 19px;
}

.e-21ace7c7 .cities-grid > .city-row > .city-name
{
	font-size: 14.5px;
	font-weight: 600;
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.e-21ace7c7 .cities-grid > .city-row > .city-arrow
{
	font-size: 17px;
	color: var(--ot-text-3);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), color 240ms;
}

.e-21ace7c7 .cities-grid > .city-row:hover > .city-arrow
{
	transform: translateX(3px);
	color: var(--ot-brand);
}

@media (max-width: 900px)
{
	.e-21ace7c7 .cities-grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px)
{
	.e-21ace7c7 .cities-grid
	{
		grid-template-columns: 1fr;
	}
}

/* ===================================================================== */
/* SKIN STRANICE POJEDINACNE PONUDE — TEME 6, 1, 3, 6-dark i 8.          */
/* Sve teme crtaju isti raspored, pa su strukturna pravila DELJENA        */
/* kroz :is(...), a razlike nose --td-* tokeni koje svaka                 */
/* tema postavlja u svom bloku ispod. Vrednosti su IZMERENE na naslovnoj  */
/* i listi svake teme, pa detalj ponude deli paletu, tipografiju, dugmad  */
/* i kartice sa stranama sa kojima se uskladjuje.                         */
/* Bez sp-theme-* klase strana izgleda bajt-identicno kao do sada.        */
/* ===================================================================== */

/* ===== TEMA 6 — tokeni ===== */
/* Izmereno na /theme-6 i /theme-6/ponude: peskana podloga #fdf9f3 sa     */
/* toplijom trakom #fbeedd iza heroja, mastilo #3b2a16, zuta CTA pilula   */
/* #f5c518 sa tamnim slovima i kartice uglova 10px.                       */

.e-21ace7c7 > .holder.sp-theme-6
{
	--td-ink: #3b2a16;
	--td-muted: #6b573c;
	--td-line: rgba(59, 42, 22, 0.18);
	--td-surface: #ffffff;
	--td-soft: #eaf4fb;
	--td-accent: #037ad5;
	--td-cta: #f5c518;
	--td-cta-ink: #1c1a12;
	--td-cta-hover: #f5c518;
	--td-cta-dim: 0.94;
	--td-cta-weight: 800;
	--td-card-shadow: rgba(59, 42, 22, 0.05) 0 1px 2px, rgba(59, 42, 22, 0.06) 0 8px 24px;
	--td-radius: 10px;
	--td-title-ls: -0.035em;
	--td-heading-ls: -0.025em;
	--td-card-font: var(--ot-font-secondary);
	--td-card-fvs: 'opsz' 144;
	--td-card-ink: #3b2a16;

	background: linear-gradient(180deg, #fbeedd 0%, rgba(251, 238, 221, 0) 420px) #fdf9f3;
	color: var(--td-ink);
}

/* ===== TEMA 1 — tokeni ===== */
/* Izmereno na /theme-1 i /theme-1/ponude: bela podloga sa svetlo plavom  */
/* trakom #eaf4fb iza heroja, mastilo naslova #24303a, siva #6b7280,      */
/* narandzasta CTA pilula #f5821e (hover #dc6f0f) sa belim slovima,       */
/* kartice uglova 12px sa senkom 0 6px 18px rgba(15, 23, 42, 0.06) i      */
/* nazivi kartica Inter 800 u #16294d. Akcent je brend boja sajta.        */

.e-21ace7c7 > .holder.sp-theme-1
{
	--td-ink: #24303a;
	--td-muted: #6b7280;
	--td-line: rgba(36, 48, 58, 0.12);
	--td-surface: #ffffff;
	--td-soft: #dceefb;
	--td-accent: #037ad5;
	--td-cta: #f5821e;
	--td-cta-ink: #ffffff;
	--td-cta-hover: #dc6f0f;
	--td-cta-dim: 1;
	--td-cta-weight: 700;
	--td-card-shadow: rgba(15, 23, 42, 0.04) 0 1px 2px, rgba(15, 23, 42, 0.06) 0 6px 18px;
	--td-radius: 12px;
	--td-title-ls: normal;
	--td-heading-ls: normal;
	--td-card-font: var(--ot-font-primary);
	--td-card-fvs: normal;
	--td-card-ink: #16294d;

	background: linear-gradient(180deg, #eaf4fb 0%, rgba(234, 244, 251, 0) 420px) #ffffff;
	color: var(--td-ink);
}

/* ===== TEMA 3 — tokeni ===== */
/* Izmereno na /theme-3 i /theme-3/ponude: bela podloga (body je beo na    */
/* obe strane) sa svetlo plavom trakom #eaf4fb iza heroja — plava je boja  */
/* prve sekcije naslovne. Mastilo naslova #10285c, akcent #10286b (naziv   */
/* kartice liste, eyebrow, upaljena strana paginacije), siva opisa         */
/* #48484c, linija rgba(16, 40, 92, 0.14). CTA je terakota pilula #d68a3a  */
/* sa belim slovima 700 (dugme „Pogledaj ponudu" na naslovnoj), kartice    */
/* uglova 10px sa senkom 0 10px 28px rgba(16, 40, 92, 0.14) i nazivi       */
/* kartica Inter 800 u #10286b.                                            */

.e-21ace7c7 > .holder.sp-theme-3
{
	--td-ink: #10285c;
	--td-muted: #48484c;
	--td-line: rgba(16, 40, 92, 0.14);
	--td-surface: #ffffff;
	--td-soft: #eaf4fb;
	--td-accent: #10286b;
	--td-cta: #d68a3a;
	--td-cta-ink: #ffffff;
	--td-cta-hover: #d68a3a;
	--td-cta-dim: 0.93;
	--td-cta-weight: 700;
	--td-card-shadow: rgba(16, 40, 92, 0.14) 0 10px 28px;
	--td-radius: 10px;
	--td-title-ls: -0.035em;
	--td-heading-ls: -0.02em;
	--td-card-font: var(--ot-font-primary);
	--td-card-fvs: normal;
	--td-card-ink: #10286b;

	background: linear-gradient(180deg, #eaf4fb 0%, rgba(234, 244, 251, 0) 420px) #ffffff;
	color: var(--td-ink);
}

/* ===== TEMA 6-DARK — tokeni ===== */
/* Vrednosti su PREPISANE sa naslovne /theme-6-dark (--dl-* u             */
/* sections.css) i sa liste /theme-6-dark/ponude (--dlist-* u             */
/* types/tours/1/1.css) — te promenljive zive na drugom podstablu pa se   */
/* ne mogu naslediti, moraju se ponoviti. Podloga je crna #0b0b0c sa      */
/* toplijom trakom #161310 iza heroja, mastilo je peskano #f3ece0, akcent */
/* i CTA su zlatni #d9b26a (hover #c79e55) sa tamnim slovima, kartice su  */
/* #161310 uglova 10px sa zlatnom hairline linijom.                       */

.e-21ace7c7 > .holder.sp-theme-6-dark
{
	--td-ink: #f3ece0;
	--td-muted: rgba(243, 236, 224, 0.68);
	--td-line: rgba(217, 178, 106, 0.22);
	--td-surface: #161310;
	--td-soft: rgba(217, 178, 106, 0.14);
	--td-accent: #d9b26a;
	--td-cta: #d9b26a;
	--td-cta-ink: #161310;
	--td-cta-hover: #c79e55;
	--td-cta-dim: 1;
	--td-cta-weight: 800;
	--td-card-shadow: rgba(0, 0, 0, 0.42) 0 14px 34px;
	--td-radius: 10px;
	--td-title-ls: -0.035em;
	--td-heading-ls: -0.025em;
	--td-card-font: var(--ot-font-secondary);
	--td-card-fvs: 'opsz' 144;
	--td-card-ink: #f3ece0;

	/* Tokeni ispod koristi samo dopunski blok tamne teme na dnu fajla. */
	--td-image: #1a1815;
	--td-deep: #0b0b0c;
	--td-stars: #c9a227;

	background: linear-gradient(180deg, #161310 0%, rgba(22, 19, 16, 0) 420px) #0b0b0c;
	color: var(--td-ink);
}

/* ===== TEMA 8 — tokeni ===== */
/* Izmereno na /theme-8 i /theme-8/ponude: bela podloga sa svetlo plavom  */
/* trakom #eaf4fb iza heroja (plava je podloga druge sekcije naslovne),   */
/* mastilo #1a093f, siva opisa #48484c, linija rgba(26, 9, 63, 0.14).     */
/* Zuti akcent #f5c518 ima kontrast ~1.6 na belom pa NE moze nositi       */
/* slova — naslovna ga izrazava iskljucivo kao POPUNU sa mastilom         */
/* #1c1a12 (CTA pilule, upaljeni tabovi). Zato --td-cta nosi zutu, a      */
/* --td-accent brend plavu #037ad5, jedini obojen ton koji naslovna       */
/* koristi za slova (crtica nadnaslova). Kartice su bele uglova 10px sa   */
/* senkom 0 14px 34px rgba(20, 18, 16, 0.20), a nazivi kartica su         */
/* Fraunces 600 (izmereno na kartici liste: 22px / 600 / fvs normal).     */

.e-21ace7c7 > .holder.sp-theme-8
{
	--td-ink: #1a093f;
	--td-muted: #48484c;
	--td-line: rgba(26, 9, 63, 0.14);
	--td-surface: #ffffff;
	--td-soft: #eaf4fb;
	--td-accent: #037ad5;
	--td-cta: #f5c518;
	--td-cta-ink: #1c1a12;
	--td-cta-hover: #e0b30e;
	--td-cta-dim: 1;
	--td-cta-weight: 800;
	--td-card-shadow: rgba(20, 18, 16, 0.10) 0 4px 14px;
	--td-radius: 10px;
	--td-title-ls: -0.025em;
	--td-heading-ls: -0.025em;
	--td-card-font: var(--ot-font-secondary);
	--td-card-fvs: normal;
	--td-card-ink: #1a093f;

	/* Tokeni ispod koristi samo dopunski blok teme 8 na dnu fajla. */
	--td-star: #f5b301;

	background: linear-gradient(180deg, #eaf4fb 0%, rgba(234, 244, 251, 0) 420px) #ffffff;
	color: var(--td-ink);
}

/* ===== DEO 1 — ZAGLAVLJE PONUDE (section-hero-single-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .crumb
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .crumb.active
{
	color: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .meta-chip
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: 100px;
	color: var(--td-muted);
}

/* Ikona cipa nosi svoj --ot-text-3 i ne nasledjuje --td-muted sa .meta-chip. */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .meta-chip:not(.meta-brand) > i
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .meta-chip.meta-brand
{
	color: var(--td-accent);
	border-color: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .title
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	font-variation-settings: 'opsz' 144;
	letter-spacing: var(--td-title-ls);
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .code-label
{
	color: var(--td-muted);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .code-value
{
	font-weight: 700;
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .actions > .action
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: 50%;
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-14474df .actions > .action:hover
{
	border-color: var(--td-accent);
	color: var(--td-accent);
}

/* ===== DEO 2 — GALERIJA (block-gallery-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3427fe60 .hero,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3427fe60 .thumb
{
	border-radius: var(--td-radius);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3427fe60 .see-all
{
	background: var(--td-cta);
	color: var(--td-cta-ink);
	border-color: var(--td-cta);
	border-radius: 100px;
	font-weight: var(--td-cta-weight);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3427fe60 .see-all-count
{
	color: var(--td-cta-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3427fe60 .sector-chip
{
	background: var(--td-surface);
	color: var(--td-ink);
	border-radius: 100px;
}

/* ===== DEO 3 — SEKCIJSKI TABOVI (block-tabs-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .tab
{
	border-radius: 100px;
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .tab.is-active
{
	background: var(--td-ink);
	color: var(--td-surface);
	border-color: var(--td-ink);
}

/* Ikona taba ima SOPSTVENU boju u baznom elementu (--ot-text-3), pa ne     */
/* nasledjuje --td-muted sa .tab i ostaje siva u tematizovanoj piluli.      */
/* Upaljen tab baza vec crta belom, zato se dira samo ugaseno stanje.       */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .tab:not(.is-active) .tab-icon
{
	color: var(--td-muted);
}

/* ===== DEO 3 — INFO MREZA (block-facts-1, variant card) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-64a5b7d5 > .holder.variant-card
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: var(--td-radius);
	box-shadow: var(--td-card-shadow);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-64a5b7d5 .item-icon
{
	background: var(--td-soft);
	color: var(--td-accent);
	border-radius: 50%;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-64a5b7d5 .item-label
{
	color: var(--td-muted);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}

/* Osnovni element pise vrednost serifom; tema 6 tako i ostaje, a tema 1 je   */
/* vraca u Inter jer njena naslovna sitne vrednosti pise osnovnim fontom.     */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-64a5b7d5 .item-value
{
	font-family: var(--td-card-font);
	font-variation-settings: var(--td-card-fvs);
	font-weight: 700;
	color: var(--td-ink);
}

/* ===== DEO 3 — STICKY PANEL (block-booking-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 > .holder
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: var(--td-radius);
	box-shadow: var(--td-card-shadow);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .inquiry-label
{
	font-family: var(--ot-font-secondary);
	font-variation-settings: 'opsz' 144;
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .inquiry-hint
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .cta
{
	background: var(--td-cta);
	color: var(--td-cta-ink);
	border-radius: 100px;
	font-weight: var(--td-cta-weight);
	font-size: 15px;
	letter-spacing: 0.15px;
	padding: 14px 34px;
}

/* Tema 6 zamracuje zutu pilulu filterom (--td-cta-dim 0.94), tema 1 ima  */
/* meren hover ton #dc6f0f pa joj filter ostaje na 1.                     */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .cta:hover
{
	background: var(--td-cta-hover);
	filter: brightness(var(--td-cta-dim));
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .cta-note,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .trust-item
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .cta-note > i,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .trust-item > i
{
	color: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-65a99659 .notify-trigger
{
	color: var(--td-ink);
}

/* ===== DEO 4-8 — ZAGLAVLJA SEKCIJA (section-heading-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4180a2e8 .eyebrow
{
	color: var(--td-accent);
	font-weight: 700;
	letter-spacing: 0.18em;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4180a2e8 .eyebrow-mark
{
	background: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4180a2e8 .title
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	font-variation-settings: 'opsz' 144;
	letter-spacing: var(--td-heading-ls);
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4180a2e8 .title em
{
	color: var(--td-accent);
}

/* ===== DEO 4 — UNUTRASNJI TABOVI (block-content-tabs-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs
{
	background: var(--td-soft);
	border-radius: 100px;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs > .tab
{
	border-radius: 100px;
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs > .tab.active
{
	background: var(--td-accent);
	color: var(--td-surface);
	border-color: var(--td-accent);
}

/* Isto kao kod sekcijskih tabova: ikona nosi svoj --ot-text-3 iz baznog    */
/* elementa. Upaljen tab baza crta belom, pa se dira samo ugaseno stanje.   */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs > .tab:not(.active) > i
{
	color: var(--td-muted);
}

/* Panel je sirov HTML iz baze; bazni element ga neutralise sa              */
/* `.panel * { color: inherit !important }`, pa jedna boja na .panel obuji  */
/* celo telo. Naslovi, podebljanja i zaglavlja tabele nose !important u     */
/* bazi, zato ih tema mora prepisati istom tezinom.                         */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .panel
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .panel :is(h1, h2, h3, h4, h5, h6),
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .panel table th,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .panel table tr:first-child td
{
	color: var(--td-ink) !important;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .panel strong
{
	color: var(--td-ink);
}

/* ===== DEO 5 — GRADOVI KOJI SE OBILAZE ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid
{
	grid-auto-rows: 1fr;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid > .city-row
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: var(--td-radius);
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid > .city-row:hover
{
	border-color: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid > .city-row > .city-icon
{
	background: var(--td-soft);
	color: var(--td-accent);
}

/* Klijent tazi strelicu „→" u boji akcenta. Bazni element je crta sivom    */
/* (--ot-text-3) i menja u brend boju tek na hover, pa je tema do sada      */
/* bojila samo hover. Ugaseno stanje sada takodje nosi akcent.              */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid > .city-row > .city-arrow,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .cities-grid > .city-row:hover > .city-arrow
{
	color: var(--td-accent);
}

/* ===== DEO 6 — SMESTAJ I SOBE (block-stays-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-34a8e4c8 > .holder
{
	grid-auto-rows: 1fr;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-34a8e4c8 .stay
{
	background: var(--td-surface);
	border: 1px solid var(--td-line);
	border-radius: var(--td-radius);
	box-shadow: var(--td-card-shadow);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-34a8e4c8 .name
{
	font-family: var(--td-card-font);
	font-variation-settings: var(--td-card-fvs);
	color: var(--td-card-ink);
}

/* Naziv kartice u temama 1 i 3 je Inter 800 (mereno na naslovnoj i listi  */
/* svake teme); tema 6 ostaje na osnovnoj debljini svog serifnog naslova,  */
/* pa font-weight namerno nije deljen sa njom.                             */

.e-21ace7c7 > .holder:is(.sp-theme-1, .sp-theme-3) .e-34a8e4c8 .name
{
	font-weight: 800;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-34a8e4c8 .description
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-34a8e4c8 .rooms-cta
{
	color: var(--td-accent);
}

/* ===== DEO 7 — O DESTINACIJI ===== */

/* Boja se mora postaviti na `> .holder`, ne na sam element: bazni          */
/* content.css pise `.e-35bc979f > .holder { color: var(--ot-text-1) }`,    */
/* sto je pravilo i time jace od nasledjivanja sa roditelja.                */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-35bc979f,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-35bc979f > .holder
{
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-35bc979f > .holder :is(h1, h2, h3, h4)
{
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .organizer-note > p
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .organizer-note a
{
	color: var(--td-accent);
}

/* ===== DEO 8 — ATRAKCIJE U BLIZINI (section-categories-1) ===== */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4f8a6dbe .holder.layout-grid
{
	grid-auto-rows: 1fr;
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4f8a6dbe .tile
{
	border-radius: var(--td-radius);
}

/* ===== PRATECI BLOKOVI — IZLETI I BLOG ===== */
/* Strana ponude uz DEO 1-8 crta i izlete (block-excursions-1) i blog       */
/* kartice (card-blog-1) kad tura ima podatke. Oba bloka pisu naslove       */
/* baznim --ot-text-1 (indigo), sto na tematizovanoj podlozi ispada van     */
/* palete, pa se vezuju za iste --td-* tokene kao ostatak strane.           */

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3121f0f5 .name,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d .title
{
	color: var(--td-ink);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d > .holder:hover .title
{
	color: var(--td-accent);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-3121f0f5 .description,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d .excerpt,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d .date,
.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d .reading
{
	color: var(--td-muted);
}

.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-37934a4d .category
{
	color: var(--td-accent);
}

/* ===== STICKY PANEL ===== */
/* dynamic.js crta <main style="overflow: hidden">, pa main postaje najblizi   */
/* scrollport i position: sticky u njemu je INERTAN (panel se pomera 1:1 sa    */
/* skrolom). overflow: clip sece isto, ali NE pravi scroll kontejner. :has()   */
/* drzi izmenu na tematizovanim stranama — sve ostale zadrzavaju zateceno.     */

main:has(> .e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8))
{
	overflow: clip !important;
}

/* ===== RESPONZIVNOST ===== */

@media (max-width: 900px)
{
	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .track,
	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs
	{
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .track::-webkit-scrollbar,
	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs::-webkit-scrollbar
	{
		display: none;
	}

	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-1669e408 .tab,
	.e-21ace7c7 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-6-dark, .sp-theme-8) .e-4769ae34 .tabs > .tab
	{
		flex: none;
	}
}

/* ===================================================================== */
/* TEMA 6-DARK — DOPUNE ZA TAMNU PODLOGU                                 */
/* Deljena --td-* pravila iznad pokrivaju sve sto se boji tokenom.        */
/* Ovde su IZMERENE povrsine koje bazni elementi crtaju tvrdo kodiranom   */
/* svetlom vrednoscu (bela traka tabova, panel sirovog HTML-a, placeholder */
/* slika #f0f0f0, red tabele #f8f8f8) i ikone koje nose sopstvenu brend    */
/* plavu ili belu — na svetlim temama se to poklapa sa paletom, na tamnoj  */
/* ostaje kao svetla mrlja. Blok je vezan SAMO za .sp-theme-6-dark, pa     */
/* teme 6, 1 i 3 ostaju bajt-identicne.                                    */
/* ===================================================================== */

/* Podloge koje bazni elementi crtaju belom ili skoro belom. */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-1669e408 .bar,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 > .holder,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3121f0f5 .excursion,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-37934a4d > .holder
{
	background: var(--td-surface);
	border-color: var(--td-line);
}

/* Placeholder slike (#f0f0f0) se vidi dok se fotografija ucitava i svuda  */
/* gde ture nemaju sliku — na crnoj podlozi je to bela ploca.              */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-3427fe60 :is(.hero, .thumb),
.e-21ace7c7 > .holder.sp-theme-6-dark .cities-grid > .city-row > .city-cover,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-34a8e4c8 .stay > .cover,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4f8a6dbe :is(.tile, .tile > .cover),
.e-21ace7c7 > .holder.sp-theme-6-dark .e-37934a4d .cover,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3121f0f5 .excursion > .cover
{
	background-color: var(--td-image);
}

/* Cenovnik u DEO 4 je sirov HTML iz baze; bazni element zato zaglavlje i   */
/* parne redove pise sa !important (da nadjaca inline bgcolor iz baze), pa  */
/* tamna tema mora istom tezinom.                                           */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 .panel table,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 .panel table td,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 .panel table th
{
	background-color: var(--td-deep) !important;
	border-color: var(--td-line) !important;
}

/* Hairline linije koje bazni elementi crtaju svetlo sivom               */
/* (--ot-bg-2-border = #e4e4e4) — na crnoj podlozi svetle kao belina.    */
/* Uspravni razdelnik info mreze je ::after pseudoelement, ne obrub.     */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-64a5b7d5 .item.has-row-divider,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 .tabs,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-65a99659 .trust,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-65a99659 .notify,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-37934a4d .footer
{
	border-color: var(--td-line);
}

.e-21ace7c7 > .holder.sp-theme-6-dark .e-64a5b7d5 .item::after
{
	background: var(--td-line);
}

.e-21ace7c7 > .holder.sp-theme-6-dark .e-65a99659 .notify-trigger-toggle
{
	background: var(--td-soft);
	color: var(--td-ink);
}

/* Deljeno pravilo upaljen sekcijski tab crta mastilom (na svetlim temama  */
/* tamna pilula). Naslovna /theme-6-dark upaljen tab crta ZLATNOM pilulom  */
/* sa tamnim slovima — izmereno na .tab.is-active — pa se detalj ponude    */
/* usklađuje sa njom i sa unutrasnjim tabovima iz DEO 4.                   */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-1669e408 .tab.is-active
{
	background: var(--td-cta);
	border-color: var(--td-cta);
	color: var(--td-cta-ink);
}

/* Upaljenom tabu bazni element crta ikonu belom (racuna na tamnu pilulu). */
/* Na zlatnoj piluli bela ikona nestane, pa ide u istu boju kao slova.     */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-1669e408 .tab.is-active .tab-icon,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-4769ae34 .tabs > .tab.active > i
{
	color: var(--td-cta-ink);
}

/* Ikone koje nose sopstvenu brend plavu sajta (#037ad5) umesto da         */
/* nasledjuju boju roditelja. Na temama 6 i 1 je akcent bas ta plava, pa   */
/* se poklapaju; na tamnoj temi moraju u zlatnu.                           */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-14474df .meta-chip.meta-brand > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3427fe60 .sector-chip > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-64a5b7d5 .item-icon > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3121f0f5 .chip.price > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3121f0f5 .chip.price > span,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-65a99659 .notify-trigger-text > i
{
	color: var(--td-accent);
}

/* Zvezdice kategorije nose dva razlicita zlatna tona iz baznih elemenata; */
/* tamna tema ih izjednacava sa tonom sa naslovne /theme-6-dark.           */

.e-21ace7c7 > .holder.sp-theme-6-dark .e-14474df .meta-chip .stars > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-34a8e4c8 .stars > i,
.e-21ace7c7 > .holder.sp-theme-6-dark .e-3121f0f5 .stars > i
{
	color: var(--td-stars);
}

/* ===================================================================== */
/* TEMA 8 — DOPUNE                                                       */
/* Deljena pravila iznad pokrivaju ceo raspored; ovde su samo mesta na    */
/* kojima tema 8 odstupa od --td-* podrazumevanog ponasanja.             */
/* ===================================================================== */

/* Unutrasnja traka tabova (DEO 4) deljeno dobija --td-accent sa BELIM    */
/* slovima. Naslovna teme 8 upaljen tab crta ZUTOM pilulom sa tamnim      */
/* slovima (izmereno na .tab.is-active: #f5c518 / #1c1a12 / 14px / 700),  */
/* a zuta na belom ima kontrast ~1.6 pa bela slova na njoj nisu citljiva. */
/* Zato se ovde vraca obrazac sa naslovne. Sekcijski tabovi (DEO 3)       */
/* ostaju tamni sa belim slovima — klijent ih je tako i trazio, a to je   */
/* isti obrazac kao tamna CTA pilula na naslovnoj.                        */

.e-21ace7c7 > .holder.sp-theme-8 .e-4769ae34 .tabs > .tab.active
{
	background: var(--td-cta);
	color: var(--td-cta-ink);
	border-color: var(--td-cta);
	font-weight: 700;
}

.e-21ace7c7 > .holder.sp-theme-8 .e-4769ae34 .tabs > .tab.active > i
{
	color: var(--td-cta-ink);
}

/* Naziv kartice smestaja: deljeno pravilo nosi samo porodicu i boju, pa  */
/* bi ostala globalna osa naslova. Na kartici liste /theme-8/ponude je    */
/* izmereno Fraunces 600 sa font-variation-settings: normal — obe         */
/* vrednosti moraju biti napisane jer fvs gazi font-weight.               */

.e-21ace7c7 > .holder.sp-theme-8 .e-34a8e4c8 .name
{
	font-weight: 600;
}

/* Zvezdice kategorije: naslovna teme 8 ih crta tonom #f5b301             */
/* (izmereno na .card-stars), a bazni elementi imaju svoje zlatne tonove. */

.e-21ace7c7 > .holder.sp-theme-8 .e-14474df .meta-chip .stars > i,
.e-21ace7c7 > .holder.sp-theme-8 .e-34a8e4c8 .stars > i,
.e-21ace7c7 > .holder.sp-theme-8 .e-3121f0f5 .stars > i
{
	color: var(--td-star);
}
.e-13f11794
{
	display: block;
	width: 100%;
}

.e-13f11794 > .holder
{
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Brand traka preko hero zone — boja sajta na velikoj površini. */

.e-13f11794 > .holder > .hero-band
{
	background: linear-gradient(180deg, var(--ot-brand-opacity) 0%, transparent 100%);
}

.e-13f11794 .listing-hero
{
	padding-top: 48px;
	padding-bottom: 8px;
}

.e-13f11794 > .holder > .listing-layout
{
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 40px;
	padding-top: 24px;
	padding-bottom: 96px;
	align-items: flex-start;
}

.e-13f11794 > .holder > .listing-layout > .listing-filters
{
	min-width: 0;
	position: sticky;
	top: var(--ot-spacing-m);
}

/* Zatamnjenje iza fioke sa filterima. Iznad praga fioke uopste ne postoji. */

.e-13f11794 > .holder > .listing-layout > .listing-scrim
{
	display: none;
}

.e-13f11794 > .holder > .listing-layout > .listing-main
{
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.e-13f11794 .listing-grid.is-grid
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.e-13f11794 .listing-grid.is-list
{
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.e-13f11794 .listing-grid > .tour-link
{
	display: block;
	min-width: 0;
	height: 100%;
}

.e-13f11794 .listing-empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 80px 0;
	text-align: center;
}

.e-13f11794 .listing-empty > i
{
	font-family: 'Material Symbols Rounded';
	font-size: 48px;
	color: var(--ot-text-3);
}

.e-13f11794 .listing-empty > p
{
	color: var(--ot-text-2);
	margin: 0;
}

@media (max-width: 1200px)
{
	.e-13f11794 .listing-grid.is-grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 980px)
{
	.e-13f11794 > .holder > .listing-layout
	{
		grid-template-columns: 1fr;
	}

	.e-13f11794 > .holder > .listing-layout > .listing-filters
	{
		position: static;
	}
}

/* Prag je isti onaj na kom search-toolbar-1 pokazuje dugme "Filteri" (900px), */
/* pa dugme i fioka ulaze u igru u istom trenutku — nikad nema stanja u kom je */
/* kolona sklonjena a nema cime da se otvori. */

@media (max-width: 900px)
{
	.e-13f11794 > .holder > .listing-layout > .listing-scrim
	{
		display: block;
		position: fixed;
		inset: 0;
		z-index: 60;
		background: rgba(20, 14, 6, 0.42);
		opacity: 0;
		visibility: hidden;
		transition: opacity 260ms cubic-bezier(0.22, 1, 0.36, 1), visibility 260ms;
	}

	.e-13f11794 > .holder > .listing-layout > .listing-scrim.is-open
	{
		opacity: 1;
		visibility: visible;
	}

	.e-13f11794 > .holder > .listing-layout > .listing-filters
	{
		position: fixed;
		top: 0;
		bottom: var(--ot-ticker-height);
		left: 0;
		z-index: 61;
		width: min(340px, 88vw);
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateX(-100%);
		transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
	}

	.e-13f11794 > .holder > .listing-layout > .listing-filters.is-open
	{
		transform: translateX(0);
	}
}

@media (max-width: 640px)
{
	.e-13f11794 .listing-grid.is-grid
	{
		grid-template-columns: 1fr;
	}

	.e-13f11794 > .holder > .listing-layout
	{
		padding: 24px 0 64px;
	}
}

/* ============================================================ */
/* ===== TEMA 6 =============================================== */
/* ============================================================ */

/* Naslovna teme 6 stoji na toploj bez paleti (#FBEEDD sekcije, #ead5b9 futer, */
/* mastilo #3b2a16 / #5a462e), a sive vrednosti iz osnovne palete se na toj */
/* podlozi gube. Skin zato nosi svoje tople tonove, dok akcent ostaje brend boja */
/* sajta. Sve visi na sp-theme-6 klasi pa se ostale liste (npr. /ponude) ne diraju. */

.e-13f11794 > .holder.sp-theme-6
{
	--t6-ink: #3b2a16;
	--t6-muted: #6b573c;
	--t6-line: rgba(59, 42, 22, 0.18);
	--t6-surface: #ffffff;
	--t6-sand: #fbeedd;

	background: #fdf9f3;
}

.e-13f11794 > .holder.sp-theme-6 > .hero-band
{
	background: linear-gradient(180deg, var(--t6-sand) 0%, rgba(251, 238, 221, 0) 100%);
}

/* ===== TEME 6, 1, 3, 2, 4, 5, 6-dark, 7 i 8 — podela kolona i visina kartica ===== */

/* Raspored je isti zahtev u svih devet tema, pa pravila stoje jednom kroz :is(). */
/* Svi argumenti su po jedna klasa, tako da specificnost ostaje ista kao pre. */

/* Klijent trazi cetvrtinu za filtere; zatecenih fiksnih 280px je na 1440 tek 21%. */
/* Donja granica ostaje 280px da panel na uzem ekranu ne postane preusko. */
/* min-width je obavezan: bez njega bi ovo pravilo (vise specificno i nize u fajlu) */
/* pobedilo @media (max-width: 980px) i vratilo dve kolone ispod praga fioke. */

@media (min-width: 981px)
{
	.e-13f11794 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-2, .sp-theme-4, .sp-theme-5, .sp-theme-6-dark, .sp-theme-7, .sp-theme-8) > .listing-layout
	{
		grid-template-columns: minmax(280px, 24%) 1fr;
	}
}

/* Sve kartice iste visine, pa i redovi medjusobno — red "Pogledaj ponudu" tako */
/* stoji na istoj liniji u celoj mrezi, ne samo unutar jednog reda. */

.e-13f11794 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-2, .sp-theme-4, .sp-theme-5, .sp-theme-6-dark, .sp-theme-7, .sp-theme-8) .listing-grid.is-grid
{
	grid-auto-rows: 1fr;
}

/* ===== TEMA 6 — zaglavlje ===== */

.e-13f11794 > .holder.sp-theme-6 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-6 .e-a1f0e9c .count-value
{
	color: var(--t6-ink);
}

.e-13f11794 > .holder.sp-theme-6 .e-a1f0e9c .count-label,
.e-13f11794 > .holder.sp-theme-6 .e-a1f0e9c .description
{
	color: var(--t6-muted);
}

.e-13f11794 > .holder.sp-theme-6 .e-a1f0e9c .count
{
	border-color: var(--t6-line);
}

/* ===== TEMA 6 — panel filtera ===== */

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 > .holder
{
	background: var(--t6-surface);
	border-color: var(--t6-line);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 1px 2px rgba(59, 42, 22, 0.05), 0 8px 24px rgba(59, 42, 22, 0.06);
}

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .group
{
	border-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .option-label
{
	color: var(--t6-ink);
}

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .option-count,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .group-chevron,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .option-expand
{
	color: var(--t6-muted);
}

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .options-search
{
	border-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 .option:hover
{
	background: var(--t6-sand);
}

/* ===== TEMA 6 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-6 .e-13096690 > .holder
{
	border-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-6 .e-13096690 .sort-value
{
	color: var(--t6-ink);
}

.e-13f11794 > .holder.sp-theme-6 .e-13096690 .count-label,
.e-13f11794 > .holder.sp-theme-6 .e-13096690 .sort-label
{
	color: var(--t6-muted);
}

.e-13f11794 > .holder.sp-theme-6 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-6 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-6 .e-13096690 .filter-trigger
{
	background: var(--t6-surface);
	border-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-13096690 .view-btn.is-active
{
	background: var(--t6-ink);
	color: var(--t6-surface);
}

/* ===== TEMA 6 — kartica ===== */

/* Klijent trazi belu karticu sa uglovima od ~10px i lakom senkom umesto */
/* zatecenog velikog radijusa i punog obruba. */

/* Kartica sa tekstom preko fotografije ("overlay") ima svoje mastilo i svoju */
/* pozadinu, pa je toplo bez mastilo teme mora zaobici — inace bi tamnosmedji */
/* naslov pao na tamnu fotografiju. Toj varijanti tema daje samo uglove i senku. */

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay)
{
	background: var(--t6-surface);
	border-color: var(--t6-line);
	border-radius: var(--ot-radius-m);
	box-shadow: 0 1px 2px rgba(59, 42, 22, 0.05), 0 10px 26px rgba(59, 42, 22, 0.07);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder.overlay
{
	border-radius: var(--ot-radius-m);
	box-shadow: 0 14px 34px rgba(59, 42, 22, 0.22);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder.overlay:hover
{
	box-shadow: 0 22px 48px rgba(59, 42, 22, 0.32);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .name
{
	color: var(--t6-ink);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .description,
.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .destination-text
{
	color: var(--t6-muted);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .body > .action
{
	background: var(--t6-sand);
	border-top-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-6 .e-5677af83 > .holder:not(.overlay) .body > .action > .action-arrow
{
	color: var(--ot-brand);
}

/* ===== TEMA 6 — paginacija ===== */

/* Klijent trazi paginaciju centriranu ispod mreze, pa red sa stranama i red sa */
/* brojacem idu jedan ispod drugog — isti raspored koji element vec koristi na */
/* uskim ekranima, ovde samo podignut na sve sirine. */

/* Raspored dele svih devet tema; boju linije svaka nosi svoju. */

.e-13f11794 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-2, .sp-theme-4, .sp-theme-5, .sp-theme-6-dark, .sp-theme-7, .sp-theme-8) .e-6a07c313 > .holder
{
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}

.e-13f11794 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-2, .sp-theme-4, .sp-theme-5, .sp-theme-6-dark, .sp-theme-7, .sp-theme-8) .e-6a07c313 .pages,
.e-13f11794 > .holder:is(.sp-theme-6, .sp-theme-1, .sp-theme-3, .sp-theme-2, .sp-theme-4, .sp-theme-5, .sp-theme-6-dark, .sp-theme-7, .sp-theme-8) .e-6a07c313 .aside
{
	flex: 1 1 100%;
	justify-content: center;
	flex-wrap: wrap;
}

.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 > .holder
{
	border-color: var(--t6-line);
}

.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .per-page-select
{
	background: var(--t6-surface);
	border-color: var(--t6-line);
	color: var(--t6-ink);
}

.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .page.is-active
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: var(--t6-surface);
}

.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .counter-label,
.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .counter-sep,
.e-13f11794 > .holder.sp-theme-6 .e-6a07c313 .per-page-label
{
	color: var(--t6-muted);
}

/* ===== TEMA 6 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-6 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
	}
}

/* ============================================================ */
/* ===== TEMA 1 =============================================== */
/* ============================================================ */

/* Naslovna teme 1 stoji na osnovnoj beloj paleti sajta, pa lista ne uvodi nove */
/* sive tonove nego preuzima merene vrednosti sa naslovne: mastilo naslova */
/* #24303a, kartica bela sa uglovima 18px i mekom senkom bez obruba, svetlo */
/* plava #eaf4fb sa futera, a akcent je brend boja sajta. Sve visi na sp-theme-1 */
/* klasi, pa se /ponude i /theme-6/ponude ne diraju. */

.e-13f11794 > .holder.sp-theme-1
{
	--t1-ink: #24303a;
	--t1-line: rgba(36, 48, 58, 0.12);
	--t1-surface: #ffffff;
	--t1-sky: #eaf4fb;
	--t1-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 6px 18px rgba(15, 23, 42, 0.06);
}

/* Traka iza zaglavlja ide u istu svetlo plavu koju naslovna nosi na futeru, */
/* umesto brend gradijenta iz osnovnog rasporeda. */

.e-13f11794 > .holder.sp-theme-1 > .hero-band
{
	background: linear-gradient(180deg, var(--t1-sky) 0%, rgba(234, 244, 251, 0) 100%);
}

/* ===== TEMA 1 — zaglavlje ===== */

/* Naslov i brojac ostaju u Fraunces-u (isti serif kao naslovi na naslovnoj) i sa */
/* istom osom debljine — naslovna crta naslove na 'wght' 400 jer globalno pravilo */
/* za h1-h6 pribija tu osu, pa lista namerno NE dira font-weight da ne bi ispala */
/* deblja od strane sa kojom se uskladjuje. Menja se samo mastilo. */

.e-13f11794 > .holder.sp-theme-1 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-1 .e-a1f0e9c .count-value
{
	color: var(--t1-ink);
}

.e-13f11794 > .holder.sp-theme-1 .e-a1f0e9c .count
{
	border-color: var(--t1-line);
}

/* ===== TEMA 1 — panel filtera ===== */

/* Bela ploca, uglovi 18px i meka senka — isti recept po kom su nacrtane kartice */
/* na naslovnoj; tanka ivica ostaje jer je panel visok pa mu senka sama ne dovoljno */
/* jasno odvaja donju ivicu. */

.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 > .holder
{
	background: var(--t1-surface);
	border-color: var(--t1-line);
	border-radius: var(--ot-radius-l);
	box-shadow: var(--t1-shadow);
}

.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .group
{
	border-color: var(--t1-line);
}

.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .option-label
{
	color: var(--t1-ink);
}

.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .options-search
{
	border-color: var(--t1-line);
}

.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 .option:hover
{
	background: var(--t1-sky);
}

/* ===== TEMA 1 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-1 .e-13096690 > .holder
{
	border-color: var(--t1-line);
}

.e-13f11794 > .holder.sp-theme-1 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-1 .e-13096690 .sort-value
{
	color: var(--t1-ink);
}

.e-13f11794 > .holder.sp-theme-1 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-1 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-1 .e-13096690 .filter-trigger
{
	background: var(--t1-surface);
	border-color: var(--t1-line);
}

/* Aktivan prikaz (mreza/lista) ide u akcent, kao istaknuta stanja na naslovnoj. */

.e-13f11794 > .holder.sp-theme-1 .e-13096690 .view-btn.is-active
{
	background: var(--ot-brand);
	color: var(--t1-surface);
}

/* ===== TEMA 1 — kartica ===== */

/* Kartice na naslovnoj su bele, bez obruba, uglova 18px i sa senkom */
/* 0 6px 18px rgba(15, 23, 42, 0.06) — lista preuzima isti izgled. */

/* Kartica sa tekstom preko fotografije ("overlay") nosi svoje belo mastilo i */
/* svoje zatamnjenje, pa mora zaobici mastilo teme — inace bi tamnoplavi naslov */
/* pao na tamnu fotografiju, a svetloplava traka presekla sliku. Toj varijanti */
/* tema daje samo uglove i senku, u istom tonu koji nosi ostatak teme. */

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay)
{
	background: var(--t1-surface);
	border-color: transparent;
	border-radius: var(--ot-radius-l);
	box-shadow: var(--t1-shadow);
}

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder.overlay
{
	border-radius: var(--ot-radius-l);
	box-shadow: 0 14px 34px rgba(15, 23, 42, 0.20);
}

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder.overlay:hover
{
	box-shadow: 0 22px 48px rgba(15, 23, 42, 0.28);
}

/* Naziv ponude: naslovna svoje kartice pise Inter-om 800 u #16294d, pa se lista */
/* poravnava sa njom. font-variation-settings se vraca na normal jer bi osnovno */
/* 'opsz' 144 ostalo na serifnoj kartici. */

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay) .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #16294d;
	font-variation-settings: normal;
}

/* Donja traka: akcent na svetlo plavoj, a na hover cela traka ide u brend boju */
/* (osnovni raspored je tu crn, sto na plavo-beloj temi izgleda strano). */

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay) > .body > .action
{
	background: var(--t1-sky);
	border-top-color: var(--t1-line);
}

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay):hover > .body > .action
{
	background: var(--ot-brand);
}

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay) > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay) > .body > .action > .action-arrow
{
	color: var(--ot-brand);
}

.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay):hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-1 .e-5677af83 > .holder:not(.offer):not(.overlay):hover > .body > .action > .action-arrow
{
	color: var(--t1-surface);
}

/* ===== TEMA 1 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-1 .e-6a07c313 > .holder
{
	border-color: var(--t1-line);
}

.e-13f11794 > .holder.sp-theme-1 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-1 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-1 .e-6a07c313 .per-page-select
{
	background: var(--t1-surface);
	border-color: var(--t1-line);
	color: var(--t1-ink);
}

.e-13f11794 > .holder.sp-theme-1 .e-6a07c313 .page.is-active
{
	background: var(--ot-brand);
	border-color: var(--ot-brand);
	color: var(--t1-surface);
}

/* ===== TEMA 1 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-1 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ============================================================ */
/* ===== TEMA 3 =============================================== */
/* ============================================================ */

/* Vrednosti nisu prepisane iz CSS-a naslovne nego IZMERENE na renderovanoj */
/* /theme-3 (getComputedStyle), jer globalna pravila sajta gaze deo deklaracija: */
/*   naslov sekcije   Fraunces, 'opsz' 144 'wght' 400, boja #10285C */
/*   naziv kartice    Inter 800, 17px, boja #10286B */
/*   kartica          bela, uglovi 10px, senka 0 10px 28px rgba(16, 40, 92, .14) */
/*   zvezdice         #F5A623 */
/*   podloge sekcija  #EAF4FB, #F7F4EF, #FFFFFF */

/* Akcent je #10286B — boja upaljenog taba i naziva kartice na naslovnoj. Brend */
/* boja sajta (#037AD5) se na naslovnoj teme 3 ne pojavljuje nigde, pa bi cekirani */
/* filter u njoj ispao stran temi sa kojom se lista uskladjuje. */

/* Sve visi na sp-theme-3 klasi, pa /ponude, /theme-6/ponude i /theme-1/ponude */
/* ostaju netaknuti. */

.e-13f11794 > .holder.sp-theme-3
{
	--t3-ink: #10285c;
	--t3-accent: #10286b;
	--t3-accent-soft: rgba(16, 40, 107, 0.1);
	--t3-line: rgba(16, 40, 92, 0.14);
	--t3-surface: #ffffff;
	--t3-sky: #eaf4fb;
	--t3-cream: #f7f4ef;
	--t3-shadow: 0 10px 28px rgba(16, 40, 92, 0.14);
}

/* Traka iza zaglavlja ide u svetlo plavu sa naslovne, umesto brend gradijenta. */

.e-13f11794 > .holder.sp-theme-3 > .hero-band
{
	background: linear-gradient(180deg, var(--t3-sky) 0%, rgba(234, 244, 251, 0) 100%);
}

/* ===== TEMA 3 — zaglavlje ===== */

/* Naslov i brojac ostaju u Fraunces-u sa osom koju globalno h1-h6 pravilo pribija */
/* ('opsz' 144, 'wght' 400) — bas kako se naslovi STVARNO crtaju na naslovnoj. */
/* Menja se samo mastilo, da lista ne ispadne deblja od strane sa kojom se uskladjuje. */

.e-13f11794 > .holder.sp-theme-3 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-3 .e-a1f0e9c .count-value
{
	color: var(--t3-ink);
}

.e-13f11794 > .holder.sp-theme-3 .e-a1f0e9c .eyebrow
{
	color: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-a1f0e9c .count
{
	border-color: var(--t3-line);
}

/* ===== TEMA 3 — panel filtera ===== */

/* Bela ploca sa uglovima 10px i mekom senkom — isti recept po kom su nacrtane */
/* kartice na naslovnoj. Tanka ivica ostaje jer je panel visok, pa mu senka sama */
/* ne odvaja dovoljno jasno donju ivicu. */

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 > .holder
{
	background: var(--t3-surface);
	border-color: var(--t3-line);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t3-shadow);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .group
{
	border-color: var(--t3-line);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .head-icon
{
	color: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option-label
{
	color: var(--t3-ink);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .options-search
{
	border-color: var(--t3-line);
}

/* Cekirano polje u akcentu teme. */

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--t3-accent);
	border-color: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option-expand
{
	color: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .option:hover
{
	background: var(--t3-sky);
}

.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 .head-clear:hover
{
	color: var(--t3-accent);
	background: var(--t3-accent-soft);
}

/* ===== TEMA 3 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-3 .e-13096690 > .holder
{
	border-color: var(--t3-line);
}

.e-13f11794 > .holder.sp-theme-3 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-3 .e-13096690 .sort-value
{
	color: var(--t3-ink);
}

.e-13f11794 > .holder.sp-theme-3 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-3 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-3 .e-13096690 .filter-trigger
{
	background: var(--t3-surface);
	border-color: var(--t3-line);
}

/* Upaljen prikaz (mreza/lista) ide u akcent — isto stanje kao upaljen tab na naslovnoj. */

.e-13f11794 > .holder.sp-theme-3 .e-13096690 .view-btn.is-active
{
	background: var(--t3-accent);
	color: var(--t3-surface);
}

/* ===== TEMA 3 — kartica ===== */

/* Bela kartica, uglovi 10px, meka senka i bez obruba — izmerene vrednosti */
/* kartica sa naslovne (.card na /theme-3). */

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder
{
	background: var(--t3-surface);
	border-color: transparent;
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t3-shadow);
}

/* Naziv ponude prati naziv kartice sa naslovne: Inter 800 u #10286B. */
/* font-variation-settings se vraca na normal jer bi 'opsz' 144 ostalo na serifu. */

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--t3-accent);
	font-variation-settings: normal;
}

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder .stars > i
{
	color: #f5a623;
}

/* Donja traka: akcent na krem podlozi sa naslovne, a na hover cela traka ide u */
/* akcent (osnovni raspored je tu skoro crn, sto na plavo-krem temi izgleda strano). */

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder > .body > .action
{
	background: var(--t3-cream);
	border-top-color: var(--t3-line);
}

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder:hover > .body > .action
{
	background: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder > .body > .action > .action-arrow
{
	color: var(--t3-accent);
}

.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder:hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-3 .e-5677af83 > .holder:hover > .body > .action > .action-arrow
{
	color: var(--t3-surface);
}

/* ===== TEMA 3 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-3 .e-6a07c313 > .holder
{
	border-color: var(--t3-line);
}

.e-13f11794 > .holder.sp-theme-3 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-3 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-3 .e-6a07c313 .per-page-select
{
	background: var(--t3-surface);
	border-color: var(--t3-line);
	color: var(--t3-ink);
}

.e-13f11794 > .holder.sp-theme-3 .e-6a07c313 .page.is-active
{
	background: var(--t3-accent);
	border-color: var(--t3-accent);
	color: var(--t3-surface);
}

/* ===== TEMA 3 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-3 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ============================================================ */
/* ===== TEMA 2 =============================================== */
/* ============================================================ */

/* Vrednosti su IZMERENE na renderovanoj /theme-2 (getComputedStyle), ne */
/* prepisane iz CSS-a, jer globalna pravila sajta gaze deo deklaracija: */
/*   naslov sekcije   Inter, 'wght' 900, boja #16294D */
/*   naziv kartice    Inter 800, boja #16294D */
/*   kartica          bela, uglovi 18px, senka 0 10px 28px rgba(20, 18, 16, .14) */
/*   zvezdice         #F5A623 */
/*   podloge sekcija  #EAF3FB, #F7F4EF, #FFFFFF */

/* Akcent je #037AD5 — brend boja sajta, koja se na naslovnoj teme 2 stvarno */
/* pojavljuje (futer, istaknuta stanja), za razliku od teme 3. */

/* Naslovna teme 2 pise naslove Inter-om na osi 'wght' 900, pa zaglavlje liste */
/* mora prepisati I porodicu I osu — samo font-weight bi ostao mrtav kod jer */
/* globalno h1-h6 pravilo pribija 'opsz' 144, 'wght' 400. */

/* Sve visi na sp-theme-2 klasi, pa /ponude i ostale liste ostaju netaknute. */

.e-13f11794 > .holder.sp-theme-2
{
	--t2-ink: #16294d;
	--t2-muted: rgba(22, 41, 77, 0.68);
	--t2-accent: #037ad5;
	--t2-accent-soft: rgba(3, 122, 213, 0.1);
	--t2-line: rgba(22, 41, 77, 0.14);
	--t2-surface: #ffffff;
	--t2-sky: #eaf3fb;
	--t2-cream: #f7f4ef;
	--t2-grey: #f7f8fa;
	--t2-shadow: 0 10px 28px rgba(20, 18, 16, 0.14);
}

/* Traka iza zaglavlja ide u svetlo plavu sa naslovne, umesto brend gradijenta. */

.e-13f11794 > .holder.sp-theme-2 > .hero-band
{
	background: linear-gradient(180deg, var(--t2-sky) 0%, rgba(234, 243, 251, 0) 100%);
}

/* ===== TEMA 2 — zaglavlje ===== */

.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .count-value
{
	font-family: var(--ot-font-primary);
	font-weight: 900;
	letter-spacing: -0.01em;
	color: var(--t2-ink);
	font-variation-settings: 'wght' 900;
}

.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .eyebrow
{
	color: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .count-label,
.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .description
{
	color: var(--t2-muted);
}

.e-13f11794 > .holder.sp-theme-2 .e-a1f0e9c .count
{
	border-color: var(--t2-line);
}

/* ===== TEMA 2 — panel filtera ===== */

/* Bela ploca sa uglovima 18px i mekom senkom — isti recept po kom su nacrtane */
/* kartice na naslovnoj. Tanka ivica ostaje jer je panel visok, pa mu senka sama */
/* ne odvaja dovoljno jasno donju ivicu. */

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 > .holder
{
	background: var(--t2-surface);
	border-color: var(--t2-line);
	border-radius: var(--ot-radius-l);
	box-shadow: var(--t2-shadow);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .group
{
	border-color: var(--t2-line);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .head-icon
{
	color: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option-label
{
	color: var(--t2-ink);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option-count,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .group-chevron
{
	color: var(--t2-muted);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .options-search
{
	border-color: var(--t2-line);
}

/* Cekirano polje u akcentu teme. */

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--t2-accent);
	border-color: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option-expand
{
	color: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .option:hover
{
	background: var(--t2-sky);
}

.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 .head-clear:hover
{
	color: var(--t2-accent);
	background: var(--t2-accent-soft);
}

/* ===== TEMA 2 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-2 .e-13096690 > .holder
{
	border-color: var(--t2-line);
}

.e-13f11794 > .holder.sp-theme-2 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-2 .e-13096690 .sort-value
{
	color: var(--t2-ink);
}

.e-13f11794 > .holder.sp-theme-2 .e-13096690 .count-label,
.e-13f11794 > .holder.sp-theme-2 .e-13096690 .sort-label
{
	color: var(--t2-muted);
}

.e-13f11794 > .holder.sp-theme-2 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-2 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-2 .e-13096690 .filter-trigger
{
	background: var(--t2-surface);
	border-color: var(--t2-line);
}

/* Upaljen prikaz (mreza/lista) ide u akcent. */

.e-13f11794 > .holder.sp-theme-2 .e-13096690 .view-btn.is-active
{
	background: var(--t2-accent);
	color: var(--t2-surface);
}

/* ===== TEMA 2 — kartica ===== */

/* Bela kartica, uglovi 18px, meka senka i bez obruba — izmerene vrednosti */
/* kartica sa naslovne (.card na /theme-2). */
/* Varijanta "strip" ima svoj mozaik izgled (tekst na fotografiji), pa je */
/* svako pravilo koje boji telo bele kartice ogradjeno sa :not(.strip). */

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:not(.strip)
{
	background: var(--t2-surface);
	border-color: transparent;
	border-radius: var(--ot-radius-l);
	box-shadow: var(--t2-shadow);
}

/* Naziv ponude prati naziv kartice sa naslovne: Inter 800 u #16294D. */
/* font-variation-settings se vraca na normal jer bi 'opsz' 144 ostalo na serifu. */

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:not(.strip) .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--t2-ink);
	font-variation-settings: normal;
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:not(.strip) .description,
.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:not(.strip) .destination-text
{
	color: var(--t2-muted);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:not(.strip) .stars > i
{
	color: #f5a623;
}

/* Donja traka: akcent na neutralnoj podlozi, a na hover cela traka ide u akcent */
/* (osnovni raspored je tu skoro crn, sto na plavo-beloj temi izgleda strano). */

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder > .body > .action
{
	background: var(--t2-grey);
	border-top-color: var(--t2-line);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:hover > .body > .action
{
	background: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder > .body > .action > .action-arrow
{
	color: var(--t2-accent);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder:hover > .body > .action > .action-arrow
{
	color: var(--t2-surface);
}

/* ===== TEMA 2 — mozaik kartica (varijanta "strip") ===== */

/* Ton trake i zvezdica prepisan je sa kartica sekcije "Letovanje po zemljama" */
/* na /theme-2 (.e-101c6077 .card): rgba(3, 122, 213, .66), na hover .78, */
/* zvezdice #F5B301. Sve ostalo (raspored, tipografija, cipovi) nosi varijanta. */

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder.strip > .body
{
	background: rgba(3, 122, 213, 0.66);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder.strip:hover > .body
{
	background: rgba(3, 122, 213, 0.78);
}

.e-13f11794 > .holder.sp-theme-2 .e-5677af83 > .holder.strip .stars > i
{
	color: #f5b301;
}

/* ===== TEMA 2 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 > .holder
{
	border-color: var(--t2-line);
}

.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .per-page-select
{
	background: var(--t2-surface);
	border-color: var(--t2-line);
	color: var(--t2-ink);
}

.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .page.is-active
{
	background: var(--t2-accent);
	border-color: var(--t2-accent);
	color: var(--t2-surface);
}

.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .counter-label,
.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .counter-sep,
.e-13f11794 > .holder.sp-theme-2 .e-6a07c313 .per-page-label
{
	color: var(--t2-muted);
}

/* ===== TEMA 2 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-2 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ============================================================ */
/* ===== TEMA 4 =============================================== */
/* ============================================================ */

/* Vrednosti su IZMERENE na renderovanoj /theme-4 (getComputedStyle), ne */
/* prepisane iz CSS-a, jer globalna pravila sajta gaze deo deklaracija: */
/*   naslov sekcije   Inter, 'wght' 800, 34px, boja #182F52 */
/*   naziv kartice    Inter 700, 20px, boja #182F52 */
/*   kartica          bela, uglovi 10px, senka 0 14px 34px rgba(20, 18, 16, .14) */
/*   dugme (CTA)      pilula #14B8A6, bela slova */
/*   zvezdice         #F5A623 */
/*   podloge sekcija  #FFFFFF, #F7F4EF, #EAF4FB */

/* Akcent je #14B8A6 — boja CTA pilula, cipova i futera na naslovnoj teme 4. */
/* Na beloj podlozi je preslab za sitan tekst (kontrast ~2.3), pa tekst ide u */
/* #0F766E — bas ton koji naslovna vec koristi za slova na belom u tom skinu. */

/* Naslovna teme 4 pise naslove Inter-om na osi 'wght' 800, pa zaglavlje liste */
/* mora prepisati I porodicu I osu — samo font-weight bi ostao mrtav kod jer */
/* globalno h1-h6 pravilo pribija 'opsz' 144, 'wght' 400. */

/* Sve visi na sp-theme-4 klasi, pa /ponude i ostale liste ostaju netaknute. */

.e-13f11794 > .holder.sp-theme-4
{
	--t4-ink: #182f52;
	--t4-muted: rgba(24, 47, 82, 0.68);
	--t4-accent: #14b8a6;
	--t4-accent-ink: #0f766e;
	--t4-accent-hover: #0f9c92;
	--t4-accent-soft: rgba(20, 184, 166, 0.1);
	--t4-line: rgba(24, 47, 82, 0.14);
	--t4-surface: #ffffff;
	--t4-sky: #eaf4fb;
	--t4-cream: #f7f4ef;
	--t4-shadow: 0 14px 34px rgba(20, 18, 16, 0.14);
}

/* Traka iza zaglavlja ide u svetlo plavu sa naslovne, umesto brend gradijenta. */

.e-13f11794 > .holder.sp-theme-4 > .hero-band
{
	background: linear-gradient(180deg, var(--t4-sky) 0%, rgba(234, 244, 251, 0) 100%);
}

/* ===== TEMA 4 — zaglavlje ===== */

.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .count-value
{
	font-family: var(--ot-font-primary);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--t4-ink);
	font-variation-settings: 'wght' 800;
}

.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .eyebrow
{
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .count-label,
.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .description
{
	color: var(--t4-muted);
}

.e-13f11794 > .holder.sp-theme-4 .e-a1f0e9c .count
{
	border-color: var(--t4-line);
}

/* ===== TEMA 4 — panel filtera ===== */

/* Bela ploca sa uglovima 10px i mekom senkom — isti recept po kom su nacrtane */
/* kartice na naslovnoj. Tanka ivica ostaje jer je panel visok, pa mu senka sama */
/* ne odvaja dovoljno jasno donju ivicu. */

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 > .holder
{
	background: var(--t4-surface);
	border-color: var(--t4-line);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t4-shadow);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .group
{
	border-color: var(--t4-line);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .head-icon
{
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option-label
{
	color: var(--t4-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option-count,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .group-chevron
{
	color: var(--t4-muted);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .options-search
{
	border-color: var(--t4-line);
}

/* Cekirano polje u akcentu teme. */

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--t4-accent);
	border-color: var(--t4-accent);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option-expand
{
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .option:hover
{
	background: var(--t4-accent-soft);
}

.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 .head-clear:hover
{
	color: var(--t4-accent-ink);
	background: var(--t4-accent-soft);
}

/* ===== TEMA 4 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-4 .e-13096690 > .holder
{
	border-color: var(--t4-line);
}

.e-13f11794 > .holder.sp-theme-4 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-4 .e-13096690 .sort-value
{
	color: var(--t4-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-13096690 .count-label,
.e-13f11794 > .holder.sp-theme-4 .e-13096690 .sort-label
{
	color: var(--t4-muted);
}

.e-13f11794 > .holder.sp-theme-4 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-4 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-4 .e-13096690 .filter-trigger
{
	background: var(--t4-surface);
	border-color: var(--t4-line);
}

/* Upaljen prikaz (mreza/lista) ide u akcent — isti ton kao CTA pilula naslovne. */

.e-13f11794 > .holder.sp-theme-4 .e-13096690 .view-btn.is-active
{
	background: var(--t4-accent);
	color: var(--t4-surface);
}

/* ===== TEMA 4 — kartica ===== */

/* Bela kartica, uglovi 10px, meka senka i bez obruba — izmerene vrednosti */
/* kartica sa naslovne (.card-body na /theme-4). */

/* Kartica u varijanti overlap sama crta belu plocu u svom telu, pa je ovde */
/* iskljucena — inace bi tema (5 klasa) pobedila varijantu (2 klase) i vratila */
/* podlogu, obrub i senku na sam holder. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap)
{
	background: var(--t4-surface);
	border-color: transparent;
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t4-shadow);
}

/* Naziv ponude prati naziv kartice sa naslovne: Inter 700 u #182F52. */
/* font-variation-settings se vraca na normal jer bi 'opsz' 144 ostalo na serifu. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder .name
{
	font-family: var(--ot-font-primary);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--t4-ink);
	font-variation-settings: normal;
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder .description,
.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder .destination-text
{
	color: var(--t4-muted);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder .stars > i
{
	color: #f5a623;
}

/* Donja traka: akcent na beloj podlozi, a na hover cela traka ide u akcent */
/* (osnovni raspored je tu skoro crn, sto na tirkizno-beloj temi izgleda strano). */

/* Varijanta overlap na tom mestu crta obrubljeno dugme preko cele sirine, pa */
/* je i ovde iskljucena da tema ne bi vratila traku. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap) > .body > .action
{
	background: var(--t4-surface);
	border-top-color: var(--t4-line);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap):hover > .body > .action
{
	background: var(--t4-accent);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap) > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap) > .body > .action > .action-arrow
{
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap):hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder:not(.overlap):hover > .body > .action > .action-arrow
{
	color: var(--t4-surface);
}

/* ===== TEMA 4 — kartica u varijanti overlap ===== */

/* Varijanta nosi kompletnu geometriju referentne kartice, a tema samo boje */
/* koje su na naslovnoj teme 4 drukcije od podrazumevanih. */

/* Naziv: tema iznad pribija 18px (5 klasa), a referentna kartica je 20px. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap > .body > .name
{
	font-size: 20px;
}

/* Destinacija je u ovoj varijanti pilula u akcentu, pa tekst na njoj mora */
/* nasledi belu boju pilule umesto prigusenog mastila teme. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap .destination-text
{
	color: inherit;
}

/* Prva minuta je na naslovnoj zelena, a listing joj dodeljuje brend ton. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap .badge.badge-brand
{
	background: #148f5f;
}

/* Dugme dobija akcent teme umesto neutralne sive. */

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap > .body > .action
{
	border-color: var(--t4-line);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap:hover > .body > .action
{
	border-color: var(--t4-accent);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap > .body > .action > .action-text
{
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-5677af83 > .holder.overlap:hover > .body > .action > .action-text
{
	color: var(--t4-ink);
}

/* ===== TEMA 4 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 > .holder
{
	border-color: var(--t4-line);
}

.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .per-page-select
{
	background: var(--t4-surface);
	border-color: var(--t4-line);
	color: var(--t4-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .page:hover,
.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .arrow:hover
{
	border-color: var(--t4-accent);
	color: var(--t4-accent-ink);
}

.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .page.is-active
{
	background: var(--t4-accent);
	border-color: var(--t4-accent);
	color: var(--t4-surface);
}

.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .counter-label,
.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .counter-sep,
.e-13f11794 > .holder.sp-theme-4 .e-6a07c313 .per-page-label
{
	color: var(--t4-muted);
}

/* ===== TEMA 4 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-4 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ============================================================ */
/* ===== TEMA 5 =============================================== */
/* ============================================================ */

/* Vrednosti su IZMERENE na renderovanoj /theme-5 (getComputedStyle), ne */
/* prepisane iz CSS-a, jer globalna pravila sajta gaze deo deklaracija: */
/*   naslov identitetske sekcije  Inter 600, 28px, boja #037AD5 */
/*   naziv kartice                Inter 800, 21px, boja #0D3B66 */
/*   telo kartice i upaljen tab   #F5C518, mastilo na njemu #1C1A12 */
/*   kartica                      bela, senka 0 4px 14px rgba(20, 30, 55, .08) */
/*                                hover senka 0 18px 40px rgba(20, 30, 55, .16) */
/*   podloge sekcija              #FFFFFF, #F5F6F8, #F7F4EF, #EAF4FB */

/* Zuta #F5C518 je potpis teme, ali na beloj ima kontrast ~1.6 pa ne moze da nosi */
/* slova. Ide iskljucivo u POPUNE (cekiran mark, upaljen prikaz, aktivna strana, */
/* hover traka kartice), a mastilo na njoj je #1C1A12 — tacno kao na upaljenom */
/* tabu naslovne. */

/* Za slova u akcentu na belom tema uzima svoju dublju plavu #0E74B4 — ton kojim */
/* naslovna pise naslov sekcije "Izabrali smo za vas". Brend #037AD5 je isti */
/* porodicni ton, ali na belom ima izmeren kontrast 4.42, tik ispod AA praga; */
/* #0E74B4 daje 4.97 pa sitan tekst (nadnaslov, "Pogledaj ponudu") ostaje citljiv. */

/* Probom na 100px izmereno je da se h2 naslovi naslovne zbog globalnog */
/* 'wght' 400 crtaju na 400 (563.78px na 400 i na 800), dok se .card-name — */
/* koja nije h-tag — crta na pravih 800 (584.34px). Zaglavlje liste zato ide u */
/* Inter na osi 'wght' 800: ista debljina i isti ton kao naziv kartice naslovne. */

/* Sve visi na sp-theme-5 klasi, pa /ponude i ostale liste ostaju netaknute. */

.e-13f11794 > .holder.sp-theme-5
{
	--t5-ink: #0d3b66;
	--t5-muted: rgba(13, 59, 102, 0.72);
	--t5-accent: #f5c518;
	--t5-accent-ink: #1c1a12;
	--t5-accent-soft: rgba(245, 197, 24, 0.18);
	--t5-blue: #0e74b4;
	--t5-line: rgba(13, 59, 102, 0.14);
	--t5-surface: #ffffff;
	--t5-sky: #eaf4fb;
	--t5-shadow: 0 4px 14px rgba(20, 30, 55, 0.08);
	--t5-shadow-hover: 0 18px 40px rgba(20, 30, 55, 0.16);
}

/* Traka iza zaglavlja ide u svetlo plavu podlogu sa naslovne, umesto brend */
/* gradijenta — zuta bi na toj visini nadjacala celu stranu. */

.e-13f11794 > .holder.sp-theme-5 > .hero-band
{
	background: linear-gradient(180deg, var(--t5-sky) 0%, rgba(234, 244, 251, 0) 100%);
}

/* ===== TEMA 5 — zaglavlje ===== */

.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .eyebrow
{
	color: var(--t5-blue);
}

.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .count-value
{
	font-family: var(--ot-font-primary);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--t5-ink);
	font-variation-settings: 'wght' 800;
}

.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .count-label,
.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .description
{
	color: var(--t5-muted);
}

.e-13f11794 > .holder.sp-theme-5 .e-a1f0e9c .count
{
	border-color: var(--t5-line);
}

/* ===== TEMA 5 — panel filtera ===== */

/* Bela ploca, uglovi 10px, tanka ivica i laka senka — isti recept po kom su */
/* nacrtane kartice naslovne. */

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 > .holder
{
	background: var(--t5-surface);
	border-color: var(--t5-line);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t5-shadow);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .group
{
	border-color: var(--t5-line);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .head-icon
{
	color: var(--t5-blue);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option-label
{
	color: var(--t5-ink);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option-count,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .group-chevron
{
	color: var(--t5-muted);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .options-search
{
	border-color: var(--t5-line);
}

/* Cekirano polje u zutoj sa naslovne. */

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--t5-accent);
	border-color: var(--t5-accent);
}

/* Kvacica je u osnovnom elementu bela, sto na zutoj popuni nestaje — mastilo */
/* mora u tamni ton kojim naslovna pise tekst preko svojih zutih povrsina. */

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option.is-checked .option-mark > i
{
	color: var(--t5-accent-ink);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option-expand
{
	color: var(--t5-blue);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .option:hover
{
	background: var(--t5-accent-soft);
}

.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 .head-clear:hover
{
	color: var(--t5-blue);
	background: var(--t5-accent-soft);
}

/* ===== TEMA 5 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-5 .e-13096690 > .holder
{
	border-color: var(--t5-line);
}

.e-13f11794 > .holder.sp-theme-5 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-5 .e-13096690 .sort-value
{
	color: var(--t5-ink);
}

.e-13f11794 > .holder.sp-theme-5 .e-13096690 .count-label,
.e-13f11794 > .holder.sp-theme-5 .e-13096690 .sort-label
{
	color: var(--t5-muted);
}

.e-13f11794 > .holder.sp-theme-5 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-5 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-5 .e-13096690 .filter-trigger
{
	background: var(--t5-surface);
	border-color: var(--t5-line);
}

/* Upaljen prikaz (mreza/lista) je zut sa tamnim mastilom — isto stanje kojim */
/* naslovna oznacava upaljen tab. */

.e-13f11794 > .holder.sp-theme-5 .e-13096690 .view-btn.is-active
{
	background: var(--t5-accent);
	color: var(--t5-accent-ink);
}

/* ===== TEMA 5 — kartica ===== */

/* Bela kartica, uglovi 10px, bez obruba i sa lakom senkom naslovne; hover */
/* podize senku na izmerenu vrednost sa naslovne. */

/* Skin teme nosi pet klasa i time bi pregazio varijantu iz element fajla */
/* (cetiri klase), pa svako pravilo koje BOJI karticu propusta inspire dalje. */

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire)
{
	background: var(--t5-surface);
	border-color: transparent;
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t5-shadow);
}

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire):hover
{
	box-shadow: var(--t5-shadow-hover);
}

/* Naziv ponude prati naziv kartice sa naslovne: Inter 800 u #0D3B66. */
/* font-variation-settings se vraca na normal jer bi 'opsz' 144 ostalo na serifu. */

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) .name
{
	font-family: var(--ot-font-primary);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.005em;
	color: var(--t5-ink);
	font-variation-settings: normal;
}

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) .description,
.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) .destination-text
{
	color: var(--t5-muted);
}

/* Donja traka: brend plava na beloj, a na hover cela traka ide u zutu sa tamnim */
/* mastilom (osnovni raspored je tu skoro crn, sto na plavo-zutoj temi izgleda */
/* strano). */

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) > .body > .action
{
	background: var(--t5-surface);
	border-top-color: var(--t5-line);
}

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire):hover > .body > .action
{
	background: var(--t5-accent);
}

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire) > .body > .action > .action-arrow
{
	color: var(--t5-blue);
}

.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire):hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-5 .e-5677af83 > .holder:not(.inspire):hover > .body > .action > .action-arrow
{
	color: var(--t5-accent-ink);
}

/* ===== TEMA 5 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 > .holder
{
	border-color: var(--t5-line);
}

.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .per-page-select
{
	background: var(--t5-surface);
	border-color: var(--t5-line);
	color: var(--t5-ink);
}

.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .page:hover,
.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .arrow:hover
{
	border-color: var(--t5-accent);
	color: var(--t5-blue);
}

.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .page.is-active
{
	background: var(--t5-accent);
	border-color: var(--t5-accent);
	color: var(--t5-accent-ink);
}

.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .counter-label,
.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .counter-sep,
.e-13f11794 > .holder.sp-theme-5 .e-6a07c313 .per-page-label
{
	color: var(--t5-muted);
}

/* ===== TEMA 5 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-5 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ============================================================ */
/* ===== TAMNE TEME — 6-DARK i 7 ============================== */
/* ============================================================ */

/* Naslovne tema 6-dark i tema 7 su ista tamna luksuzna kompozicija u dve */
/* palete: 6-dark stoji na ugljenoj #0B0B0C sa mesinganom #D9B26A, a tema 7 na */
/* punoj crnoj #000000 sa klasicnom zlatnom #D4AF37. sections.css ih zato vec */
/* deli kroz jednu bazu (:is(.sp-theme-6-dark, .sp-theme-7) sa --dl-* tokenima) */
/* i tek onda prebojava temu 7. Lista ponuda ide istim putem: struktura stoji */
/* jednom, a svaka tema donosi samo svojih dvadeset --dlist-* vrednosti. */

/* Lista je u DRUGOM podstablu (.e-13f11794) nego sekcije naslovne (.e-54f75aaa), */
/* pa --dl-* promenljive naslovne ovde nisu vidljive — vrednosti se PREPISUJU. */

/* Osnovni CSS liste na vise mesta vuce --ot-text-1, a to je indigo #1A093F koji */
/* je klijent na obe tamne teme odbio (hover akcione trake kartice, aktivna strana */
/* paginacije, ikone srca i galerije). Sva ta mesta su ovde prebojena u zlatnu. */

/* ===== TAMNE TEME — paleta teme 6-dark ===== */

/* Vrednosti su IZMERENE na renderovanoj /theme-6-dark (getComputedStyle): */
/*   naslov sekcije   Fraunces 40px, 'opsz' 144 / 'wght' 400, boja #F3ECE0 */
/*   nadnaslov        Inter 13px 700, letter-spacing 1.82px, boja #D9B26A */
/*   CTA pilula       popuna #D9B26A, mastilo #161310, radius 100px */
/*   kartica          radius 10px, senka rgba(0, 0, 0, .42) 0 14px 34px */
/*   podloge sekcija  #0B0B0C, #161310, #0E1216, #121110 */

.e-13f11794 > .holder.sp-theme-6-dark
{
	--dlist-surface: #0b0b0c;
	--dlist-panel: #161310;
	--dlist-panel-soft: #121110;
	--dlist-image: #1a1815;
	--dlist-ink: #f3ece0;
	--dlist-ink-68: rgba(243, 236, 224, 0.68);
	--dlist-ink-56: rgba(243, 236, 224, 0.56);
	--dlist-ink-on-gold: #161310;
	--dlist-gold: #d9b26a;
	--dlist-gold-hover: #c79e55;
	--dlist-gold-wash: rgba(217, 178, 106, 0.14);
	--dlist-gold-border: rgba(217, 178, 106, 0.32);
	--dlist-line: rgba(217, 178, 106, 0.22);
	--dlist-stars: #c9a227;
	--dlist-radius: var(--ot-radius-m);
	--dlist-shadow: 0 14px 34px rgba(0, 0, 0, 0.42);
	--dlist-shadow-hover: 0 20px 44px rgba(0, 0, 0, 0.55);
	--dlist-band: linear-gradient(180deg, #161310 0%, rgba(22, 19, 16, 0) 100%);
	--dlist-apply-count: rgba(22, 19, 16, 0.18);
	--dlist-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23d9b26a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

/* ===== TAMNE TEME — paleta teme 7 ===== */

/* Vrednosti su IZMERENE na renderovanoj /theme-7 (getComputedStyle): */
/*   naslov sekcije   Fraunces 40px, 'opsz' 144 / 'wght' 400, boja #F5F1E8 */
/*   opis             Inter 18px 400, boja rgba(245, 241, 232, .68) */
/*   CTA pilula       popuna #D4AF37, mastilo #0A0A0A, radius 100px */
/*   neupaljena pilula   providna, mastilo rgba(245, 241, 232, .76), */
/*                       ivica 1px rgba(212, 175, 55, .32) */
/*   zvezdice         #D4AF37 */
/*   kartica          radius 18px, senka rgba(20, 18, 16, .2) 0 14px 34px */
/*   podloge          #000000 strana, #0A0A0A udubljeno, #0F0F0F izdignuto */

/* Klijent za karticu tekstom trazi "~10px", ali isti pasus iznad toga trazi da */
/* se sve USKLADI sa naslovnom. Naslovna svoje kartice crta na 18px, pa kartica */
/* liste ide na 18px — isti izbor kao na temi 2, gde je izmerena naslovna takodje */
/* pobedila okvirnu brojku iz opisa. */

/* Senka na punoj crnoj: rgba(20, 18, 16, .2) preko #000000 kompozituje u #040303, */
/* pa se cita kao vrlo blag topao oreol. Vidljivu ivicu kartice nosi zlatna vlas. */

.e-13f11794 > .holder.sp-theme-7
{
	--dlist-surface: #000000;
	--dlist-panel: #0f0f0f;
	--dlist-panel-soft: #0a0a0a;
	--dlist-image: #0a0a0a;
	--dlist-ink: #f5f1e8;
	--dlist-ink-68: rgba(245, 241, 232, 0.68);
	--dlist-ink-56: rgba(245, 241, 232, 0.56);
	--dlist-ink-on-gold: #0a0a0a;
	--dlist-gold: #d4af37;
	--dlist-gold-hover: #b9932c;
	--dlist-gold-wash: rgba(212, 175, 55, 0.14);
	--dlist-gold-border: rgba(212, 175, 55, 0.32);
	--dlist-line: rgba(212, 175, 55, 0.22);
	--dlist-stars: #d4af37;
	--dlist-radius: var(--ot-radius-l);
	--dlist-shadow: 0 14px 34px rgba(20, 18, 16, 0.2);
	--dlist-shadow-hover: 0 20px 44px rgba(212, 175, 55, 0.12);
	--dlist-band: linear-gradient(180deg, #0a0a0a 0%, rgba(10, 10, 10, 0) 100%);
	--dlist-apply-count: rgba(10, 10, 10, 0.18);
	--dlist-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23d4af37' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

/* ===== TAMNE TEME — strana ===== */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7)
{
	background: var(--dlist-surface);

	/* Nasledjeno mastilo je svetlo da nijedan omotac ne nosi tamnu boju teksta */
	/* svetle teme; svaki tekstualni cvor svoj ton dobija pravilom nize. */

	color: var(--dlist-ink);
}

/* Traka iza zaglavlja prelazi iz dublje podloge naslovne u osnovnu. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) > .hero-band
{
	background: var(--dlist-band);
}

/* ===== TAMNE TEME — zaglavlje ===== */

/* Nadnaslov je zlatan; crta pored njega nasledjuje currentColor pa ide s njim. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .eyebrow
{
	color: var(--dlist-gold);
}

/* Naslov i broj ostaju serifni Fraunces na osi 'wght' 400 — tacno kako se */
/* naslovi naslovne stvarno crtaju posle globalnog h1-h6 pravila. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .title,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .count-value
{
	color: var(--dlist-ink);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .count-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .description
{
	color: var(--dlist-ink-68);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-a1f0e9c .count
{
	border-color: var(--dlist-line);
}

/* ===== TAMNE TEME — panel filtera ===== */

/* Ploca u izdignutoj podlozi, tanka zlatna ivica i senka. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 > .holder
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
	border-radius: var(--dlist-radius);
	box-shadow: var(--dlist-shadow);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .head
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .group
{
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .head-icon
{
	color: var(--dlist-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .head-title,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .group-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .search > input,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .options-search > input
{
	color: var(--dlist-ink);
}

/* Ikona uz naslov grupe je u osnovnom elementu neutralno siva #78787C i jedina */
/* je u panelu ostala van palete — ide u prigusen ton mastila teme. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option-count,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .group-head-icon,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .group-chevron,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .head-clear,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .search-icon,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .options-search > i,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option-icon
{
	color: var(--dlist-ink-56);
}

/* Polja za unos idu u udubljenu podlogu da se odvoje od ploce panela. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .search,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .options-search
{
	background: var(--dlist-panel-soft);
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .search:focus-within,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .options-search:focus-within
{
	background: var(--dlist-panel-soft);
	border-color: var(--dlist-gold-border);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .search > input::placeholder,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .options-search > input::placeholder
{
	color: var(--dlist-ink-56);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option-mark
{
	background: var(--dlist-panel-soft);
	border-color: var(--dlist-gold-border);
}

/* Cekirano polje u zlatnoj naslovne. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--dlist-gold);
	border-color: var(--dlist-gold);
}

/* Kvacica je u osnovnom elementu bela, sto na zlatnoj popuni skoro nestaje — */
/* mastilo mora u tamni ton kojim naslovna pise tekst preko svojih zlatnih CTA. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option.is-checked .option-mark > i
{
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option-expand
{
	color: var(--dlist-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .option:hover
{
	background: var(--dlist-gold-wash);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .head-clear:hover
{
	color: var(--dlist-gold);
	background: var(--dlist-gold-wash);
}

/* Brojac uz naslov grupe je u osnovi brend plav sa belim brojem. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .group-count
{
	background: var(--dlist-gold);
	color: var(--dlist-ink-on-gold);
}

/* Dugme "Prikazi rezultate" u fioci: osnovni raspored ga puni sa --ot-text-1. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .foot
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .apply
{
	background: var(--dlist-gold);
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .apply:hover
{
	background: var(--dlist-gold-hover);
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 .apply-count
{
	background: var(--dlist-apply-count);
}

/* ===== TAMNE TEME — gornja traka ===== */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 > .holder
{
	border-color: var(--dlist-line);
}

/* .sort nosi sopstveni --ot-text-1 (indigo #1A093F) pa svaki tekstualni cvor koji */
/* mu se kasnije doda ne bi nasledio mastilo teme — boja ide i na samo dugme. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .count-value,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort-value,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .filter-trigger
{
	color: var(--dlist-ink);
}

/* Ikona na dugmetu "Filteri" (fioka) je u osnovi brend plava — ista je uloga kao */
/* ikona uz naslov panela, pa ide u istu zlatnu. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .filter-trigger > i
{
	color: var(--dlist-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .count-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort-icon,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort-chevron,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .view-btn
{
	color: var(--dlist-ink-56);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .filter-trigger
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .sort:hover,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .filter-trigger:hover
{
	background: var(--dlist-panel);
	border-color: var(--dlist-gold-border);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .view
{
	background: var(--dlist-panel-soft);
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .view-btn:hover
{
	color: var(--dlist-ink);
}

/* Upaljen prikaz (mreza/lista) je zlatan sa tamnim mastilom — isto stanje kojim */
/* naslovna oznacava svoje CTA pilule. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-13096690 .view-btn.is-active
{
	background: var(--dlist-gold);
	color: var(--dlist-ink-on-gold);
}

/* ===== TAMNE TEME — kartica ===== */

/* Podloga je izdignuta u odnosu na stranu, ivica je zlatna vlas, uglovi i senka */
/* dolaze iz palete teme (10px na 6-dark, 18px na temi 7). */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
	border-radius: var(--dlist-radius);
	box-shadow: var(--dlist-shadow);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder:hover
{
	border-color: var(--dlist-gold-border);
	box-shadow: var(--dlist-shadow-hover);
}

/* Prazno mesto slike pre ucitavanja je tamno, ne svetlo sivo. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder > .cover
{
	background-color: var(--dlist-image);
}

/* Srce i strelice galerije ostaju bela kruzna dugmad, ali im je ikona u osnovi */
/* --ot-text-1 (indigo #1A093F) koji je klijent odbio. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 .save,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 .shot
{
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder.is-saved .save
{
	background: var(--dlist-gold);
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 .stars > i
{
	color: var(--dlist-stars);
}

/* Klijent trazi da nazivi svih kartica krenu u istoj liniji. Red sa zastavicom */
/* i zvezdicama je prazan kad tura nema zemlju (4/48) ili ima samo zvezdice */
/* (10/48), pa se skupi na 0 odnosno 12px i naziv se digne za 21 odnosno 9px. */
/* Rezervisana visina jednog reda destinacije vraca sve nazive na istu liniju. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder > .body > .head
{
	min-height: 21px;
}

/* Naziv ponude ostaje serifni Fraunces naslovne, samo u svetlom mastilu. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder .name
{
	color: var(--dlist-ink);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder:hover > .body > .name
{
	color: var(--dlist-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder .description,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder .destination-text
{
	color: var(--dlist-ink-68);
}

/* Donja traka: osnovni raspored je puni sa --ot-bg-2, a na hover sa --ot-text-1 */
/* (indigo #1A093F). Oba idu u tamnu podlogu odnosno zlatni sloj. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder > .body > .action
{
	background: var(--dlist-panel-soft);
	border-top-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder:hover > .body > .action
{
	background: var(--dlist-gold-wash);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder > .body > .action > .action-text,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder > .body > .action > .action-arrow,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder:hover > .body > .action > .action-text,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-5677af83 > .holder:hover > .body > .action > .action-arrow
{
	color: var(--dlist-gold);
}

/* ===== TAMNE TEME — prazno stanje ===== */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .listing-empty > i
{
	color: var(--dlist-ink-56);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .listing-empty > p
{
	color: var(--dlist-ink-68);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) > .listing-layout > .listing-scrim
{
	background: rgba(0, 0, 0, 0.62);
}

/* ===== TAMNE TEME — paginacija ===== */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 > .holder
{
	border-color: var(--dlist-line);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .page,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .arrow,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .per-page-select
{
	background: var(--dlist-panel);
	border-color: var(--dlist-line);
	color: var(--dlist-ink);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .page:hover:not(:disabled):not(.is-active),
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .arrow:hover:not(:disabled)
{
	background: var(--dlist-gold-wash);
	border-color: var(--dlist-gold-border);
	color: var(--dlist-gold);
}

/* Aktivna strana je u osnovi --ot-text-1 (indigo #1A093F) — ide u zlatnu. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .page.is-active
{
	background: var(--dlist-gold);
	border-color: var(--dlist-gold);
	color: var(--dlist-ink-on-gold);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .page.is-dots
{
	background: transparent;
	border-color: transparent;
	color: var(--dlist-ink-56);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .counter-value
{
	color: var(--dlist-ink);
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .counter-label,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .counter-sep,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .counter-total,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .per-page-label
{
	color: var(--dlist-ink-56);
}

/* Strelica u padajucem broju po strani je data-URI sa sivim potezom %23787878 */
/* koji se na tamnoj podlozi ne vidi. Ceo url se ne moze delimicno prepisati, pa */
/* svaka tema svoju zlatnu verziju drzi u --dlist-chevron tokenu. */

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .per-page-select
{
	background-image: var(--dlist-chevron);
	background-repeat: no-repeat;
	background-position: right 14px center;
}

.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .per-page-select:hover,
.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-6a07c313 .per-page-select:focus
{
	border-color: var(--dlist-gold-border);
}

/* ===== TAMNE TEME — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder:is(.sp-theme-6-dark, .sp-theme-7) .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}

/* ===== TEMA 7 — dopune posle kontrolnog merenja ===== */

/* Naziv kartice: deljeno tamno pravilo nosi samo boju, pa naziv ostaje na */
/* globalnoj osi za naslove ('opsz' 144 bez 'wght'), sto ga crta na 400. */
/* Naslovna /theme-7 svoje kartice pise Fraunces 600 / 22px (izmereno: proba */
/* na 100px daje 531.97px naspram 501.98px). Klijent trazi podebljan naziv I */
/* uskladjivanje sa naslovnom — oba vode na 600. */
/* 'font-variation-settings' se pise izricito jer inace gazi 'font-weight'. */

.e-13f11794 > .holder.sp-theme-7 .e-5677af83 > .holder .name
{
	font-weight: 600;
	font-variation-settings: normal;
}

/* Znacka bazena je u baznoj kartici brend plava (--ot-blue #0E74B4) sa belim */
/* slovima — jedina boja van crno-zlatne palete koja je prezivela na listi. */
/* Prelazi u neprovidnu tamnu pilulu sa zlatnim mastilom i vlasi, isto kao */
/* ugasena pilula filtera; neprovidna je zato sto stoji preko fotografije. */

.e-13f11794 > .holder.sp-theme-7 .e-5677af83 .pool-chip
{
	background: var(--dlist-panel-soft);
	border: 1px solid var(--dlist-gold-border);
	color: var(--dlist-gold);
}

/* ============================================================ */
/* ===== TEMA 8 =============================================== */
/* ============================================================ */

/* Naslovna /theme-8 nosi config.theme = "6", pa je njen holder .sp-theme-6, ali */
/* njene sekcije NISU tople bez kao kod teme 6 — one su iz mozaik porodice: */
/* podloge se smenjuju #FFFFFF / #EAF4FB / #FBEEDD / #F7F4EF, mastilo je indigo, */
/* a potpis je zuta #F5C518. Lista zato dobija svoj skin, a globalni futer je u */
/* sections.css podeljen kroz :is(.sp-theme-6, .sp-theme-8) da obe strane teme 8 */
/* stoje na istom peskovitom futeru. */

/* Vrednosti su IZMERENE na renderovanoj /theme-8 (getComputedStyle), ne */
/* prepisane iz CSS-a, jer globalna pravila sajta gaze deo deklaracija: */
/*   naslov sekcije     Fraunces 40px, 'opsz' 144 'wght' 400, #1A093F, -1px */
/*   nadnaslov          13px / 700 / 1.82px, boja #78787C */
/*   crtica nadnaslova  26 x 2px, brend plava #037AD5 */
/*   naziv kartice      Fraunces 22px / 600 / -0.22px / 25.08px, mastilo #1A093F */
/*   telo kartice       zuto #F5C518, mastilo na njemu #1C1A12 */
/*   "POGLEDAJ PONUDU"  12px / 700 / 1.92px, podvuceno rgba(28, 26, 18, 0.45) */
/*   upaljen tab i CTA  #F5C518 sa mastilom #1C1A12, hover CTA #E0B30E */
/*   zvezdice           #F5B301 */
/*   senka kartice      0 14px 34px rgba(20, 18, 16, 0.20) */
/*   futer              podloga #EAD5B9, mastilo #5A462E */

/* Probom na 100px izmereno je da se h2 naslovi naslovne zbog globalnog */
/* 'wght' 400 crtaju na 400 (713.19px i kao renderovani naslov i kao cist */
/* Fraunces 400 'opsz' 144), pa zaglavlje liste ostaje na toj istoj osi — svaka */
/* deblja vrednost bi listu ucinila teznom od naslovne sa kojom se uskladjuje. */

/* Zuta #F5C518 na beloj ima kontrast ~1.6 pa ne moze da nosi slova. Ide */
/* iskljucivo u POPUNE (donja traka kartice, cekiran mark, upaljen prikaz, */
/* aktivna strana), a mastilo na njoj je #1C1A12 — tacno kao na naslovnoj. */

/* Sve visi na sp-theme-8 klasi, pa /ponude i ostale liste ostaju netaknute. */

.e-13f11794 > .holder.sp-theme-8
{
	--t8-ink: #1a093f;
	--t8-muted: #48484c;
	--t8-soft: #78787c;
	--t8-accent: #f5c518;
	--t8-accent-ink: #1c1a12;
	--t8-accent-hover: #e0b30e;
	--t8-accent-soft: rgba(245, 197, 24, 0.20);
	--t8-accent-line: rgba(28, 26, 18, 0.45);
	--t8-blue: #037ad5;
	--t8-star: #f5b301;
	--t8-line: rgba(26, 9, 63, 0.14);
	--t8-surface: #ffffff;
	--t8-sand: #fbeedd;
	--t8-shadow: 0 4px 14px rgba(20, 18, 16, 0.10);
	--t8-shadow-hover: 0 14px 34px rgba(20, 18, 16, 0.20);

	color: var(--t8-ink);
}

/* Traka iza zaglavlja ide u peskovitu podlogu sa naslovne (i futera teme), */
/* umesto brend gradijenta — zuta bi na toj visini nadjacala celu stranu. */

.e-13f11794 > .holder.sp-theme-8 > .hero-band
{
	background: linear-gradient(180deg, var(--t8-sand) 0%, rgba(251, 238, 221, 0) 100%);
}

/* ===== TEMA 8 — zaglavlje ===== */

/* Nadnaslov je doslovna kopija nadnaslova sekcija naslovne: siva slova uz */
/* crticu u brend plavoj. Naslovna taj obrazac vec crta kao "kratka linija + rec, */
/* sitno, velikim slovima", pa lista ne uvodi svoju varijantu. */

.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .eyebrow
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--t8-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .eyebrow > .eyebrow-mark
{
	width: 26px;
	height: 2px;
	background: var(--t8-blue);
}

.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .title,
.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .count-value
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.025em;
	color: var(--t8-ink);
	font-variation-settings: 'opsz' 144, 'wght' 400;
}

.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .count-label,
.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .description
{
	color: var(--t8-muted);
}

.e-13f11794 > .holder.sp-theme-8 .e-a1f0e9c .count
{
	border-color: var(--t8-line);
}

/* ===== TEMA 8 — panel filtera ===== */

/* Bela ploca, uglovi 10px, tanka ivica i laka senka — recept koji klijent trazi */
/* i za kartice, pa panel i mreza stoje na istom materijalu. */

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 > .holder
{
	background: var(--t8-surface);
	border-color: var(--t8-line);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t8-shadow);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .head,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .group
{
	border-color: var(--t8-line);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .head-icon
{
	color: var(--t8-blue);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .head-title,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .group-label,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option-label,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .search > input,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .options-search > input
{
	color: var(--t8-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option-count,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .group-head-icon,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .group-chevron,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option-icon,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option-expand
{
	color: var(--t8-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option-mark,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .search,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .options-search
{
	border-color: var(--t8-line);
}

/* Cekirano polje u zutoj sa naslovne. */

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option.is-checked .option-mark
{
	background: var(--t8-accent);
	border-color: var(--t8-accent);
}

/* Kvacica je u osnovnom elementu bela, sto na zutoj popuni nestaje — mastilo */
/* mora u tamni ton kojim naslovna pise tekst preko svojih zutih povrsina. */

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option.is-checked .option-mark > i
{
	color: var(--t8-accent-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option.is-checked .option-icon,
.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option.is-checked .option-label
{
	color: var(--t8-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .option:hover
{
	background: var(--t8-accent-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 .head-clear:hover
{
	color: var(--t8-ink);
	background: var(--t8-accent-soft);
}

/* ===== TEMA 8 — gornja traka ===== */

.e-13f11794 > .holder.sp-theme-8 .e-13096690 > .holder
{
	border-color: var(--t8-line);
}

.e-13f11794 > .holder.sp-theme-8 .e-13096690 .count-value,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort-value,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .filter-trigger
{
	color: var(--t8-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-13096690 .count-label,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort-label,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort-icon,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort-chevron,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .view-btn
{
	color: var(--t8-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-13096690 .sort,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .view,
.e-13f11794 > .holder.sp-theme-8 .e-13096690 .filter-trigger
{
	background: var(--t8-surface);
	border-color: var(--t8-line);
}

/* Upaljen prikaz (mreza/lista) je zut sa tamnim mastilom — isto stanje kojim */
/* naslovna oznacava upaljen tab zemlje. */

.e-13f11794 > .holder.sp-theme-8 .e-13096690 .view-btn.is-active
{
	background: var(--t8-accent);
	color: var(--t8-accent-ink);
}

/* ===== TEMA 8 — kartica ===== */

/* Klijent trazi belu karticu sa uglovima od ~10px i lakom senkom; hover podize */
/* senku na izmerenu vrednost kartica naslovne. */

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder
{
	background: var(--t8-surface);
	border-color: var(--t8-line);
	border-radius: var(--ot-radius-m);
	box-shadow: var(--t8-shadow);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder:hover
{
	box-shadow: var(--t8-shadow-hover);
}

/* Klijent trazi da nazivi budu u istoj liniji u celoj mrezi. Red sa zemljom i */
/* zvezdicama se skupi kad tura nema zemlju (izmereno: 4 od 48 kartica, visina 0) */
/* ili ima samo zvezdice (10 od 48, visina 12), pa se naziv digne za 21 odnosno */
/* 9 piksela. grid-auto-rows: 1fr to ne resava — ono izjednacava visine kartica, */
/* ne gornji deo tela. Prag je izmerena puna visina reda: 21px. */

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder > .body > .head
{
	min-height: 21px;
}

/* Naziv ponude prati naziv kartice naslovne: Fraunces 22px na osi 600. */
/* 'opsz' 144 se mora ugasiti jer bi opticku osu vratilo na display rez. */

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder .name
{
	font-family: var(--ot-font-secondary);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.01em;
	color: var(--t8-ink);
	font-variation-settings: normal;
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder .description
{
	color: var(--t8-muted);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder .destination-text
{
	color: var(--t8-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder .stars > i
{
	color: var(--t8-star);
}

/* Donja traka je zuta traka sa tamnim mastilom — isti materijal kojim naslovna */
/* crta telo svoje kartice. Natpis prati "POGLEDAJ PONUDU" sa naslovne: velikim */
/* slovima, 12px / 700 / 0.16em, podvucen istim poluprovidnim mastilom. */

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder > .body > .action
{
	background: var(--t8-accent);
	border-top-color: var(--t8-accent);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder:hover > .body > .action
{
	background: var(--t8-accent-hover);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder > .body > .action > .action-text
{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--t8-accent-ink);
	border-bottom: 1px solid var(--t8-accent-line);
}

.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder:hover > .body > .action > .action-text,
.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder > .body > .action > .action-arrow,
.e-13f11794 > .holder.sp-theme-8 .e-5677af83 > .holder:hover > .body > .action > .action-arrow
{
	color: var(--t8-accent-ink);
}

/* ===== TEMA 8 — paginacija ===== */

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 > .holder
{
	border-color: var(--t8-line);
}

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .page,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .arrow,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .per-page-select
{
	background: var(--t8-surface);
	border-color: var(--t8-line);
	color: var(--t8-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .page:hover,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .arrow:hover
{
	border-color: var(--t8-accent);
	background: var(--t8-accent-soft);
}

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .page.is-active
{
	background: var(--t8-accent);
	border-color: var(--t8-accent);
	color: var(--t8-accent-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .counter-value
{
	color: var(--t8-ink);
}

.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .counter-label,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .counter-sep,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .counter-total,
.e-13f11794 > .holder.sp-theme-8 .e-6a07c313 .per-page-label
{
	color: var(--t8-muted);
}

/* ===== TEMA 8 — fioka sa filterima ===== */

@media (max-width: 900px)
{
	.e-13f11794 > .holder.sp-theme-8 .e-8d5a0f0 > .holder
	{
		border-radius: 0;
		min-height: 100%;
		box-shadow: none;
	}
}
.e-35f5f425
{
	display: block;
	width: 100%;
}

.e-35f5f425 > .holder
{
	display: flex;
	flex-direction: column;
	width: 100%;
}

.e-35f5f425 > .empty
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	text-align: center;
	min-height: 60vh;
}

.e-35f5f425 > .empty > .empty-icon
{
	font-size: 64px;
	color: var(--ot-text-3);
}

.e-35f5f425 > .empty > .empty-title
{
	margin: 0;
	font-family: var(--ot-font-secondary);
	font-size: 28px;
	font-weight: 500;
	color: var(--ot-text-1);
}

.e-35f5f425 > .empty > .empty-text
{
	margin: 0;
	font-size: 14px;
	color: var(--ot-text-2);
	max-width: 420px;
}

.e-35f5f425 > .holder > .gallery-block
{
	padding: 24px 32px 0;
}

.e-35f5f425 > .holder > .body-layout
{
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 48px;
	padding: 48px 32px 96px;
	align-items: flex-start;
}

.e-35f5f425 > .holder > .body-layout > .body-main
{
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.e-35f5f425 > .holder > .body-layout > .body-sidebar
{
	min-width: 0;
	position: sticky;
	top: var(--ot-spacing-m);
}

.e-35f5f425 .block-section
{
	display: flex;
	flex-direction: column;
	gap: 24px;
	scroll-margin-top: 160px;
	padding: 8px 0;
}

@media (max-width: 1100px)
{
	.e-35f5f425 > .holder > .body-layout
	{
		grid-template-columns: 1fr;
	}

	.e-35f5f425 > .holder > .body-layout > .body-sidebar
	{
		position: relative;
		top: auto;
	}
}

@media (max-width: 900px)
{
	.e-35f5f425 > .holder > .gallery-block
	{
		padding: 16px 20px 0;
	}

	.e-35f5f425 > .holder > .body-layout
	{
		padding: 32px 20px 64px;
	}
}
.p-6aaecdd6 .content
{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc(100vh - 80px);
	padding: 80px 0;
}
/* ===== FORM NOTICE ===== */

.form-notice
{
	padding: var(--ot-spacing-s) var(--ot-spacing-m);
	margin-top: var(--ot-spacing-m);
	border-radius: var(--ot-radius-m);
	font-size: var(--ot-size-m);
	font-weight: 500;
	line-height: 1.4;
}

.form-notice.success
{
	background: var(--ot-green-opacity);
	border: 1px solid var(--ot-green-border);
	color: var(--ot-green);
}

.form-notice.error
{
	background: var(--ot-red-opacity);
	border: 1px solid var(--ot-red-border);
	color: var(--ot-red);
}
/* ===== ATLAS — Mondorama brand ===== */

:root
{
	--ot-spacing-x: 4px;
	--ot-spacing-s: 10px;
	--ot-spacing-m: 20px;
	--ot-spacing-l: 40px;

	--ot-radius-s: 6px;
	--ot-radius-m: 10px;
	--ot-radius-l: 18px;

	--ot-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ot-font-secondary: 'Fraunces', 'Inter', Georgia, serif;

	/* Pure white surfaces, neutral light borders */

	--ot-bg-1: rgba(255, 255, 255, 1);
	--ot-bg-1-border: rgba(232, 232, 232, 1);
	--ot-bg-1-opacity: rgba(255, 255, 255, 0.94);
	--ot-bg-1-hover: rgba(250, 250, 250, 1);

	--ot-bg-2: rgba(248, 248, 248, 1);
	--ot-bg-2-border: rgba(228, 228, 228, 1);
	--ot-bg-2-opacity: rgba(248, 248, 248, 0.92);
	--ot-bg-2-hover: rgba(243, 243, 243, 1);

	--ot-bg-3: rgba(240, 240, 240, 1);
	--ot-bg-3-border: rgba(218, 218, 218, 1);
	--ot-bg-3-opacity: rgba(240, 240, 240, 0.92);
	--ot-bg-3-hover: rgba(232, 232, 232, 1);

	--ot-bg-4: rgba(228, 228, 228, 1);
	--ot-bg-4-border: rgba(208, 208, 208, 1);
	--ot-bg-4-opacity: rgba(228, 228, 228, 0.92);
	--ot-bg-4-hover: rgba(218, 218, 218, 1);

	--ot-text-1: rgba(18, 18, 20, 1);
	--ot-text-2: rgba(72, 72, 76, 1);
	--ot-text-3: rgba(120, 120, 124, 1);

	/* Mondorama brand red — #ed1c24 */

	--ot-brand: rgba(237, 28, 36, 1);
	--ot-brand-border: rgba(243, 76, 82, 1);
	--ot-brand-opacity: rgba(237, 28, 36, 0.10);
	--ot-brand-hover: rgba(204, 16, 24, 1);

	--ot-shadow-s: 0 1px 3px rgba(0, 0, 0, 0.06);
	--ot-shadow-m: 0 8px 24px -8px rgba(0, 0, 0, 0.10);
	--ot-shadow-l: 0 24px 60px -16px rgba(0, 0, 0, 0.14);

	/* Visina fiksnog kajrona (layout-ticker-1) na dnu ekrana */

	--ot-ticker-height: 38px;
}

/* Rezerviši prostor na dnu skrol kontejnera da fiksni kajron ne prekriva napomene */

.ot-page-area
{
	padding-bottom: var(--ot-ticker-height);
}

body
{
	background: var(--ot-bg-1);
	font-family: var(--ot-font-primary);
	color: var(--ot-text-1);
}

h1, h2, h3, h4, h5, h6
{
	font-family: var(--ot-font-secondary);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.05;
	color: var(--ot-text-1);
	font-variation-settings: 'opsz' 144, 'wght' 400;
}

h1 em, h2 em, h3 em, h4 em
{
	font-style: italic;
	font-weight: 400;
	color: var(--ot-brand);
}

a
{
	color: inherit;
	text-decoration: none;
	transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}