/* 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-5511e8fd
{
	display: block;
}

.e-5511e8fd > .holder
{
	--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: 12px;
	--ot-size-l: 22px;

	--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: rgba(225, 228, 232, 1);
	--ot-text-2: rgba(156, 156, 156, 1);
	--ot-text-3: rgba(100, 100, 100, 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%);

	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 300px;
	display: flex;
	flex-direction: column;
	background: var(--ot-bg-1);
	border-right: 1px solid var(--ot-bg-2-border);
	color: var(--ot-text-1);
	font-family: var(--ot-font-primary);
	z-index: 1000;
}

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

.e-5511e8fd > .holder > .head
{
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 0 14px;
	border-bottom: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-5511e8fd > .holder > .head:empty
{
	display: none;
}

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

.e-5511e8fd > .holder > .body
{
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 16px 12px;
	scrollbar-width: thin;
	scrollbar-color: var(--ot-bg-3-border) transparent;
}

.e-5511e8fd > .holder > .body::-webkit-scrollbar
{
	width: 6px;
}

.e-5511e8fd > .holder > .body::-webkit-scrollbar-thumb
{
	background: var(--ot-bg-3-border);
	border-radius: 3px;
}

.e-5511e8fd > .holder > .body::-webkit-scrollbar-thumb:hover
{
	background: var(--ot-bg-4-border);
}

.e-5511e8fd > .holder > .body::-webkit-scrollbar-track
{
	background: transparent;
}

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

.e-5511e8fd > .holder > .links
{
	padding: 10px 12px;
	flex-shrink: 0;
}

.e-5511e8fd > .holder > .links:empty
{
	display: none;
}

.e-5511e8fd > .holder > .foot
{
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 10px 12px;
	border-top: 1px solid var(--ot-bg-2-border);
	flex-shrink: 0;
}

.e-5511e8fd > .holder > .foot:empty
{
	display: none;
}
.e-ecff492
{
	display: block;
	width: 100%;
}

.e-ecff492 > .holder
{
	display: block;
	width: 100%;
	padding: 10px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: var(--ot-radius-m);
}
.e-430ef87
{
	display: block;
	width: 100%;
}

.e-430ef87 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.e-430ef87 .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-430ef87 .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}
.e-1f72fcf8
{
	display: block;
	width: 100%;
}

.e-1f72fcf8 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}
.e-6765daae
{
	display: block;
	width: 100%;
}

.e-6765daae > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}
.e-4dd3edd8
{
	display: block;
	width: 100%;
}

.e-4dd3edd8 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.e-4dd3edd8 .row
{
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 32px;
}

.e-4dd3edd8 .row-day
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 110px;
	flex-shrink: 0;
}

.e-4dd3edd8 .row-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-1);
}

.e-4dd3edd8 .row-times
{
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 1;
	min-width: 0;
}

.e-4dd3edd8 .row-times > .e-20dcefe9
{
	display: block;
	flex: 1;
	min-width: 0;
}

.e-4dd3edd8 .row-sep
{
	color: var(--ot-text-3);
	font-size: 11px;
	flex-shrink: 0;
}

.e-4dd3edd8 .row-closed
{
	flex: 1;
	font-size: 11px;
	color: var(--ot-text-3);
	font-style: italic;
}
.e-79eb231c
{
	display: block;
	width: 100%;
}

.e-79eb231c > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}
.e-6d726f2f
{
	display: block;
	width: 100%;
}

.e-6d726f2f > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}
.e-1a4bbdae
{
	display: block;
	width: 100%;
}

.e-1a4bbdae > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.e-1a4bbdae .hint
{
	margin: 0;
	padding: 0 4px;
	font-size: 11px;
	line-height: 1.5;
	color: var(--ot-text-3);
}
.e-577b752
{
	display: block;
	width: 100%;
}

.e-577b752 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.e-577b752 .hint
{
	margin: 0;
	padding: 0 4px;
	font-size: 11px;
	line-height: 1.5;
	color: var(--ot-text-3);
}
.e-106bd62f
{
	display: block;
	width: 100%;
}

.e-106bd62f > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.e-106bd62f > .holder > .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-106bd62f > .holder > .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}
.e-41155719
{
	display: block;
	width: 100%;
}

.e-41155719 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.e-41155719 > .holder > .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-41155719 > .holder > .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}

.e-41155719 > .holder > .field.row
{
	flex-direction: row;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 4px;
}

.e-41155719 > .holder > .field.row > .row-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-41155719 > .holder > .field.row > .row-text > .row-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-1);
}

.e-41155719 > .holder > .field.row > .row-text > .row-hint
{
	font-size: 11px;
	line-height: 1.4;
	color: var(--ot-text-3);
}
.e-7f5ffdb8
{
	display: block;
	width: 100%;
}

.e-7f5ffdb8 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.e-7f5ffdb8 > .holder > .zone
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-7f5ffdb8 > .holder > .zone > .zone-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}
.e-37b4f16d
{
	display: block;
	width: 100%;
}

.e-37b4f16d > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.e-37b4f16d > .holder > .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-37b4f16d > .holder > .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}

.e-37b4f16d > .holder > .field.row
{
	flex-direction: row;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 4px;
}

.e-37b4f16d > .holder > .field.row > .row-text
{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.e-37b4f16d > .holder > .field.row > .row-text > .row-label
{
	font-size: 12px;
	font-weight: 500;
	color: var(--ot-text-1);
}

.e-37b4f16d > .holder > .field.row > .row-text > .row-hint
{
	font-size: 11px;
	line-height: 1.4;
	color: var(--ot-text-3);
}
.e-1e2eed81
{
	display: block;
	width: 100%;
}

.e-1e2eed81 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
}

.e-1e2eed81 > .holder > .group
{
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--ot-bg-2-border);
}

.e-1e2eed81 > .holder > .group:last-child
{
	border-bottom: none;
	padding-bottom: 0;
}

.e-1e2eed81 > .holder > .group > .group-label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
	margin-bottom: 2px;
}

.e-1e2eed81 > .holder > .group > .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-1e2eed81 > .holder > .group > .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}
.e-145ba5c7
{
	display: block;
	width: 100%;
}

.e-145ba5c7 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.e-145ba5c7 > .holder > .field
{
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.e-145ba5c7 > .holder > .field > .label
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
	padding: 0 4px;
}
.e-42f66fcd
{
	display: block;
	width: 100%;
}

.e-42f66fcd > .holder
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.e-42f66fcd > .holder > .e-64e877b
{
	display: block;
	flex-shrink: 0;
}

.e-42f66fcd > .holder > .e-64e877b:last-child
{
	flex: 1;
	min-width: 0;
}
.e-1e9f1391
{
	display: block;
	width: 100%;
}

.e-1e9f1391 > .holder
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	width: 100%;
}

.e-1e9f1391 .chip
{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px 5px 8px;
	background: var(--ot-bg-2);
	border: 1px solid var(--ot-bg-2-border);
	border-radius: 100px;
	font-size: 11px;
	font-weight: 500;
	color: var(--ot-text-2);
	text-decoration: none;
	transition: background var(--ot-transition), border-color var(--ot-transition), color var(--ot-transition);
}

.e-1e9f1391 .chip:hover
{
	background: var(--ot-bg-3);
	border-color: var(--ot-bg-3-border);
	color: var(--ot-text-1);
}

.e-1e9f1391 .chip > i
{
	font-size: 13px;
	color: var(--ot-text-3);
	transition: color var(--ot-transition);
}

.e-1e9f1391 .chip:hover > i
{
	color: var(--ot-brand);
}
.e-1e92cc56
{
	display: block;
	width: 100%;
}

.e-1e92cc56 > .holder
{
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
}

/* ===== GROUP ===== */

.e-1e92cc56 .group
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.e-1e92cc56 .group > .group-label
{
	padding: 0 12px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-1e92cc56 .group > .group-items
{
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* ===== ITEM ===== */

.e-1e92cc56 .item
{
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 10px 12px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--ot-radius-m);
	color: inherit;
	font: inherit;
	cursor: pointer;
	text-align: left;
	transition: background var(--ot-transition), border-color var(--ot-transition);
}

.e-1e92cc56 .item:hover
{
	background: var(--ot-bg-2);
	border-color: var(--ot-bg-2-border);
}

.e-1e92cc56 .item:hover > .chevron
{
	color: var(--ot-text-1);
	transform: translateX(2px);
}

.e-1e92cc56 .item:hover > .icon
{
	background: var(--ot-brand-opacity);
	color: var(--ot-brand);
}

/* Icon */

.e-1e92cc56 .item > .icon
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: var(--ot-bg-2);
	border-radius: var(--ot-radius-s);
	color: var(--ot-text-2);
	flex-shrink: 0;
	transition: background var(--ot-transition), color var(--ot-transition);
}

.e-1e92cc56 .item > .icon > i
{
	font-size: 18px;
}

/* Text */

.e-1e92cc56 .item > .text
{
	display: flex;
	flex-direction: column;
	gap: 1px;
	flex: 1;
	min-width: 0;
}

.e-1e92cc56 .item > .text > .label
{
	font-size: var(--ot-size-m);
	font-weight: 500;
	color: var(--ot-text-1);
	line-height: 1.3;
}

.e-1e92cc56 .item > .text > .description
{
	font-size: var(--ot-size-s);
	color: var(--ot-text-3);
	line-height: 1.3;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Chevron */

.e-1e92cc56 .item > .chevron
{
	font-size: 18px;
	color: var(--ot-text-3);
	flex-shrink: 0;
	transition: color var(--ot-transition), transform var(--ot-transition);
}
.e-1e6a7386
{
	display: block;
	width: 100%;
}

.e-1e6a7386 > .holder
{
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.e-1e6a7386 > .holder > .e-15ce864f
{
	display: block;
	flex: 1;
	min-width: 0;
}

.e-1e6a7386 > .holder > .e-64e877b
{
	display: block;
	flex-shrink: 0;
}
.e-221d2c0
{
	display: block;
	width: 100%;
}

.e-221d2c0 > .holder
{
	display: flex;
	flex-direction: column;
	width: 100%;
	min-width: 70vw;
	max-width: 900px;
	max-height: 90vh;
	background: var(--ot-bg-1);
	border: 1px solid var(--ot-bg-1-border);
	border-radius: var(--ot-radius-l);
	overflow: hidden;
}

.e-221d2c0 > .holder > .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-221d2c0 > .holder > .head > .head-icon
{
	flex-shrink: 0;
	font-size: 22px;
	color: var(--ot-brand);
}

.e-221d2c0 > .holder > .head > .head-text
{
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.e-221d2c0 > .holder > .head > .head-text > .head-eyebrow
{
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ot-text-3);
}

.e-221d2c0 > .holder > .head > .head-text > .head-title
{
	font-family: var(--ot-font-secondary);
	font-size: 18px;
	font-weight: 500;
	color: var(--ot-text-1);
}

.e-221d2c0 > .holder > .body
{
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	padding: var(--ot-spacing-m);
}

.e-221d2c0 > .holder > .empty
{
	display: flex;
	align-items: center;
	gap: var(--ot-spacing-s);
	padding: var(--ot-spacing-l);
	background: var(--ot-bg-2);
	margin: var(--ot-spacing-m);
	border-radius: var(--ot-radius-m);
	font-size: 13px;
	color: var(--ot-text-3);
}

.e-221d2c0 > .holder > .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;
}
.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
{
	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);
}

/* ===== 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;
}

/* ===== 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); }

/* ===== 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;
}

/* ========================================== */
/* ===== 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;
	}
}
.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);
}

/* ========================================== */
/* ===== 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;
	}
}

@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;
}

/* 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;
}

/* ===== 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 .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 .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
	{
		grid-template-columns: repeat(2, 1fr);
	}

	.e-1ae67f37 .grid-wide
	{
		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
	{
		grid-template-columns: 1fr;
	}

	.e-1ae67f37 .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-name
{
	display: -webkit-box;
	flex: 1 1 auto;
	min-width: 0;
	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;
}

.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 .card-plate > .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;
}

/* ===== 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;
	}
}

/* ===== 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;
}

/* ===== 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); }
}

@media (max-width: 480px)
{
	.e-6059da07 .grid { grid-template-columns: 1fr; }
}
/* ===== 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 ===== */
.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: 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%;
}

/* ===== 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;
}

/* ===== 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;
}

/* ===== 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;
	}
}

/* ===== 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;
	}
}

/* ===== 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-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;
}

/* ===== GRID (4 columns x 3 rows, equal gap) ===== */

.e-19367697 .grid
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

/* ===== CARD ===== */

.e-19367697 .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-19367697 .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-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;
}

/* ===== 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;
}

/* ===== 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; }
}

/* ===== 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: 34px;
	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);
}

.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-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-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;
}

/* ===== 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 > .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 > .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;
}

/* ===== 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;
}

.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;
}

.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
	{
		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;
}

/* ===== 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;
}

/* ===== 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 — 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);
}

/* ===== 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);
}

/* ===== 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);
}

/* ===== 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;
}

/* ===== 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); }
}

/* ===== 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: #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: #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: #1c1a12;
	border-radius: 100px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.01em;
	color: #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: rgba(28, 26, 18, 0.82);
}

.e-c90516b .card-price
{
	font-size: 25px;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
	color: #1c1a12;
}

.e-c90516b .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-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: #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: #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: rgba(28, 26, 18, 0.85);
}

.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: #1c1a12;
}

.e-c90516b .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-c90516b .card:hover .card-link
{
	border-bottom-color: #1c1a12;
}

/* ===== 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; }
}

/* ===== 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) ===== */

.e-c90516d .card
{
	position: relative;
	flex: 0 0 auto;
	width: 792px;
	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 { 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 { 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 { 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);
}

/* ===== 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); }
}

/* ===== 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); }
}

/* ===== 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); }
}

/* ===== 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); }
}

/* ===== 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;
}

/* ===== 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);
}

/* ===== 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);
}

.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);
}

/* ===== 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; }
}

/* ===== 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); }
}

/* ===== 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); }
}

/* ===== 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);
}

/* ===== 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;
}

.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-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-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: 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;
}

/* ===== 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
{
	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);
}

/* ===== 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);
}

/* ===== 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);
}

/* ===== 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 .card > .card-body
	{
		margin-top: -28px;
	}
}

/* ===== 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;
}

/* ===== 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);
}

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

@media (max-width: 1024px)
{
	.e-138f30fc .grid
	{
		grid-template-columns: repeat(2, 1fr);
	}
}

@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;
	}
}

/* ===== 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;
}

/* ===== 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);
}

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

@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%;
	}
}

/* ===== 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);
}

/* ===== 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;
	}
}

/* ===== 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);
}

.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%);
	}
}

/* ===== 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;
}

.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;
}

/* ===== 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;
	}
}

/* ===== 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;
	}
}

/* ===== 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%;
	background: #f6f2ec;
	border-radius: var(--ot-radius-l);
}

.e-5e42fbb5 > .holder
{
	width: 100%;
	padding: 32px;
	box-sizing: border-box;
}

/* ===== 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;
	text-decoration: none;
	color: inherit;
}

/* ===== 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;
}

/* ===== CARD (klikabilan link, full-cover slika, portret, zaobljeni uglovi) ===== */

.e-63612f23 > .holder > .grid > .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 > .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-63612f23 > .holder > .grid > .card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.e-63612f23 > .holder > .grid > .card:hover::before
{
	transform: scale(1.07);
}

/* ===== OVERLAY (blag tamni preliv samo pri dnu, radi čitljivosti) ===== */

.e-63612f23 > .holder > .grid > .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 > .holder > .grid > .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 > .holder > .grid > .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 > .holder > .grid > .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 > .holder > .grid > .card:hover > .action
{
	transform: scale(1.10);
}

.e-63612f23 > .holder > .grid > .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 > .title { font-size: 30px; }
}

@media (max-width: 640px)
{
	.e-63612f23 > .holder > .grid
	{
		grid-template-columns: 1fr;
	}

	.e-63612f23 > .holder > .grid > .card
	{
		aspect-ratio: 3 / 4;
	}

	.e-63612f23 > .holder > .title { font-size: 26px; }
	.e-63612f23 > .holder > .grid > .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;
	color: inherit;
	text-decoration: none;
	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; }
.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;
}

@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;
	}
}
.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);
}

.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%;
	color: inherit;
	text-decoration: none;
}

.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;
	}
}

@media (max-width: 640px)
{
	.e-13f11794 .listing-grid.is-grid
	{
		grid-template-columns: 1fr;
	}

	.e-13f11794 > .holder > .listing-layout
	{
		padding: 24px 0 64px;
	}
}
.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);
}