/* ==========================================================================
   KEYTOUCH Agency — main stylesheet
   Editorial fashion layout: centered serif section titles, horizontal
   scrolling feeds, full-screen modal, sticky minimal header.
   ========================================================================== */

:root {
	--kt-bg: #ffffff;
	--kt-fg: #111111;
	--kt-muted: #6b6b6b;
	--kt-line: #e5e5e5;
	--kt-accent: #111111;
	--kt-maxw: 1320px;
	--kt-gap: 20px;
	--kt-serif: "Times New Roman", Times, Georgia, serif;
	--kt-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--kt-card-w: 230px;
	--kt-header-h: 68px;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--kt-bg);
	color: var(--kt-fg);
	font-family: var(--kt-sans);
	font-size: 15px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0);
	white-space: nowrap; border: 0;
}
.kt-skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 1000;
	background: #fff; padding: 10px 16px;
}
.kt-skip-link:focus { left: 10px; }

.kt-container {
	max-width: var(--kt-maxw);
	margin: 0 auto;
	padding: 0 24px;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
/* Flat transparent header to integrate seamlessly into the body background */
.kt-header {
	position: relative;
	z-index: 20;
	background: transparent !important;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	margin: 24px auto;
	width: calc(100% - 48px);
	max-width: calc(var(--kt-maxw) - 48px);
	transition: all 0.3s ease;
}
/* Raise z-index when dropdowns, navigation, or search are active */
.kt-header.is-nav-open,
.kt-header:has(.kt-city-switcher__toggle[aria-expanded="true"]),
.kt-header:has(.kt-header__searchbar:not([hidden])) {
	z-index: 110;
}
.kt-header__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	max-width: var(--kt-maxw);
	margin: 0 auto;
	padding: 14px 24px;
}
.kt-header__nav--left { justify-self: start; }
.kt-header__nav--right { justify-self: end; display: flex; align-items: center; gap: 16px; }
.kt-header__brand { justify-self: center; }

.kt-logo {
	font-family: var(--kt-serif);
	font-size: 22px;
	letter-spacing: .28em;
	text-transform: uppercase;
	font-weight: 400;
	padding-left: .28em;
}
.custom-logo-link img { max-height: 40px; width: auto; }
.kt-logo__menu-img {
	display: none;
	max-height: 40px;
	width: auto;
}
.kt-logo__default-img {
	max-height: 40px;
	width: auto;
}
.kt-header.is-nav-open .kt-logo__text,
.kt-header.is-nav-open .kt-logo__default-img {
	display: none !important;
}
.kt-header.is-nav-open .kt-logo__menu-img {
	display: inline-block !important;
}
body:has(.kt-header.is-nav-open) {
	overflow: hidden;
}
/* Navigation Menu & Mobile Tabbar */
.kt-menu {
	position: fixed;
	inset: 0;
	z-index: 99;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 40px;
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(0px);
	-webkit-backdrop-filter: blur(0px);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), backdrop-filter 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.kt-menu li {
	list-style: none;
	text-align: center;
	opacity: 0;
	transform: translateY(20px);
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.kt-header.is-nav-open .kt-menu li {
	opacity: 1;
	transform: translateY(0);
}
.kt-header.is-nav-open .kt-menu li:nth-child(1) { transition-delay: 0.1s; }
.kt-header.is-nav-open .kt-menu li:nth-child(2) { transition-delay: 0.15s; }
.kt-header.is-nav-open .kt-menu li:nth-child(3) { transition-delay: 0.2s; }
.kt-header.is-nav-open .kt-menu li:nth-child(4) { transition-delay: 0.25s; }
.kt-header.is-nav-open .kt-menu li:nth-child(5) { transition-delay: 0.3s; }
.kt-header.is-nav-open .kt-menu li:nth-child(6) { transition-delay: 0.35s; }

.kt-menu a {
	font-family: var(--kt-serif);
	font-size: clamp(24px, 4.5vw, 40px);
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--kt-fg, #000);
	text-decoration: none;
	transition: color 0.3s ease, transform 0.3s ease;
	display: inline-block;
}
.kt-menu a:hover {
	color: var(--kt-muted, #777);
	transform: scale(1.03);
	opacity: 1;
}
.kt-header.is-nav-open .kt-menu {
	opacity: 1;
	pointer-events: auto;
	backdrop-filter: blur(25px);
	-webkit-backdrop-filter: blur(25px);
}

/* Desktop: Inline Header Menu (no overlay needed) */
@media (min-width: 901px) {
	.kt-menu {
		position: static;
		opacity: 1;
		pointer-events: auto;
		display: flex !important;
		flex-direction: row;
		align-items: center;
		gap: 32px;
		background: none;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		padding: 0;
	}
	.kt-menu li {
		opacity: 1;
		transform: none;
	}
	.kt-menu a {
		font-family: var(--kt-sans);
		font-size: 11px;
		font-weight: 500;
		letter-spacing: .16em;
		text-transform: uppercase;
		color: var(--kt-fg, #000);
		transition: color 0.3s ease;
	}
	.kt-menu a:hover {
		color: var(--kt-muted);
		transform: none;
	}
	.kt-header__burger {
		display: none !important;
	}
}

/* Mobile Bottom Tab Bar Styles */
.kt-bottom-nav {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 105; /* Always visible on top of content (z-index: 40) but below modals (z-index: 200) */
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 24px 24px 0 0; /* Rounded top corners */
	box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.06); /* Upward shadow to create depth/indent separation */
	padding: 8px 16px clamp(8px, 3vh, 24px);
	display: none;
}
.kt-bottom-nav__inner {
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-width: 600px;
	margin: 0 auto;
}
.kt-bottom-nav__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	text-decoration: none;
	color: #777777;
	transition: color 0.25s ease, transform 0.2s ease;
	flex: 1;
	min-width: 0;
}
.kt-bottom-nav__item:active {
	transform: scale(0.93);
}
.kt-bottom-nav__icon {
	width: 22px;
	height: 22px;
	transition: stroke-width 0.2s ease;
}
.kt-bottom-nav__label {
	font-family: var(--kt-sans);
	font-size: 9px;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 100%;
	text-align: center;
}
.kt-bottom-nav__item.is-active {
	color: #111111;
}
.kt-bottom-nav__item.is-active .kt-bottom-nav__icon {
	stroke-width: 2.25px;
}

@media (max-width: 900px) {
	.kt-bottom-nav {
		display: block;
	}
	.kt-header__burger {
		display: none !important;
	}
	.kt-menu {
		display: none !important;
	}
	body {
		padding-bottom: 72px;
	}
}

.kt-header__search,
.kt-header__burger {
	background: none; border: 0; cursor: pointer; color: inherit;
	display: inline-flex; align-items: center; justify-content: center;
	padding: 6px;
}
.kt-header__burger {
	display: inline-flex;
	flex-direction: column;
	gap: 4px;
	width: 34px;
	height: 34px;
	position: relative;
	z-index: 101;
}
.kt-header__burger span:not(.screen-reader-text) {
	display: block;
	width: 20px;
	height: 1.5px;
	background: currentColor;
	transition: transform 0.3s ease, opacity 0.3s ease;
	transform-origin: center;
}
.kt-header.is-nav-open .kt-header__burger span:nth-child(1) {
	transform: translateY(5.5px) rotate(45deg);
}
.kt-header.is-nav-open .kt-header__burger span:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}
.kt-header.is-nav-open .kt-header__burger span:nth-child(3) {
	transform: translateY(-5.5px) rotate(-45deg);
}

.kt-header__searchbar {
	border-top: 1px solid var(--kt-line);
	padding: 14px 24px;
}
.kt-searchform { display: flex; gap: 8px; max-width: var(--kt-maxw); margin: 0 auto; }
.kt-searchform__input {
	flex: 1; padding: 10px 12px; border: 1px solid var(--kt-line); font-size: 14px;
}
.kt-searchform__submit {
	padding: 10px 18px; border: 1px solid var(--kt-fg); background: var(--kt-fg); color: #fff;
	text-transform: uppercase; font-size: 11px; letter-spacing: .1em; cursor: pointer;
}

/* City switcher */
.kt-city-switcher { position: relative; }
.kt-city-switcher__toggle {
	background: none; border: 0; cursor: pointer; color: inherit;
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
}
.kt-city-switcher__panel {
	position: absolute; right: 0; top: calc(100% + 10px);
	background: #fff; border: 1px solid var(--kt-line);
	width: 280px; z-index: 120; padding: 0;
	border-radius: 12px; overflow: hidden;
	box-shadow: 0 10px 40px rgba(0,0,0,.08);
}
.kt-city-switcher__search-wrap {
	padding: 10px 12px;
	border-bottom: 1px solid var(--kt-line);
	background: #fafafa;
}
.kt-city-switcher__search {
	width: 100%; border: 1px solid var(--kt-line); border-radius: 6px;
	padding: 6px 10px; font-size: 13px; outline: none; background: #fff;
	color: #000; font-family: inherit; transition: border-color 0.2s;
}
.kt-city-switcher__search:focus {
	border-color: #000;
}
.kt-city-switcher__scroll {
	max-height: 260px; overflow-y: auto; padding: 6px 0;
}
.kt-city-switcher__scroll::-webkit-scrollbar {
	width: 4px;
}
.kt-city-switcher__scroll::-webkit-scrollbar-track {
	background: transparent;
}
.kt-city-switcher__scroll::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.1);
	border-radius: 2px;
}
.kt-city-switcher__group {
	margin-bottom: 8px;
}
.kt-city-switcher__group:last-child {
	margin-bottom: 0;
}
.kt-city-switcher__group-title {
	font-size: 9px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .08em; color: var(--kt-muted);
	padding: 6px 16px 2px;
}
.kt-city-switcher__list {
	list-style: none; margin: 0; padding: 0;
}
.kt-city-switcher__item {
	display: block; padding: 6px 16px; font-size: 13px; color: #333;
	text-decoration: none; transition: background 0.15s, color 0.15s;
}
.kt-city-switcher__item:hover {
	background: #f5f5f5; color: #000;
}
.kt-city-switcher__item.is-active {
	font-weight: 600; color: #000; background: #fafafa;
}
.kt-city-switcher__no-results {
	padding: 20px 16px; font-size: 13px; color: var(--kt-muted);
	text-align: center; font-style: italic;
}

/* --------------------------------------------------------------------------
   Hero Slider (Featured Stories Carousel)
   -------------------------------------------------------------------------- */
.kt-hero-slider {
	position: relative;
	z-index: 15;
	padding: 24px 0;
	margin-bottom: 40px;
	background: transparent;
	border-bottom: 0;
	width: 100%;
}
.kt-hero-slider__track {
	display: flex;
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding: 0 40px 10px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* Hide scrollbar Firefox */
	justify-content: flex-start;
}
.kt-hero-slider__track::-webkit-scrollbar {
	display: none; /* Hide scrollbar Chrome/Safari */
}
.kt-hero-slide {
	flex: 0 0 auto;
	width: 320px;
	scroll-snap-align: start;
}
.kt-hero-slide__link {
	display: block;
	position: relative;
	width: 100%;
}
.kt-hero-slide__image-wrap {
	width: 100%;
	aspect-ratio: 3/4; /* Vertical stories format */
	border-radius: 32px;
	overflow: hidden;
	background: transparent;
	position: relative;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
.kt-hero-slide__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.kt-hero-slide__link:hover .kt-hero-slide__img {
	transform: scale(1.04);
}
.kt-hero-slide__placeholder {
	width: 100%;
	height: 100%;
	background: transparent;
}
/* Overlay for readability */
.kt-hero-slide__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.55) 0%,
		rgba(0, 0, 0, 0.15) 35%,
		rgba(0, 0, 0, 0.1) 60%,
		rgba(0, 0, 0, 0.5) 100%
	);
	pointer-events: none;
}
.kt-hero-slide__overlay-content {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 24px;
	color: #ffffff;
	pointer-events: none;
}
.kt-hero-slide__title {
	font-family: var(--kt-sans);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	margin: 0;
	color: #ffffff;
	letter-spacing: -0.01em;
	text-shadow: 0 1px 3px rgba(0,0,0,0.3);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.kt-hero-slide__subtitle {
	font-family: var(--kt-sans);
	font-size: 12px;
	font-weight: 500;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* Responsive slider adjustments */
@media (max-width: 900px) {
	.kt-hero-slider {
		padding: 16px 0;
		width: 100%;
		margin: 16px 0 32px;
	}
	.kt-hero-slider__track {
		gap: 12px;
		padding: 0 24px 10px;
	}
	.kt-hero-slide {
		width: 85vw;
		max-width: 360px;
	}
	.kt-hero-slide__image-wrap {
		border-radius: 24px;
	}
	.kt-hero-slide__overlay-content {
		padding: 16px;
	}
	.kt-hero-slide__title {
		font-size: 15px;
		line-height: 1.25;
	}
	.kt-hero-slide__subtitle {
		font-size: 10px;
	}
}

/* --------------------------------------------------------------------------
   Feeds
   -------------------------------------------------------------------------- */
.kt-feeds { padding: 8px 0 40px; }
.kt-feed { padding: 38px 0 8px; border-bottom: 1px solid var(--kt-line); }
.kt-feed:last-child { border-bottom: 0; }
.kt-feed__head {
	position: relative; text-align: center; margin-bottom: 22px; padding: 0 24px;
}
.kt-feed__title {
	font-family: var(--kt-serif); font-weight: 400;
	font-size: clamp(18px, 2.4vw, 26px);
	letter-spacing: .04em; margin: 0;
}
.kt-feed__all {
	position: absolute; right: 24px; top: 50%; transform: translateY(-50%);
	font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--kt-muted);
}
.kt-feed__all:hover { color: var(--kt-fg); }

.kt-feed__track {
	display: flex; gap: var(--kt-gap);
	overflow-x: auto; scroll-snap-type: x mandatory;
	padding: 0 24px 18px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}
.kt-feed__track::-webkit-scrollbar { height: 6px; }
.kt-feed__track::-webkit-scrollbar-thumb { background: var(--kt-line); border-radius: 3px; }

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
.kt-card { flex: 0 0 auto; width: var(--kt-card-w); scroll-snap-align: start; }
.kt-card--wide { width: calc(var(--kt-card-w) * 1.55); }
.kt-card__link { display: block; }
.kt-card__media {
	display: block; position: relative; overflow: hidden; background: #f0f0f0;
}
.kt-card--tall .kt-card__img,
.kt-card--tall .kt-card__placeholder { aspect-ratio: 3/4; }
.kt-card--wide .kt-card__img,
.kt-card--wide .kt-card__placeholder { aspect-ratio: 16/10; }
.kt-card__img { width: 100%; object-fit: cover; transition: transform .5s ease; }
.kt-card__placeholder { display: block; width: 100%; background: linear-gradient(135deg,#eee,#ddd); }
.kt-card__link:hover .kt-card__img { transform: scale(1.04); }
.kt-card__play {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}
.kt-card__body { display: block; padding: 12px 2px 4px; }
.kt-card__title { display: block; font-family: var(--kt-serif); font-size: 16px; line-height: 1.25; }
.kt-card__subtitle {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	color: var(--kt-muted); font-size: 12px; margin-top: 4px;
}

/* --------------------------------------------------------------------------
   Listings / grids / pagination
   -------------------------------------------------------------------------- */
.kt-listing { padding: 40px 24px 60px; }
.kt-listing__head { text-align: center; margin-bottom: 34px; }
.kt-listing__title { font-family: var(--kt-serif); font-weight: 400; font-size: clamp(24px,4vw,40px); margin: 0; }
.kt-listing__desc { color: var(--kt-muted); max-width: 640px; margin: 12px auto 0; }
.kt-grid {
	display: grid; gap: 28px var(--kt-gap);
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.kt-grid .kt-card { width: auto; }
.pagination, .navigation.pagination {
	display: flex; justify-content: center; margin-top: 48px;
}
.nav-links { display: flex; gap: 8px; align-items: center; }
.page-numbers {
	display: inline-flex; min-width: 38px; height: 38px; padding: 0 10px;
	align-items: center; justify-content: center;
	border: 1px solid var(--kt-line); font-size: 13px;
}
.page-numbers.current { background: var(--kt-fg); color: #fff; border-color: var(--kt-fg); }

/* --------------------------------------------------------------------------
   Single / page
   -------------------------------------------------------------------------- */
.kt-single, .kt-page { padding: 36px 24px 60px; max-width: 860px; }
.kt-single { max-width: 1100px; }
.kt-single__back, .kt-single .kt-feed { max-width: 100%; }
.kt-single__back, .kt-breadcrumbs { margin-bottom: 24px; font-size: 9px; text-transform: uppercase; letter-spacing: .15em; opacity: 0.45; transition: opacity 0.3s ease; }
.kt-single__back:hover, .kt-breadcrumbs:hover { opacity: 0.8; }
.kt-breadcrumbs a { color: inherit; }
.kt-breadcrumbs span { opacity: 0.7; }
.kt-single__related { margin-top: 50px; }

.kt-modal-article__type {
	font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--kt-muted); margin: 0 0 8px;
}
.kt-modal-article__title { font-family: var(--kt-serif); font-weight: 400; font-size: clamp(26px,4vw,42px); margin: 0 0 8px; }
.kt-modal-article__subtitle { color: var(--kt-muted); font-size: 16px; margin: 0 0 22px; }
.kt-modal-article__media img { width: 100%; max-height: 70vh; object-fit: cover; }
.kt-modal-article__video { position: relative; aspect-ratio: 16/9; margin-bottom: 24px; width: 100%; height: auto; max-height: 70vh; overflow: hidden; border-radius: 12px; }
.kt-modal-article__video video { object-fit: cover; }
.kt-modal-article__video-local {
	width: 100%;
	display: flex;
	justify-content: center;
	background: #000000;
	margin-bottom: 24px;
	overflow: hidden;
	position: relative;
}
.kt-modal-article__video-local video {
	height: 75vh;
	max-height: 75vh;
	width: 100%;
	max-width: 100%;
	object-fit: cover;
	display: block;
}
@media (max-width: 767px) {
	.kt-modal-article__video-local video {
		height: 65vh;
		max-height: 65vh;
	}
}
.kt-modal-article__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.kt-modal-article__content { font-size: 16px; line-height: 1.7; margin-top: 24px; }
.kt-modal-article__content p { margin: 0 0 1.1em; }
.kt-modal-article__credits {
	margin-top: 30px; padding-top: 18px; border-top: 1px solid var(--kt-line);
	font-size: 13px; color: var(--kt-muted);
}
.kt-modal-article__price {
	font-family: var(--kt-serif);
	font-size: 24px;
	color: var(--kt-fg);
	margin: 12px 0 20px;
}
.kt-page__title { font-family: var(--kt-serif); font-weight: 400; font-size: clamp(28px,5vw,46px); margin: 0 0 24px; }
.kt-page__media { margin: 0 0 28px; }
.kt-page__content { font-size: 16px; line-height: 1.7; }

/* --------------------------------------------------------------------------
   Modal overlay
   -------------------------------------------------------------------------- */
.kt-page-wrapper {
	background: #fafafa;
	min-height: 100vh;
	box-sizing: border-box;
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s cubic-bezier(0.16, 1, 0.3, 1), border-radius 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1);
	transform-origin: center top;
	/* will-change: transform removed — it creates a containing block, which
	   stops position: sticky working anywhere inside the page. */
}
body.kt-modal-open {
	overflow: hidden;
	background: #e8e8e8 !important;
}
body.kt-modal-open .kt-page-wrapper {
	transform: scale(0.95) translateY(12px);
	border-radius: 24px;
	overflow: hidden;
	filter: brightness(0.9);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
}
.kt-modal {
	position: fixed; inset: 0; z-index: 200;
	display: flex; align-items: flex-start; justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.5s;
}
.kt-modal.is-active {
	opacity: 1;
	visibility: visible;
}
.kt-modal__backdrop {
	position: absolute; inset: 0;
	background: rgba(0,0,0,.5);
	opacity: 0;
	transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.kt-modal.is-active .kt-modal__backdrop {
	opacity: 1;
}
.kt-modal__dialog {
	position: relative; z-index: 1;
	background: #fff; width: min(960px, 94vw);
	margin: 4vh auto; max-height: 92vh; overflow-y: auto;
	padding: 56px clamp(20px,5vw,64px);
	opacity: 0;
	transform: translateY(30px);
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.kt-modal.is-active .kt-modal__dialog {
	opacity: 1;
	transform: translateY(0);
}

@media (min-width: 768px) {
	/* Desktop: Right-aligned side panel (drawer) */
	.kt-modal.kt-modal--drawer {
		justify-content: flex-end;
		align-items: stretch;
	}
	.kt-modal.kt-modal--drawer .kt-modal__backdrop {
		background: rgba(0, 0, 0, 0.45);
	}
	.kt-modal.kt-modal--drawer .kt-modal__dialog {
		width: min(580px, 85vw); /* semi-open panel */
		height: calc(100vh - 40px);
		max-height: calc(100vh - 40px);
		margin: 20px 0 20px auto;
		border-radius: 40px 0 0 40px; /* rounded corners on the left side */
		box-shadow: -15px 0 45px rgba(0, 0, 0, 0.15);
		--kt-dialog-pad: clamp(20px, 5vw, 40px);
		--kt-dialog-pad-top: 56px;
		padding: var(--kt-dialog-pad-top) var(--kt-dialog-pad);
		transform: translateX(100%);
		opacity: 1;
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
		overflow-y: auto;
		overflow-x: hidden;
	}
	.kt-modal.kt-modal--drawer.is-active .kt-modal__dialog {
		/* `none`, not translate(0): a transform on the scrolling dialog makes it
		   a containing block for the sticky contact strip, and Safari flickers
		   the pair while scrolling. The slide-in still animates. */
		transform: none;
	}
}

@media (max-width: 767px) {
	/* Mobile: Bottom-sheet slide-up drawer (semi-open) */
	.kt-modal.kt-modal--drawer {
		align-items: flex-end;
	}
	.kt-modal.kt-modal--drawer .kt-modal__dialog {
		width: 100%;
		height: auto;
		max-height: 85vh;
		min-height: auto; /* reset min-height to prevent full-screen expansion on mobile */
		margin: 0;
		border-radius: 30px 30px 0 0; /* rounded corners at the top */
		box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.15);
		--kt-dialog-pad: 24px;
		--kt-dialog-pad-top: 48px;
		padding: var(--kt-dialog-pad-top) var(--kt-dialog-pad) 24px;
		transform: translateY(100%);
		opacity: 1;
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
		overflow-y: auto;
		overflow-x: hidden;
	}
	.kt-modal.kt-modal--drawer.is-active .kt-modal__dialog {
		/* `none`, not translate(0): a transform on the scrolling dialog makes it
		   a containing block for the sticky contact strip, and Safari flickers
		   the pair while scrolling. The slide-in still animates. */
		transform: none;
	}
	/* drag handle capsule at the top center of the sheet */
	.kt-modal.kt-modal--drawer .kt-modal__dialog::before {
		content: '';
		position: absolute;
		top: 14px;
		left: 50%;
		transform: translateX(-50%);
		width: 40px;
		height: 4px;
		border-radius: 2px;
		background: rgba(0, 0, 0, 0.15);
		z-index: 10;
	}

	/* Force zero-padding top/left/right for dialog when containing wide visual banners, making them full-bleed */
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial),
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) {
		/* The close button and the drag handle place themselves by subtracting
		   these from their offset, so the variables have to follow the padding
		   that is actually applied — otherwise both land off the panel here. */
		--kt-dialog-pad: 0px;
		--kt-dialog-pad-top: 0px;
		padding-left: 0 !important;
		padding-right: 0 !important;
		padding-top: 0 !important;
	}
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article {
		margin-top: 0 !important;
	}
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__video,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__video-local,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article__video,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__media,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article__media {
		margin-left: 0 !important;
		margin-right: 0 !important;
		margin-top: 0 !important;
	}
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__head,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__content,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal-article__credits,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article__head,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article__content,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal-article__cta {
		padding-left: clamp(20px, 5vw, 40px) !important;
		padding-right: clamp(20px, 5vw, 40px) !important;
	}
	/* Only the editorial/service drawers open on a full-bleed banner, so only
	   there does the cross need to invert. `difference` blending was applied to
	   every drawer, which turned the model card's cross into a hard black mark
	   on white; a plain white glyph with a soft dark halo reads better and
	   leaves the rest alone. */
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_editorial) .kt-modal__close,
	.kt-modal.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) .kt-modal__close {
		z-index: 20;
		color: #ffffff;
		text-shadow: 0 0 5px rgba(0, 0, 0, .45), 0 0 12px rgba(0, 0, 0, .3);
	}
}
.kt-modal__close, .kt-addcity__close {
	position: absolute; top: 14px; right: 18px;
	background: none; border: 0; font-size: 30px; line-height: 1; cursor: pointer; color: var(--kt-fg);
}
.kt-modal__loading { padding: 60px 0; text-align: center; color: var(--kt-muted); }

/* --------------------------------------------------------------------------
   Add city dialog
   -------------------------------------------------------------------------- */
.kt-addcity { position: fixed; inset: 0; z-index: 210; display: flex; align-items: center; justify-content: center; }
.kt-addcity[hidden] { display: none !important; }
.kt-addcity__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.kt-addcity__dialog {
	position: relative; z-index: 1; background: #fff;
	width: min(440px, 92vw); padding: 40px; border-radius: 2px;
}
.kt-addcity__dialog h2 { font-family: var(--kt-serif); font-weight: 400; font-size: 28px; margin: 0 0 6px; }
.kt-addcity__intro { color: var(--kt-muted); font-size: 14px; margin: 0 0 20px; }
.kt-addcity__form label { display: block; margin-bottom: 14px; font-size: 12px; letter-spacing: .04em; }
.kt-addcity__form label span { display: block; margin-bottom: 6px; text-transform: uppercase; color: var(--kt-muted); }
.kt-addcity__form input {
	width: 100%; padding: 11px 12px; border: 1px solid var(--kt-line); font-size: 14px;
}
.kt-addcity__submit {
	width: 100%; margin-top: 6px; padding: 13px;
	background: var(--kt-fg); color: #fff; border: 0; cursor: pointer;
	text-transform: uppercase; letter-spacing: .12em; font-size: 12px;
}
.kt-addcity__status { font-size: 13px; margin: 12px 0 0; min-height: 1em; }


/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.kt-footer { border-top: none; padding: 60px 0 50px; }
.kt-footer__inner { max-width: var(--kt-maxw); margin: 0 auto; padding: 0 24px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.kt-logo--footer { display: inline-block; margin-bottom: 24px; font-size: 28px; letter-spacing: 0.15em; }
.kt-footer__menu { list-style: none; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 0; margin: 0 0 20px; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.kt-separator { color: var(--kt-muted, #6b6b6b); font-size: 8px; }
.kt-footer__legal { margin-top: 0; font-size: 11px; color: var(--kt-muted); }

@media (max-width: 600px) {
	.kt-footer__menu { flex-direction: column; gap: 12px; }
	.kt-separator { display: none; }
}

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */
.kt-404 { text-align: center; padding: 90px 24px; max-width: 560px; }
.kt-404__title { font-family: var(--kt-serif); font-weight: 400; font-size: 40px; margin: 0 0 12px; }
.kt-404__text { color: var(--kt-muted); margin-bottom: 24px; }
.kt-404 .kt-searchform { max-width: 380px; margin: 0 auto 20px; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
	.kt-header {
		margin: 0 auto;
		width: calc(100% - 32px);
		border-radius: 0;
		top: 0;
	}
	.kt-header__inner {
		display: flex;
		justify-content: space-between;
		padding: 14px 0;
	}
	.kt-header__brand {
		order: 1;
		justify-self: start;
	}
	.kt-header__nav--right {
		order: 2;
		justify-self: end;
		margin-left: auto;
		margin-right: 12px;
	}
	.kt-header__nav--left {
		order: 3;
		justify-self: end;
	}
	.kt-site-content {
		border-radius: 24px;
		/* The clearance for the floating tab bar lives on the footer now —
		   keeping it here left a visible gap between the page card and the
		   footer, since the footer sits below this element. */
		margin: 12px 16px;
		width: calc(100% - 32px);
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
	}
}
@media (max-width: 600px) {
	:root { --kt-card-w: 180px; }
	.kt-modal__dialog { --kt-dialog-pad: 20px; margin: 0; width: 100vw; max-height: 100vh; min-height: 100vh; padding: 56px var(--kt-dialog-pad); }
	.kt-logo { font-size: 18px; letter-spacing: .2em; }
	.kt-site-content {
		border-radius: 24px;
		margin: 12px 16px;
		width: calc(100% - 32px);
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
	}
	.kt-header {
		width: calc(100% - 32px);
		margin: 0 auto;
	}
}


/* ==========================================================================
   KEYTOUCH Custom Page Styling (Info, Pier59, Application Forms)
   ========================================================================== */

/* Buttons */
.kt-btn {
	display: inline-block;
	background: #111111;
	color: #ffffff;
	padding: 14px 32px;
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	border: 1px solid #111111;
	border-radius: 40px;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.kt-btn:hover {
	background: transparent;
	color: #111111;
}

/* Info Page */
.kt-info-page {
	padding: 80px 24px;
	background: #fafafa;
}
.kt-info-page__inner {
	max-width: 900px;
	margin: 0 auto;
}
.kt-info-page__title {
	font-family: var(--kt-serif);
	font-size: clamp(24px, 4vw, 42px);
	line-height: 1.25;
	font-weight: 300;
	margin: 0 0 48px;
	letter-spacing: -0.02em;
}
.kt-info-page__offices {
	margin-bottom: 60px;
	border-top: 1px solid var(--kt-line);
}
.kt-office-details {
	border-bottom: 1px solid var(--kt-line);
}
.kt-office-details__summary {
	padding: 24px 0;
	font-family: var(--kt-sans);
	font-size: 18px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.kt-office-details__summary::-webkit-details-marker {
	display: none;
}
.kt-office-details__summary .kt-arrow {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--kt-fg);
	border-bottom: 2px solid var(--kt-fg);
	transform: rotate(45deg);
	transition: transform 0.3s ease;
}
.kt-office-details[open] .kt-office-details__summary .kt-arrow {
	transform: rotate(-135deg);
}
.kt-office-details__content {
	padding: 0 0 32px;
	animation: kt-modal-in 0.3s ease;
}
.kt-office-details__descr {
	font-size: 14px;
	color: var(--kt-muted);
	margin: 0 0 24px;
	max-width: 600px;
}
.kt-office-details__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 24px;
}
.kt-office-details__meta-item {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.kt-meta-label {
	font-family: var(--kt-sans);
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--kt-muted);
}
.kt-meta-value {
	font-size: 14px;
	line-height: 1.4;
}
.kt-meta-value a:hover {
	border-bottom: 1px solid var(--kt-fg);
}
.kt-info-page__intro {
	font-family: var(--kt-serif);
	font-size: clamp(20px, 3vw, 28px);
	line-height: 1.35;
	font-weight: 300;
	margin: 60px 0 48px;
	color: #222;
}
.kt-info-page__columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 40px;
	margin-bottom: 60px;
	font-size: 14px;
	line-height: 1.6;
	color: #444;
}
.kt-info-page__columns p {
	margin: 0 0 16px;
}
.kt-italic {
	font-style: italic;
	text-decoration: underline;
}
.kt-info-page__partners {
	display: flex;
	gap: 48px;
	align-items: center;
	border-top: 1px solid var(--kt-line);
	padding-top: 40px;
}
.kt-partner-logo {
	font-family: var(--kt-sans);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	opacity: 0.4;
	transition: opacity 0.3s ease;
}
.kt-partner-logo:hover {
	opacity: 0.8;
}

/* Pier59 Studio Page */
.kt-pier59-page {
	background: #000000;
	color: #ffffff;
}
.kt-pier59-hero {
	position: relative;
	width: 100%;
	height: 80vh;
	background: #111;
}
.kt-pier59-hero__video-wrap {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.kt-pier59-hero__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.kt-pier59-hero__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.3);
	display: flex;
	align-items: center;
	justify-content: center;
}
.kt-pier59-hero__logo {
	font-family: var(--kt-serif);
	font-size: clamp(32px, 6vw, 64px);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	font-weight: 300;
	color: #fff;
	text-shadow: 0 4px 20px rgba(0,0,0,0.4);
}
.kt-pier59-content {
	padding: 80px 24px;
}
.kt-pier59-content__inner {
	max-width: var(--kt-maxw);
	margin: 0 auto;
}
.kt-pier59-quote {
	font-family: var(--kt-serif);
	font-size: clamp(22px, 3.5vw, 38px);
	line-height: 1.3;
	font-weight: 300;
	margin: 0 0 60px;
	text-align: center;
	border: 0;
	padding: 0;
}
.kt-pier59-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 48px;
	font-size: 15px;
	line-height: 1.6;
	color: #ccc;
}
.kt-pier59-grid h2 {
	font-family: var(--kt-serif);
	font-size: 24px;
	font-weight: 400;
	margin: 0 0 16px;
	color: #fff;
}
.kt-pier59-grid .kt-highlight {
	font-size: 18px;
	color: #fff;
	margin-bottom: 20px;
}
.kt-pier59-page .kt-btn {
	background: #ffffff;
	color: #000000;
	border-color: #ffffff;
	margin-top: 24px;
}
.kt-pier59-page .kt-btn:hover {
	background: transparent;
	color: #ffffff;
}
.kt-pier59-gallery {
	padding: 0 24px 80px;
	max-width: var(--kt-maxw);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.kt-pier59-img {
	width: 100%;
	height: auto;
	border-radius: 8px;
	object-fit: cover;
}
.kt-pier59-gallery__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

/* Application forms */
.kt-apply-page {
	padding: 80px 24px;
	background: #f7f7f7;
	color: #111;
}
.kt-apply-page__inner {
	max-width: 780px;
	margin: 0 auto;
}
.kt-apply-tabs {
	display: flex;
	gap: 16px;
	margin-bottom: 40px;
	border-bottom: 1px solid var(--kt-line);
	padding-bottom: 16px;
}
.kt-apply-tabs__tab {
	font-family: var(--kt-sans);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 8px 16px;
	border-radius: 20px;
	background: #eee;
	color: var(--kt-muted);
	font-weight: 500;
}
.kt-apply-tabs__tab.is-active {
	background: #111;
	color: #fff;
}
.kt-apply-header {
	font-size: clamp(14px, 2vw, 17px);
	line-height: 1.5;
	color: #444;
	margin-bottom: 48px;
}
.kt-apply-header p {
	margin-bottom: 16px;
}
.kt-apply-success {
	text-align: center;
	padding: 60px 20px;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}
.kt-apply-success h2 {
	font-family: var(--kt-serif);
	font-size: 28px;
	margin-bottom: 12px;
}
.kt-apply-success p {
	color: var(--kt-muted);
	margin-bottom: 30px;
}
.kt-apply-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	margin-bottom: 48px;
}
@media (min-width: 768px) {
	.kt-apply-grid {
		grid-template-columns: 280px 1fr;
	}
}
.kt-apply-grid__info h2 {
	font-family: var(--kt-serif);
	font-size: 22px;
	font-weight: 400;
	margin: 0 0 16px;
}
.kt-requirements {
	font-size: 13px;
	color: var(--kt-muted);
	line-height: 1.5;
}
.kt-requirements h3 {
	font-size: 12px;
	text-transform: uppercase;
	color: #111;
	margin-bottom: 8px;
}
.kt-requirements p {
	margin: 0 0 6px;
}
.kt-apply-grid__fields {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.kt-form-row {
	display: flex;
	gap: 20px;
}
.kt-form-col {
	flex: 1;
}
.kt-apply-form input[type="text"],
.kt-apply-form input[type="email"],
.kt-apply-form input[type="url"],
.kt-apply-form select {
	width: 100%;
	padding: 14px 20px;
	border: 1px solid #ccc;
	border-radius: 30px;
	font-family: var(--kt-sans);
	font-size: 12px;
	background: #fff;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: border-color 0.3s ease;
}
.kt-apply-form input:focus,
.kt-apply-form select:focus {
	outline: none;
	border-color: #111;
}
.kt-form-required-note {
	font-size: 11px;
	color: var(--kt-muted);
	margin: 8px 0 0;
}
.kt-apply-photos {
	border-top: 1px solid var(--kt-line);
	padding-top: 40px;
	margin-bottom: 48px;
}
.kt-apply-photos__instructions {
	text-align: center;
	font-size: 12px;
	color: var(--kt-muted);
	line-height: 1.5;
	max-width: 600px;
	margin: 0 auto 32px;
}
.kt-apply-photos__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
@media (min-width: 600px) {
	.kt-apply-photos__grid {
		grid-template-columns: repeat(4, 1fr);
	}
}
.kt-photo-upload {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}
.kt-photo-upload__label {
	width: 100%;
	aspect-ratio: 0.74;
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	cursor: pointer;
	background: #ddd;
}
.kt-photo-upload__preview {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 0.5s ease;
}
.kt-photo-upload__label:hover .kt-photo-upload__preview {
	transform: scale(1.05);
}
.kt-photo-upload__btn {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.3);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--kt-sans);
	font-size: 10px;
	font-weight: 500;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.9;
}
.kt-photo-upload input[type="file"] {
	display: none;
}
.kt-photo-upload__title {
	font-family: var(--kt-sans);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0;
}
.kt-apply-submit {
	text-align: center;
}
.kt-form-file-row {
	display: flex;
	flex-direction: column;
}
.kt-file-upload {
	display: flex;
	flex-direction: column;
	border: 1px dashed #ccc;
	padding: 20px;
	border-radius: 12px;
	text-align: center;
	background: #fff;
	cursor: pointer;
}
.kt-file-upload__text {
	font-family: var(--kt-sans);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	color: #111;
}
.kt-file-upload__subtext {
	font-size: 10px;
	color: var(--kt-muted);
	margin-top: 4px;
}
.kt-file-upload input[type="file"] {
	display: none;
}

/* ==========================================================================
   KEYTOUCH Catalog Pages and Card Overlays
   ========================================================================== */

.kt-catalog {
	padding: 40px 24px 80px;
	max-width: var(--kt-maxw);
	margin: 0 auto;
}

.kt-catalog__cities {
	display: flex;
	justify-content: center;
	gap: 40px;
	padding: 20px 0;
}

.kt-catalog-city-link {
	font-family: var(--kt-sans);
	font-size: 20px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #999999;
	transition: color 0.3s ease;
}

.kt-catalog-city-link:hover,
.kt-catalog-city-link.is-active {
	color: #111111;
}

.kt-catalog-city-link.is-active {
	font-weight: 700;
}

.kt-catalog__line {
	height: 1.5px;
	background: #111111;
	width: 100%;
	margin-bottom: 24px;
}

.kt-catalog__nav-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 40px;
}

.kt-catalog__boards {
	display: flex;
	gap: 24px;
}

.kt-catalog-board-link {
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #999999;
	transition: color 0.3s ease;
}

.kt-catalog-board-link:hover,
.kt-catalog-board-link.is-active {
	color: #111111;
}

.kt-catalog-board-link.is-active {
	font-weight: 700;
}

.kt-catalog__label {
	font-family: var(--kt-sans);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--kt-muted);
}

.kt-catalog__empty {
	text-align: center;
	padding: 80px 0;
	color: var(--kt-muted);
	font-size: 14px;
}

/* Model Cards specific styling */
.kt-listing .kt-grid {
	grid-template-columns: repeat(4, 1fr);
	gap: 24px 20px;
}

.kt-card--model .kt-card__media {
	border-radius: 24px;
	overflow: hidden;
	position: relative;
	background: #f4f4f4;
}

.kt-card--model .kt-card__img {
	border-radius: 24px;
}

/* The parameters overlay (and its blur/dim) was removed with the preview
   redesign — the image now stays untouched on hover and on touch. */

/* Card slider layout inside model preview card */
.kt-card-slider {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.kt-card-slider__track {
	display: flex;
	width: 100%;
	height: 100%;
	overflow-x: auto;
	/* Without this the y axis computes to `auto` too, so a vertical swipe
	   scrolled the image inside the card instead of scrolling the page. */
	overflow-y: hidden;
	touch-action: pan-x pan-y;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.kt-card-slider__track::-webkit-scrollbar {
	display: none;
}
.kt-card-slider__slide {
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	scroll-snap-align: start;
	position: relative;
}
.kt-card-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s ease, background 0.15s ease, color 0.15s ease;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.kt-card-slider__arrow svg {
	width: 16px;
	height: 16px;
	stroke-width: 2.5;
}
.kt-card-slider__arrow--prev {
	left: 12px;
}
.kt-card-slider__arrow--next {
	right: 12px;
}
.kt-card-slider__arrow:hover {
	background: #ffffff;
	color: #333;
}
/* Show arrows on hover (pointer) or while swiping (touch). */
@media (hover: hover) {
	.kt-card--model:hover .kt-card-slider__arrow {
		opacity: 1;
		pointer-events: auto;
	}
}
.kt-card--model.is-swiping .kt-card-slider__arrow {
	opacity: 1;
	pointer-events: auto;
}
/* ...but never the arrow that has nowhere to go, and none at all when a card
   holds a single photo. Mirrors the model gallery behaviour. */
.kt-card-slider.is-at-start .kt-card-slider__arrow--prev,
.kt-card-slider.is-at-end .kt-card-slider__arrow--next,
.kt-card-slider.is-static .kt-card-slider__arrow,
.kt-card-slider.is-static .kt-card-slider__indicator {
	opacity: 0 !important;
	visibility: hidden;
	pointer-events: none !important;
}
.kt-card-slider__indicator {
	position: absolute;
	bottom: 12px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
	display: flex;
	gap: 6px;
	padding: 4px 8px;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.3);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
}
.kt-card--model:hover .kt-card-slider__indicator,
.kt-card--model.is-swiping .kt-card-slider__indicator {
	opacity: 1;
}
.kt-card-slider__indicator-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	transition: background 0.25s ease, transform 0.25s ease;
}
.kt-card-slider__indicator-dot.is-active {
	background: #ffffff;
	transform: scale(1.2);
}

.kt-card__parameters {
	display: flex;
	flex-direction: column;
	gap: 8px;
	color: #ffffff;
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	text-align: center;
}

.kt-card--model .kt-card__title {
	font-family: var(--kt-serif);
	font-size: 22px;
	font-weight: 400;
	color: #111;
	margin-top: 10px;
	margin-bottom: 4px;
}

.kt-card__excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-family: var(--kt-sans);
	font-size: 13px;
	line-height: 1.5;
	color: var(--kt-muted);
	font-weight: 300;
}

/* Mobile catalog overrides */
@media (max-width: 900px) {
	.kt-catalog {
		padding: 24px 24px 60px;
	}
	.kt-catalog__cities {
		gap: 20px;
		padding: 12px 0;
	}
	.kt-catalog-city-link {
		font-size: 16px;
	}
	.kt-catalog__line {
		margin: 0 0 24px;
		width: 100%;
	}
	.kt-catalog__nav-row {
		flex-direction: column;
		align-items: center;
		gap: 14px;
		margin-bottom: 24px;
		padding: 0;
	}
	.kt-catalog__boards {
		width: 100%;
		justify-content: center;
		overflow-x: auto;
		padding: 0 0 6px;
		gap: 16px;
	}
	.kt-catalog-board-link {
		font-size: 10px;
		white-space: nowrap;
	}
	.kt-catalog__label {
		font-size: 10px;
		text-align: center;
	}
	.kt-listing {
		padding: 24px 0 0;
	}
	.kt-listing > .kt-breadcrumbs {
		padding: 0 24px;
	}
	.kt-listing .kt-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 36px 20px;
	}
}

@media (max-width: 600px) {
	.kt-catalog {
		padding: 24px 0 60px;
	}
	.kt-catalog__cities {
		gap: 20px;
		padding: 12px 20px;
	}
	.kt-catalog__line {
		margin: 0 20px 24px;
		width: auto;
	}
	.kt-catalog__nav-row {
		padding: 0 20px;
	}
	.kt-catalog__boards {
		padding: 0 20px 6px;
		justify-content: flex-start;
	}
	.kt-listing .kt-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 36px 0;
		padding: 0 20px 20px;
	}
	.kt-listing .kt-grid .kt-card--model {
		width: 100%;
		margin-bottom: 0;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__media {
		aspect-ratio: 3 / 4;
		border-radius: 32px;
		width: 100%;
		overflow: hidden;
		position: relative;
		transform: translate3d(0, 0, 0);
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__img {
		aspect-ratio: 3 / 4;
		border-radius: 32px;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__body {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 8px;
		padding: 20px 10px 10px;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__title {
		font-size: 22px;
		margin-top: 0;
		margin-bottom: 0;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__excerpt {
		font-size: 12px;
		line-height: 1.4;
		margin-top: 4px;
		-webkit-line-clamp: 4;
	}
}

/* ==========================================================================
   Sticky Footer Reveal Effect
   ========================================================================== */
body {
	background: #fafafa; /* Matches the footer background color */
}

.kt-site-content {
	position: relative;
	z-index: 40;
	background: var(--kt-bg, #ffffff);
	/* Rounded corners on top and bottom to slide over the background/footer */
	border-radius: 40px;
	overflow: hidden;
	/* Prominent, high-fidelity shadow matching the reference website design */
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
	transition: border-radius 0.3s ease, box-shadow 0.3s ease;
	margin: 20px auto;
	width: calc(100% - 48px);
	max-width: calc(var(--kt-maxw) - 48px);
}

.kt-footer {
	position: relative;
	z-index: 10;
	background: #fafafa; /* Distinct backing color for the revealed footer */
}

/* Enable sticky reveal effect on devices with at least 480px vertical height (safeguard against landscape mobile cutoff) */
@media (min-height: 480px) {
	.kt-footer {
		position: sticky;
		bottom: 0;
		/* Pull the footer behind the main content container */
		margin-top: -32px;
		padding-top: 82px; /* Offset negative margin and spacing */
	}

	/* Adjust overlapping parameters for mobile screens */
	@media (max-width: 767px) {
		.kt-footer {
			margin-top: -50px;
			padding-top: 100px;
		}
	}
}

/* ==========================================================================
   Model Detailed Profile Card
   ========================================================================== */
.kt-model-profile {
	padding: 40px 0;
	background: #ffffff;
}

/* Hero Split Panel */
.kt-model-hero {
	display: flex;
	flex-direction: row;
	min-height: 600px;
	height: calc(100vh - 180px);
	max-height: 800px;
	background: #383838;
	color: #ffffff;
	border-radius: 40px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	margin-bottom: 60px;
}

.kt-model-hero__info {
	flex: 0 0 38%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 50px 40px;
	background: #383838;
}

.kt-model-hero__name {
	font-family: var(--kt-serif);
	font-weight: 300;
	font-size: clamp(38px, 4.5vw, 60px);
	margin: 0;
	line-height: 1.1;
	letter-spacing: -0.01em;
}

.kt-model-hero__params-box {
	margin: 18px 0;
}

.kt-model-hero__params-title {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: rgba(255, 255, 255, 0.45);
	margin: 0 0 18px;
}

.kt-model-hero__params-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.kt-model-hero__params-list li {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.8);
}

.kt-model-hero__params-list li strong {
	color: rgba(255, 255, 255, 0.5);
	font-weight: 500;
	margin-right: 6px;
}

.kt-model-hero__actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

.kt-btn-invite {
	display: inline-block;
	background: rgba(255, 255, 255, 0.15);
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.35);
	padding: 13px 30px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	border-radius: 30px;
	cursor: pointer;
	backdrop-filter: blur(10px);
	transition: background 0.3s ease, border-color 0.3s ease, transform 0.2s ease;
	width: fit-content;
}

.kt-btn-invite:hover {
	background: rgba(255, 255, 255, 0.25);
	border-color: rgba(255, 255, 255, 0.55);
}

.kt-btn-invite:active {
	transform: scale(0.97);
}

.kt-back-link {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.5);
	transition: color 0.3s ease;
}

.kt-back-link:hover {
	color: #ffffff;
}

.kt-model-hero__image-wrap {
	flex: 1;
	position: relative;
	background: #2b2b2b;
}

.kt-model-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 10%;
}

.kt-model-hero__placeholder {
	width: 100%;
	height: 100%;
	background: #2b2b2b;
}

/* About Section */
.kt-model-about {
	text-align: center;
	margin: 36px auto 28px;
	max-width: 760px;
	padding: 0 24px;
}

.kt-model-about__title {
	font-family: var(--kt-serif);
	font-size: 30px;
	font-weight: 400;
	margin: 0 0 26px;
	letter-spacing: 0.04em;
}

.kt-model-about__title-italic {
	font-style: italic;
	font-weight: 300;
	color: var(--kt-muted);
}

.kt-model-about__content {
	font-size: 14px;
	line-height: 1.85;
	color: var(--kt-muted);
	font-weight: 300;
}

/* Portfolio Slider (styled like main page hero slider) */
.kt-model-slider {
	padding: 30px 0 60px;
}

.kt-model-slider__track {
	display: flex;
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding: 0 40px 20px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.kt-model-slider__track::-webkit-scrollbar {
	display: none;
}

.kt-model-slide {
	flex: 0 0 auto;
	scroll-snap-align: center;
}

.kt-model-slide__image-wrap {
	border-radius: 40px;
	overflow: hidden;
	background: #f7f7f7;
	position: relative;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.kt-model-slide__img {
	display: block;
	height: 100% !important;
	width: 100% !important;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.kt-model-slide__image-wrap:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.09);
}

.kt-model-slide__image-wrap:hover .kt-model-slide__img {
	transform: scale(1.02);
}

/* Default aspect ratios for Horizontal vs Vertical sliders on PC */
.kt-model-slider.is-horizontal .kt-model-slide__image-wrap {
	height: 480px;
	aspect-ratio: 3/2;
}

.kt-model-slider.is-vertical .kt-model-slide__image-wrap {
	height: 640px;
	aspect-ratio: 2/3;
}

.kt-model-slider.is-horizontal .kt-model-slide__img {
	width: 100%;
}

.kt-model-slider.is-vertical .kt-model-slide__img {
	width: 100%;
}

/* Responsive adjustments for mobile and tablets */
@media (max-width: 900px) {
	.kt-model-profile {
		padding: 20px 0;
	}

	.kt-model-hero {
		flex-direction: column;
		height: auto;
		max-height: none;
		min-height: 0;
		border-radius: 32px;
		margin-bottom: 40px;
	}

	.kt-model-hero__info {
		padding: 36px 24px;
		order: 2;
	}

	.kt-model-hero__image-wrap {
		height: 400px;
		order: 1;
	}

	.kt-model-hero__name {
		font-size: 38px;
	}

	.kt-model-hero__params-box {
		margin: 20px 0;
	}

	.kt-model-hero__actions {
		width: 100%;
		align-items: center;
	}

	.kt-btn-invite {
		width: 100%;
		text-align: center;
		padding: 14px 20px;
	}

	.kt-model-about {
		margin: 40px auto 30px;
	}

	.kt-model-about__title {
		font-size: 24px;
	}

	.kt-model-slider {
		padding: 10px 0 40px;
	}

	.kt-model-slider__track {
		gap: 16px;
		padding: 0 24px 10px;
	}

	.kt-model-slide__image-wrap {
		border-radius: 28px;
	}

	.kt-model-slider.is-horizontal .kt-model-slide__image-wrap {
		height: 260px;
	}

	.kt-model-slider.is-vertical .kt-model-slide__image-wrap {
		height: 390px;
	}
}

/* Booking Contact Box */
.kt-booking-box {
	opacity: 0;
	transform: translateY(-8px);
	max-height: 0;
	overflow: hidden;
	transition: opacity 0.35s ease, transform 0.35s ease, max-height 0.35s ease, margin 0.35s ease;
	width: 100%;
}
.kt-booking-box.is-visible {
	opacity: 1;
	transform: translateY(0);
	/* Generous cap: the box is clipped by overflow, and the buttons wrap on
	   narrow screens — 140px used to cut them off. */
	max-height: 260px;
	margin-top: 8px;
	margin-bottom: 0;
}
.kt-booking-box[hidden] {
	display: none !important;
}
.kt-booking-box__title {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.45);
	margin: 0 0 8px;
	text-align: left;
}
.kt-booking-box__buttons {
	display: flex;
	gap: 12px;
	width: 100%;
}
.kt-btn-booking {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	border-radius: 20px;
	color: #ffffff;
	transition: background 0.3s ease, border-color 0.3s ease;
	text-align: center;
}
.kt-btn-booking--tg {
	background: #229ED9;
	border: 1px solid #229ED9;
}
.kt-btn-booking--tg:hover {
	background: #1e8ec3;
	border-color: #1e8ec3;
}
.kt-btn-booking--wa {
	background: #25D366;
	border: 1px solid #25D366;
}
.kt-btn-booking--wa:hover {
	background: #20bd5a;
	border-color: #20bd5a;
}
.kt-btn-booking--black {
	background: #000;
	border: 1px solid #000;
	color: #fff;
}
.kt-btn-booking--black:hover {
	background: #333;
	border-color: #333;
}

.kt-services-page {
	background: var(--kt-bg, #ffffff);
	/* Rounded bottom corners to overlay the sticky reveal footer perfectly */
	border-radius: 0 0 40px 40px;
}
.kt-services-container {
	max-width: var(--kt-maxw, 1320px);
	margin: 0 auto;
	padding: 80px var(--kt-gap, 20px) 120px;
}
.kt-services-header {
	text-align: center;
	margin-bottom: 50px;
}
.kt-services-title {
	font-family: var(--kt-serif);
	font-size: 42px;
	font-weight: normal;
	color: var(--kt-fg, #111111);
	margin: 0 0 10px;
}
.kt-services-subtitle {
	font-family: var(--kt-sans);
	font-size: 11px;
	color: var(--kt-muted, #6b6b6b);
	text-transform: uppercase;
	letter-spacing: 0.15em;
	margin: 0;
}
.kt-services-intro {
	max-width: 800px;
	margin: 0 auto 50px;
	text-align: center;
	font-size: 16px;
	line-height: 1.6;
	color: var(--kt-muted, #6b6b6b);
}

/* --- Currency Switcher --- */
.kt-currency-switcher {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin: -10px 0 40px;
}
.kt-currency-switcher__label {
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 600;
	color: var(--kt-muted, #6b6b6b);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}
.kt-currency-switcher__buttons {
	display: flex;
	background: #f5f5f5;
	border: 1px solid var(--kt-line, #e5e5e5);
	border-radius: 99px;
	padding: 4px;
}
.kt-currency-btn {
	background: transparent;
	border: none;
	color: var(--kt-muted, #6b6b6b);
	padding: 8px 18px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border-radius: 99px;
	cursor: pointer;
	transition: background 0.3s ease, color 0.3s ease;
	outline: none;
}
.kt-currency-btn:hover {
	color: var(--kt-fg, #111111);
}
.kt-currency-btn.is-active {
	background: #ffffff;
	color: var(--kt-fg, #111111);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.kt-services-grid {
	/* Using flex for column-based sticky row overlapping on PC */
	display: flex;
	flex-wrap: wrap;
	gap: 40px var(--kt-gap, 20px);
}
.kt-service-card {
	display: flex;
	flex-direction: column;
	width: calc((100% - 2 * var(--kt-gap, 20px)) / 3);
	background: #ffffff;
	border-radius: 24px;
	padding: 24px;
	box-shadow: 0 10px 40px rgba(0,0,0,0.05);
	margin-bottom: 40px;
	transition: box-shadow 0.4s ease, transform 0.3s ease;
	position: relative;
}
.kt-service-card:hover {
	transform: translateY(-2px);
}

.kt-service-card__image-link {
	display: block;
	width: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 20px;
	margin-bottom: 24px;
	aspect-ratio: 16 / 10;
	box-shadow: 0 5px 15px rgba(0,0,0,0.03);
	transition: box-shadow 0.4s ease;
}
.kt-service-card:hover .kt-service-card__image-link {
	box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}
.kt-service-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.kt-service-card:hover .kt-service-card__image {
	transform: scale(1.04);
}
.kt-service-card__body {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.kt-service-card__title {
	font-family: var(--kt-serif);
	font-size: 26px;
	font-weight: normal;
	margin: 0 0 12px;
	line-height: 1.25;
}
.kt-service-card__title a {
	color: var(--kt-fg, #111111);
	transition: opacity 0.3s ease;
}
.kt-service-card__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}
.kt-service-card__title a:hover {
	opacity: 0.7;
}
.kt-service-card__description {
	font-family: var(--kt-sans);
	font-size: 14px;
	line-height: 1.6;
	color: var(--kt-muted, #6b6b6b);
	margin: 0 0 24px;
}
.kt-service-card__description p {
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.kt-service-card__footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 20px;
	border-top: 1px solid var(--kt-line, #e5e5e5);
}
.kt-service-card__price {
	font-family: var(--kt-sans);
	font-size: 15px;
	font-weight: 600;
	color: var(--kt-fg, #111111);
	letter-spacing: -0.01em;
}
.kt-service-card__button {
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--kt-fg, #111111);
	border-bottom: 1px solid var(--kt-fg, #111111);
	padding-bottom: 3px;
	transition: opacity 0.3s ease, border-color 0.3s ease;
	position: relative;
	z-index: 2;
}
.kt-service-card__button:hover {
	opacity: 0.6;
}

@media (max-width: 1024px) {
	.kt-services-grid {
		gap: 30px var(--kt-gap, 20px);
	}
	.kt-service-card {
		width: calc((100% - var(--kt-gap, 20px)) / 2);
		padding: 20px;
	}
	.kt-services-container {
		padding: 60px var(--kt-gap, 20px) 100px;
	}
	.kt-services-title {
		font-size: 36px;
	}
	.kt-service-card__title {
		font-size: 23px;
	}
}

@media (max-width: 767px) {
	.kt-services-grid {
		display: flex;
		flex-direction: column;
		gap: 30px;
	}
	.kt-services-container {
		/* Side padding kept for the breadcrumbs and heading only. */
		padding: 40px 16px 30px;
	}
	.kt-services-title {
		font-size: 32px;
	}
	.kt-service-card {
		width: 100%;
		margin-bottom: 30px;
		background: #ffffff;
		padding: 16px;
		box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
	}
	.kt-service-card__image-link {
		border-radius: 16px;
		margin-bottom: 18px;
	}
	.kt-service-card__title {
		font-size: 21px;
	}
	.kt-service-card__description {
		margin-bottom: 16px;
	}
}

/* ===== Geo landings (country hub / city) + lang switcher ===== */
.kt-geo{max-width:1100px;margin:0 auto;padding:24px 20px 64px}
.kt-breadcrumbs{font-size:13px;opacity:.7;margin:8px 0 24px}
.kt-breadcrumbs a{color:inherit;text-decoration:none}
.kt-breadcrumbs a:hover{text-decoration:underline}
.kt-breadcrumbs__sep{opacity:.5}
.kt-geo__head{margin-bottom:32px}
.kt-geo__title{font-size:clamp(28px,5vw,48px);line-height:1.05;margin:0 0 16px}
.kt-geo__intro{font-size:17px;line-height:1.6;max-width:760px;opacity:.9}
.kt-geo-local{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:32px 0}
.kt-geo-local__title{font-size:18px;margin:0 0 6px}
.kt-geo-local__text{margin:0;opacity:.85;line-height:1.5}
.kt-price{margin:40px 0}
.kt-price__title,.kt-faq__title,.kt-geo-models__title,.kt-country-cities__title{font-size:24px;margin:0 0 16px}
.kt-price__range{font-size:20px;font-weight:600;margin:0 0 12px}
.kt-price__table{width:100%;max-width:520px;border-collapse:collapse}
.kt-price__table td{padding:10px 0;border-bottom:1px solid rgba(128,128,128,.25)}
.kt-price__value{text-align:right;font-weight:600;white-space:nowrap}
.kt-faq{margin:40px 0;max-width:820px}
.kt-faq__item{border-bottom:1px solid rgba(128,128,128,.25);padding:14px 0}
.kt-faq__q{cursor:pointer;font-weight:600;font-size:17px;list-style:none}
.kt-faq__q::-webkit-details-marker{display:none}
.kt-faq__q::after{content:"+";float:right;opacity:.6}
.kt-faq__item[open] .kt-faq__q::after{content:"–"}
.kt-faq__a{padding-top:10px;opacity:.85;line-height:1.6}
.kt-country-cities{margin:32px 0}
.kt-country-cities__grid{display:flex;flex-wrap:wrap;gap:12px}
.kt-country-cities__item{display:inline-block;padding:10px 18px;border:1px solid rgba(128,128,128,.35);border-radius:999px;text-decoration:none;color:inherit;transition:.2s}
.kt-country-cities__item:hover{background:rgba(128,128,128,.12)}
.kt-geo-models{margin:48px 0 0}
.kt-lang-switcher{display:inline-block}
.kt-lang-switcher__list{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.kt-lang-switcher__item{display:inline-block;padding:4px 8px;font-size:13px;letter-spacing:.04em;text-decoration:none;color:inherit;opacity:.6}
.kt-lang-switcher__item.is-active{opacity:1;font-weight:700;text-decoration:underline}

/* ===== Age Gate / Pre-screen Overlay ===== */
.kt-age-gate {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #000;
	color: #fff;
	overflow: hidden;
	transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1), visibility 0.6s;
}

.kt-age-gate.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.kt-age-gate__video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	transform: translate(-50%, -50%);
	object-fit: cover;
	z-index: 1;
}

.kt-age-gate__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.45);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	z-index: 2;
}

.kt-age-gate__content {
	position: relative;
	z-index: 3;
	text-align: center;
	max-width: 600px;
	padding: 40px var(--kt-gap);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.kt-age-gate__title {
	font-family: var(--kt-serif);
	font-size: clamp(32px, 6vw, 56px);
	font-weight: 400;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	margin: 0 0 24px;
	padding-left: 0.35em;
	color: #fff;
	line-height: 1.1;
	animation: ktFadeInDown 1s ease both;
}

.kt-age-gate__text {
	font-size: clamp(14px, 2vw, 17px);
	line-height: 1.6;
	opacity: 0.85;
	margin: 0 0 40px;
	color: #fff;
	animation: ktFadeIn 1s ease 0.3s both;
}
.kt-age-gate__text a {
	color: #fff;
	text-decoration: underline;
	transition: opacity 0.2s ease;
}
.kt-age-gate__text a:hover {
	opacity: 0.7;
}


.kt-age-gate__btn {
	background: #fff;
	color: #000;
	border: 1px solid #fff;
	border-radius: 999px;
	padding: 16px 54px;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.3s ease, color 0.3s ease, transform 0.2s ease;
	outline: none;
	animation: ktFadeInUp 1s ease 0.6s both;
}

.kt-age-gate__btn:hover {
	background: transparent;
	color: #fff;
	transform: scale(1.03);
}

.kt-age-gate__btn:active {
	transform: scale(0.98);
}

@keyframes ktFadeInDown {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes ktFadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes ktFadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* ==========================================================================
   Sticky Footer & Hero Slider Arrows
   ========================================================================== */
.kt-site-content {
	flex: 1 0 auto;
}
.kt-footer {
	flex-shrink: 0;
}


/* Flat, layout-aligned transparent arrow navigation matching header/footer simplicity */
.kt-hero-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 50;
	width: 44px;
	height: 80px;
	background: transparent;
	border: 0;
	box-shadow: none;
	color: #000000;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: opacity 0.25s, transform 0.2s;
	padding: 0;
	outline: none;
	opacity: 0.55;
}
.kt-hero-slider__arrow:hover {
	opacity: 0.95;
	transform: translateY(-50%) scale(1.15);
	background: transparent;
	color: #000000;
	box-shadow: none;
	border-color: transparent;
}
.kt-hero-slider__arrow--left {
	left: 24px;
}
.kt-hero-slider__arrow--right {
	right: 24px;
}

@media (max-width: 767px) {
	.kt-hero-slider__arrow {
		width: 36px;
		height: 60px;
		opacity: 0.6;
	}
	.kt-hero-slider__arrow--left {
		left: 12px;
	}
	.kt-hero-slider__arrow--right {
		right: 12px;
	}
}

/* Contact popup choice dialog */
.kt-contact-popup {
	position: fixed; inset: 0; z-index: 300;
	display: flex; align-items: center; justify-content: center;
}
.kt-contact-popup[hidden] { display: none !important; }
.kt-contact-popup__backdrop {
	position: absolute; inset: 0;
	background: rgba(0, 0, 0, 0.45);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.kt-contact-popup__dialog {
	position: relative; z-index: 1;
	background: #fff; border-radius: 24px;
	padding: 40px clamp(20px, 5vw, 48px);
	width: min(400px, 92vw);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
	text-align: center;
	animation: kt-contact-popup-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes kt-contact-popup-in {
	from { opacity: 0; transform: scale(0.95) translateY(10px); }
	to { opacity: 1; transform: scale(1) translateY(0); }
}
.kt-contact-popup__close {
	position: absolute; top: 16px; right: 20px;
	background: none; border: 0; font-size: 28px; line-height: 1; cursor: pointer; color: var(--kt-muted);
	transition: color 0.15s;
	padding: 0; outline: none;
}
.kt-contact-popup__close:hover { color: #000; }
.kt-contact-popup__title { font-family: var(--kt-serif); font-size: 22px; font-weight: 400; margin: 0 0 10px; color: #000; }
.kt-contact-popup__subtitle { font-size: 13px; color: var(--kt-muted); margin: 0 0 28px; line-height: 1.5; }
.kt-contact-popup__buttons { display: flex; flex-direction: column; gap: 12px; }
.kt-contact-popup__btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 14px 24px; border-radius: 999px; font-size: 11px; font-weight: 600;
	text-transform: uppercase; letter-spacing: 0.12em;
	text-decoration: none; transition: background 0.2s, transform 0.15s, opacity 0.2s;
}
.kt-contact-popup__btn svg { flex-shrink: 0; }
.kt-contact-popup__btn:active { transform: scale(0.98); }
.kt-contact-popup__btn--tg { background: #229ED9; color: #fff; }
.kt-contact-popup__btn--tg:hover { opacity: 0.9; }
.kt-contact-popup__btn--wa { background: #25D366; color: #fff; }
.kt-contact-popup__btn--wa:hover { opacity: 0.9; }

/* Model profile layout inside modal drawer */
.kt-modal--drawer .kt-model-profile {
	padding: 0;
	background: transparent;
}
.kt-modal--drawer .kt-model-hero {
	display: flex;
	flex-direction: column;
	height: auto;
	max-height: none;
	min-height: 0;
	background: transparent;
	color: var(--kt-fg);
	box-shadow: none;
	border-radius: 0;
	margin-bottom: 30px;
}
.kt-modal--drawer .kt-model-hero__image-wrap {
	width: 100%;
	height: clamp(320px, 45vh, 520px);
	border-radius: 20px;
	overflow: hidden;
	order: 1;
	margin-bottom: 24px;
}
.kt-modal--drawer .kt-model-hero__image-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.kt-modal--drawer .kt-model-hero__info {
	padding: 0;
	background: transparent;
	color: var(--kt-fg);
	order: 2;
	flex: none;
	width: 100%;
}
.kt-modal--drawer .kt-model-hero__name {
	font-family: var(--kt-serif);
	font-weight: 400;
	font-size: clamp(28px, 4.5vw, 38px);
	color: var(--kt-fg);
	margin: 0 0 16px;
}
.kt-modal--drawer .kt-model-hero__params-box {
	margin: 18px 0 0;
	border-top: 1px solid var(--kt-line);
	padding: 18px 0 0;
}
.kt-modal--drawer .kt-model-hero__params-title {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--kt-muted);
	margin: 0 0 14px;
}
.kt-modal--drawer .kt-model-hero__params-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px 24px;
	list-style: none;
	padding: 0;
	margin: 0;
}
.kt-modal--drawer .kt-model-hero__params-list li {
	font-size: 14px;
	color: var(--kt-fg);
}
.kt-modal--drawer .kt-model-hero__params-list strong {
	font-weight: 500;
	color: var(--kt-muted);
	margin-right: 4px;
}
.kt-modal--drawer .kt-model-hero__actions {
	margin-top: 0;
}
.kt-modal--drawer .kt-btn-invite {
	background: #000;
	color: #fff;
	border: 1px solid #000;
	border-radius: 999px;
	padding: 14px 32px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	cursor: pointer;
	transition: all 0.2s ease;
	width: 100%;
	max-width: 280px;
}
.kt-modal--drawer .kt-btn-invite:hover {
	background: #333;
	border-color: #333;
}
.kt-modal--drawer .kt-booking-box {
	/* Rule sits above the block, separating it from the attributes. */
	margin-top: 18px;
	border-top: 1px solid var(--kt-line);
	padding-top: 18px;
	margin-bottom: 0;
}
.kt-modal--drawer .kt-booking-box__title {
	font-size: 13px;
	color: var(--kt-muted);
	margin: 0 0 12px;
}
.kt-modal--drawer .kt-booking-box__buttons {
	display: flex;
	gap: 12px;
}
.kt-modal--drawer .kt-model-about {
	margin: 36px 0 20px;
	padding: 0;
}
.kt-modal--drawer .kt-model-about__title {
	font-family: var(--kt-serif);
	font-size: 22px;
	font-weight: 400;
	margin: 0 0 12px;
}
.kt-modal--drawer .kt-model-about__text {
	font-size: 15px;
	line-height: 1.6;
	color: var(--kt-fg);
}
.kt-modal--drawer .kt-model-slider {
	margin-top: 0;
	border-top: 1px solid var(--kt-line);
	padding: 18px 0 0;
}
.kt-modal--drawer .kt-model-slider__title {
	font-family: var(--kt-serif);
	font-size: 22px;
	font-weight: 400;
	margin: 0 0 16px;
}
.kt-modal--drawer .kt-model-slider__track img {
	height: 240px;
	width: auto;
	object-fit: cover;
	border-radius: 12px;
}

/* --------------------------------------------------------------------------
   FAQ Accordion Block
   -------------------------------------------------------------------------- */
.kt-homepage-faq {
	padding: 80px 24px;
	background: #ffffff;
}
.kt-homepage-faq__container {
	max-width: calc(var(--kt-maxw) - 48px);
	margin: 0 auto;
}
.kt-homepage-faq__title {
	font-family: var(--kt-serif);
	font-weight: 400;
	font-size: 36px;
	text-align: center;
	margin-bottom: 48px;
	letter-spacing: -0.02em;
}
.kt-homepage-faq__list {
	display: flex;
	flex-direction: column;
}
.kt-homepage-faq__col {
	border-top: 1px solid var(--kt-line);
}
@media (max-width: 900px) {
	.kt-homepage-faq__col + .kt-homepage-faq__col {
		margin-top: -1px;
	}
}
.kt-homepage-faq__item {
	border-bottom: 1px solid var(--kt-line);
}
@media (min-width: 901px) {
	.kt-homepage-faq__list {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 64px;
		align-items: start;
	}
}
.kt-homepage-faq__trigger {
	display: flex;
	align-items: center;
	width: 100%;
	background: transparent;
	border: 0;
	padding: 24px 0;
	text-align: left;
	cursor: pointer;
	color: var(--kt-fg);
	outline: none;
}
.kt-homepage-faq__number {
	font-family: var(--kt-serif);
	font-size: 16px;
	color: var(--kt-muted);
	margin-right: 24px;
	opacity: 0.6;
	width: 24px;
	flex-shrink: 0;
}
.kt-homepage-faq__question {
	font-family: var(--kt-sans);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.4;
	flex: 1;
	transition: color 0.3s ease;
}
.kt-homepage-faq__trigger:hover .kt-homepage-faq__question {
	color: var(--kt-muted);
}
.kt-homepage-faq__icon {
	position: relative;
	width: 20px;
	height: 20px;
	margin-left: 20px;
	flex-shrink: 0;
}
.kt-homepage-faq__icon::before,
.kt-homepage-faq__icon::after {
	content: '';
	position: absolute;
	background: currentColor;
	transition: transform 0.3s ease;
}
/* Horizontal line */
.kt-homepage-faq__icon::before {
	top: 9px;
	left: 3px;
	width: 14px;
	height: 1.5px;
}
/* Vertical line */
.kt-homepage-faq__icon::after {
	top: 3px;
	left: 9px;
	width: 1.5px;
	height: 14px;
}
/* Rotate vertical line to make a minus sign (-) when open */
.kt-homepage-faq__item.is-active .kt-homepage-faq__icon::after {
	transform: rotate(90deg);
	opacity: 0;
}
.kt-homepage-faq__item.is-active .kt-homepage-faq__icon::before {
	transform: rotate(180deg);
}
.kt-homepage-faq__panel {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 0.4s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.3s ease, padding 0.4s ease;
}
.kt-homepage-faq__content {
	padding: 0 0 24px 48px; /* Offset the number margin */
}
.kt-homepage-faq__content p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--kt-muted);
	margin: 0;
}
.kt-homepage-faq__content a {
	color: var(--kt-fg);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.kt-homepage-faq__content a:hover {
	color: var(--kt-muted);
}
.kt-homepage-faq__item.is-active .kt-homepage-faq__panel {
	opacity: 1;
}

@media (max-width: 768px) {
	.kt-homepage-faq {
		padding: 48px 16px;
	}
	.kt-homepage-faq__title {
		font-size: 28px;
		margin-bottom: 32px;
	}
	.kt-homepage-faq__trigger {
		padding: 20px 0;
	}
	.kt-homepage-faq__number {
		margin-right: 16px;
		font-size: 14px;
	}
	.kt-homepage-faq__question {
		font-size: 15px;
	}
	.kt-homepage-faq__content {
		padding: 0 0 20px 40px;
	}
	.kt-homepage-faq__content p {
		font-size: 14px;
	}
}

/* Infinite scroll loading indicator */
.kt-infinite-loading {
	text-align: center;
	padding: 24px 0;
	font-family: var(--kt-sans);
	font-size: 13px;
	color: var(--kt-muted);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	width: 100%;
	clear: both;
}


/* iOS Safari tab switcher layout for services on mobile */
@media (max-width: 767px) {
	.kt-services-grid {
		display: flex !important;
		flex-direction: column !important;
		gap: 0 !important;
		/* No side padding, no backdrop: the page card is the only frame.
		   Negative margin lets the cards outdent past the container's gutter. */
		margin: 0 -8px !important;
		padding: 8px 0 12px !important;
		background: transparent !important;
		border-radius: 0;
		position: relative;
	}
	/* Sticky stack: each card pins in turn and is fully visible while it is
	   the active one; the next card then slides over it. A fixed negative
	   margin (the old approach) clipped every card permanently instead. */
	.kt-service-card {
		display: flex !important;
		flex-direction: column !important;
		position: sticky !important;
		top: 12px;
		margin-bottom: 14px !important;
		transition: box-shadow 0.4s ease;
		/* No CSS scroll-snap here: it fights position: sticky and the scroll
		   stutters. Settling is done in JS (initSnapAssist). */
		border-radius: 24px !important;
		background: #ffffff !important;
		border: 1px solid rgba(0, 0, 0, 0.06) !important;
		box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.08) !important;
		transform: none;
		overflow: hidden;
	}
	.kt-service-card__body {
		order: -1 !important; /* Reorder body containing title to the top */
		background: #ffffff !important;
		color: #1a1a1a !important;
		padding: 20px 20px 10px !important;
	}
	.kt-service-card__image-link {
		order: 1 !important; /* Reorder image to the bottom */
		border-radius: 0 0 20px 20px !important;
		overflow: hidden;
		display: block;
	}
	
	.kt-service-card:nth-child(1) { z-index: 1; }
	.kt-service-card:nth-child(2) { z-index: 2; }
	.kt-service-card:nth-child(3) { z-index: 3; }
	.kt-service-card:nth-child(4) { z-index: 4; }
	.kt-service-card:nth-child(5) { z-index: 5; }
	.kt-service-card:nth-child(6) { z-index: 6; }
	.kt-service-card:nth-child(7) { z-index: 7; }
	.kt-service-card:nth-child(8) { z-index: 8; }
	.kt-service-card:nth-child(9) { z-index: 9; }
	.kt-service-card:nth-child(10) { z-index: 10; }
	.kt-service-card:nth-child(11) { z-index: 11; }
	.kt-service-card:nth-child(12) { z-index: 12; }
	.kt-service-card:nth-child(13) { z-index: 13; }
	.kt-service-card:nth-child(14) { z-index: 14; }
	.kt-service-card:nth-child(15) { z-index: 15; }
	.kt-service-card:nth-child(16) { z-index: 16; }
	.kt-service-card:nth-child(17) { z-index: 17; }
	.kt-service-card:nth-child(18) { z-index: 18; }
	.kt-service-card:nth-child(19) { z-index: 19; }
	.kt-service-card:nth-child(20) { z-index: 20; }

	.kt-service-card:nth-child(1) { top: 12px; }
	.kt-service-card:nth-child(2) { top: 20px; }
	.kt-service-card:nth-child(3) { top: 28px; }
	.kt-service-card:nth-child(4) { top: 36px; }
	.kt-service-card:nth-child(5) { top: 44px; }
	.kt-service-card:nth-child(6) { top: 52px; }
	.kt-service-card:nth-child(7) { top: 60px; }
	.kt-service-card:nth-child(8) { top: 68px; }
	.kt-service-card:nth-child(9) { top: 76px; }
	.kt-service-card:nth-child(10) { top: 84px; }
	.kt-service-card:nth-child(11) { top: 92px; }
	.kt-service-card:nth-child(12) { top: 100px; }
	.kt-service-card:nth-child(13) { top: 108px; }
	.kt-service-card:nth-child(14) { top: 116px; }
	.kt-service-card:nth-child(15) { top: 124px; }
	.kt-service-card:nth-child(16) { top: 132px; }
	.kt-service-card:nth-child(17) { top: 140px; }
	.kt-service-card:nth-child(18) { top: 148px; }
	.kt-service-card:nth-child(19) { top: 156px; }
	.kt-service-card:nth-child(20) { top: 164px; }
	
	.kt-service-card:active {
		box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15) !important;
	}
	
	.kt-service-card:last-child {
		margin-bottom: 0 !important;
	}

	/* Sticky cannot work inside an overflow:hidden ancestor; clip keeps the
	   rounded corners without creating a scroll container.
	   Matched on the content itself, not a body class: translated pages pick
	   the template up via page-{slug}.php and so carry page-template-default. */
	.kt-site-content:has(.kt-services-page) {
		overflow: clip;
	}
	
	.kt-service-card__title a {
		color: #1a1a1a !important;
		font-size: clamp(16px, 4vw, 20px) !important;
		font-weight: 500 !important;
		letter-spacing: -0.01em;
	}
	.kt-service-card__description p {
		color: rgba(0, 0, 0, 0.6) !important;
		font-size: 13px !important;
		line-height: 1.5 !important;
		margin-top: 6px;
	}
	.kt-service-card__footer {
		/* Was display:none, which hid the price entirely on phones. */
		display: flex !important;
		order: 0 !important;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		margin: 0 !important;
		padding: 12px 20px 16px !important;
		border-top: 0 !important;
		background: #ffffff !important;
	}
	.kt-service-card__price {
		font-size: 16px !important;
	}
}

/* --------------------------------------------------------------------------
   Home intro (headline + lede + messenger CTAs)
   -------------------------------------------------------------------------- */
.kt-home-intro {
	max-width: var(--kt-maxw);
	margin: 0 auto;
	padding: 56px 24px 8px;
	text-align: center;
}
.kt-home-intro__title {
	font-family: var(--kt-serif);
	font-size: clamp(30px, 4.2vw, 52px);
	line-height: 1.14;
	font-weight: 400;
	letter-spacing: -0.01em;
	margin: 0;
}
.kt-home-intro__line { display: block; }
.kt-home-intro__rule {
	display: block;
	width: 40px;
	height: 1px;
	margin: 22px auto;
	background: currentColor;
	opacity: .45;
}
.kt-home-intro__lede {
	font-family: var(--kt-sans);
	font-size: clamp(14px, 1.2vw, 16px);
	line-height: 1.55;
	margin: 0;
	opacity: .72;
}
.kt-home-intro__actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 30px;
}
.kt-pill-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 190px;
	padding: 13px 26px;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-family: var(--kt-sans);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	background: transparent;
	transition: background-color .2s ease, color .2s ease;
}
.kt-pill-btn--tg { color: #229ED9; }
.kt-pill-btn--wa { color: #1FAF54; }
.kt-pill-btn:hover { background: currentColor; }
.kt-pill-btn:hover span,
.kt-pill-btn:hover svg { color: #fff; fill: #fff; }

@media (max-width: 900px) {
	.kt-home-intro { padding: 32px 20px 4px; }
	.kt-home-intro__rule { margin: 18px auto; }
	.kt-home-intro__actions { gap: 12px; margin-top: 24px; }
	.kt-pill-btn { min-width: 0; flex: 1 1 auto; padding: 12px 20px; }
}

/* --------------------------------------------------------------------------
   Social icons (header, next to the logo — and footer)
   -------------------------------------------------------------------------- */
.kt-socials {
	display: flex;
	align-items: center;
	gap: 14px;
}
.kt-socials__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: inherit;
	opacity: .55;
	text-decoration: none;
	transition: opacity .2s ease;
}
.kt-socials__item:hover { opacity: 1; }

.kt-socials--footer {
	justify-content: center;
	gap: 18px;
	margin: 18px 0 4px;
}

/* Mobile header keeps the bottom nav for contact, so its icons are hidden.
   The footer set stays visible everywhere. */
@media (max-width: 900px) {
	.kt-socials--header { display: none; }
}

/* --------------------------------------------------------------------------
   Front page top block (intro + slider)

   These sit outside .kt-site-content, which is the opaque card that slides
   over the sticky footer. Without their own opaque layer the footer shows
   through them mid-page, so they get one — plus a flush join to the card
   below, so no gap can reveal the footer between the two.
   -------------------------------------------------------------------------- */
.kt-front-top {
	position: relative;
	z-index: 20;
	background: #fafafa;
	padding-bottom: 20px;
}
.kt-front-top + .kt-site-content {
	margin-top: 0;
}

/* --------------------------------------------------------------------------
   Contacts page
   -------------------------------------------------------------------------- */
.kt-contacts {
	max-width: 640px;
	margin: 0 auto;
	padding: 72px 24px 96px;
	text-align: center;
}
.kt-contacts__head { margin-bottom: 36px; }
.kt-contacts__title {
	font-family: var(--kt-serif);
	font-size: clamp(28px, 3.4vw, 42px);
	font-weight: 400;
	letter-spacing: -0.02em;
	margin: 0 0 14px;
}
.kt-contacts__lede {
	font-family: var(--kt-sans);
	font-size: 15px;
	line-height: 1.55;
	margin: 0;
	opacity: .7;
}
.kt-contacts__actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}
.kt-contacts__block { margin-top: 48px; }
.kt-contacts__label {
	font-family: var(--kt-sans);
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .14em;
	margin: 0 0 16px;
	opacity: .45;
}
.kt-socials--contacts {
	justify-content: center;
	gap: 24px;
}
.kt-socials--contacts .kt-socials__item { opacity: .7; }
.kt-contacts__email {
	font-family: var(--kt-sans);
	font-size: 16px;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
	opacity: .85;
	transition: opacity .2s ease;
}
.kt-contacts__email:hover { opacity: 1; }
.kt-contacts__content {
	margin-top: 48px;
	font-size: 15px;
	line-height: 1.7;
	text-align: left;
	opacity: .8;
}

@media (max-width: 900px) {
	.kt-contacts { padding: 40px 20px 64px; }
	.kt-contacts__block { margin-top: 36px; }
}

/* Social profiles under the messenger CTAs in the contact popup. */
.kt-contact-popup__socials {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: 20px;
}
.kt-contact-popup__social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(0, 0, 0, .14);
	border-radius: 50%;
	color: #111;
	opacity: .75;
	text-decoration: none;
	transition: opacity .2s ease, border-color .2s ease;
}
.kt-contact-popup__social:hover {
	opacity: 1;
	border-color: rgba(0, 0, 0, .3);
}

/* --------------------------------------------------------------------------
   Model preview card: name + metric specs, separated by a hairline rule
   -------------------------------------------------------------------------- */
.kt-card--model .kt-card__body {
	padding: 0 2px 14px;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
	text-align: center;
}
.kt-card__specs {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 4px 12px;
	font-family: var(--kt-sans);
	font-size: 12px;
	line-height: 1.4;
	color: var(--kt-muted);
}
.kt-card__spec { white-space: nowrap; }

@media (max-width: 900px) {
	.kt-listing .kt-grid { gap: 20px 16px; }
	.kt-card--model .kt-card__title { font-size: 19px; margin-top: 8px; }
	.kt-card--model .kt-card__body { padding-bottom: 12px; }
	.kt-card__specs { font-size: 11px; gap: 3px 10px; }
}

/* Arrow controls for the model photo carousel (a mouse wheel cannot scroll a
   horizontal track, so pointer users need explicit buttons). */
.kt-model-slider { position: relative; }
.kt-model-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .9);
	color: #111;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .18);
	transition: opacity .2s ease, background-color .2s ease;
}
.kt-model-slider__arrow:hover { background: #fff; }
.kt-model-slider__arrow--prev { left: 12px; }
.kt-model-slider__arrow--next { right: 12px; }
/* Hide the arrow that has nowhere left to go (and both when the strip fits). */
.kt-model-slider.is-at-start .kt-model-slider__arrow--prev,
.kt-model-slider.is-at-end .kt-model-slider__arrow--next,
.kt-model-slider.is-static .kt-model-slider__arrow {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

@media (max-width: 900px) {
	.kt-model-slider__arrow { width: 38px; height: 38px; }
	.kt-model-slider__arrow--prev { left: 8px; }
	.kt-model-slider__arrow--next { right: 8px; }
}

/* Model preview frame: fix the aspect so the image can never exceed it
   (an unsized image made the card scroll vertically on touch). */
.kt-card--model .kt-card__media {
	aspect-ratio: 3 / 4;
}
.kt-card--model .kt-card__img {
	display: block;
	height: 100%;
	object-fit: cover;
}

/* --------------------------------------------------------------------------
   Casting page — video-led recruitment layout
   -------------------------------------------------------------------------- */
.kt-casting__hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	min-height: 62vh;
	max-height: 720px;
	aspect-ratio: 16 / 9;
	margin: 0 auto;
	border-radius: 32px;
	overflow: hidden;
	background: #1c1c1c;
}
.kt-casting__hero.is-plain {
	aspect-ratio: auto;
	min-height: 0;
	padding: 48px 24px 0;
	background: transparent;
}
.kt-casting__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.kt-casting__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(0,0,0,.15) 0%, rgba(0,0,0,.1) 45%, rgba(0,0,0,.72) 100%);
}
.kt-casting__title {
	position: relative;
	z-index: 2;
	margin: 0;
	padding: 0 24px 48px;
	font-family: var(--kt-serif);
	font-size: clamp(28px, 4.4vw, 56px);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-align: center;
	color: #fff;
}
.kt-casting__hero.is-plain .kt-casting__title {
	color: inherit;
	padding-bottom: 0;
}

.kt-casting__inner {
	max-width: 940px;
	margin: 0 auto;
	padding: 48px 24px 80px;
}
.kt-casting__intro p {
	font-family: var(--kt-sans);
	font-size: clamp(15px, 1.3vw, 17px);
	line-height: 1.65;
	margin: 0 0 18px;
	opacity: .82;
	text-align: center;
}
.kt-casting__cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	margin-top: 56px;
}
.kt-casting__subtitle {
	font-family: var(--kt-serif);
	font-size: clamp(20px, 2vw, 26px);
	font-weight: 400;
	margin: 0 0 20px;
	letter-spacing: -0.01em;
}
.kt-casting__list,
.kt-casting__steps {
	margin: 0;
	padding: 0;
	font-family: var(--kt-sans);
	font-size: 15px;
	line-height: 1.5;
}
.kt-casting__list { list-style: none; }
.kt-casting__list li {
	position: relative;
	padding: 0 0 14px 22px;
	opacity: .85;
}
.kt-casting__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .6em;
	width: 6px;
	height: 1px;
	background: currentColor;
	opacity: .55;
}
.kt-casting__steps {
	list-style: none;
	counter-reset: kt-step;
}
.kt-casting__steps li {
	counter-increment: kt-step;
	position: relative;
	padding: 0 0 16px 34px;
	opacity: .85;
}
.kt-casting__steps li::before {
	content: counter(kt-step, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .06em;
	opacity: .5;
}
.kt-casting__cta {
	display: flex;
	justify-content: center;
	margin-top: 56px;
}
.kt-casting__content {
	margin-top: 56px;
	font-size: 15px;
	line-height: 1.7;
	opacity: .8;
}

@media (max-width: 900px) {
	.kt-casting__hero {
		aspect-ratio: 4 / 5;
		min-height: 0;
		border-radius: 24px;
	}
	.kt-casting__title { padding-bottom: 32px; }
	.kt-casting__inner { padding: 32px 20px 60px; }
	.kt-casting__cols {
		grid-template-columns: 1fr;
		gap: 36px;
		margin-top: 40px;
	}
	.kt-casting__cta { margin-top: 40px; }
}

/* Breadcrumb strip above the model catalog. Mirrors .kt-services-container
   so the models page and the services page share one vertical rhythm. */
.kt-models-head {
	max-width: var(--kt-maxw, 1320px);
	margin: 0 auto;
	padding: 80px var(--kt-gap, 20px) 0;
}
.kt-models-head + .kt-catalog {
	padding-top: 0;
}
@media (max-width: 767px) {
	.kt-models-head { padding: 40px 16px 0; }
	.kt-models-head + .kt-catalog { padding-top: 0; }
}

/* Footer policy link: balanced across two centred lines instead of one
   long uppercase run that wrapped raggedly. */
.kt-footer__menu a {
	display: inline-block;
	max-width: 30ch;
	line-height: 1.6;
	text-wrap: balance;
	text-align: center;
}
@media (max-width: 600px) {
	.kt-footer__menu a { max-width: 26ch; }
}

/* One breadcrumb style everywhere: centred, same rhythm on every template.
   Previously only the contacts page centred them (its container sets
   text-align: center), so every other page inherited left alignment. */
.kt-breadcrumbs {
	text-align: center;
	margin: 0 0 28px;
}
@media (max-width: 900px) {
	.kt-breadcrumbs { margin: 0 0 20px; }
}


/* ===== EXPERIMENT START: full-height model slides on mobile ================
   Each card fills the viewport, snaps hard (one card per gesture) and scales
   up when it becomes the current one. Remove this whole block to revert;
   backups: scratchpad/backup/main.css.before-fullheight (this version's
   predecessor) and main.css.before-model-stack (pre-experiment).
   ------------------------------------------------------------------------ */
@media (max-width: 767px) {
	/* Settling is handled in JS (initSnapAssist), not by CSS scroll-snap:
	   mandatory trapped the scroll at the ends of the list, and proximity was
	   too weak to feel like a catch. */
	.kt-site-content:has(.kt-catalog) {
		overflow: clip;
	}

	.kt-listing .kt-grid {
		display: flex !important;
		flex-direction: column !important;
		gap: 14px !important;
		padding: 0 12px 24px !important;
		margin: 0 !important;
	}

	.kt-listing .kt-grid .kt-card--model {
		/* Full viewport height minus the fixed bottom bar, leaving a sliver of
		   the next card visible so the list still reads as scrollable.

		   svh, not dvh. `dvh` tracks the *live* viewport, and on iOS Safari
		   that shrinks and grows continuously as the address bar collapses
		   during a scroll — every card in the column changed height mid-fling,
		   the column relaid out and the scroll position shifted under the
		   finger. That is the jerk the client is seeing. `svh` is the height
		   with the toolbars showing: a constant, so nothing relayouts while
		   scrolling. `vh` first as a fallback for older engines. */
		height: calc(100vh - 150px);
		height: calc(100svh - 150px);
		min-height: 420px;
		width: 100%;
		margin: 0 !important;
		display: flex;
		flex-direction: column;
		border-radius: 24px;
		background: #ffffff;
		border: 1px solid rgba(0, 0, 0, 0.06);
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.10);
		overflow: hidden;

		/* One card per gesture, settling just under the top edge. */
		scroll-margin-top: 12px;

		/* Inactive cards sit back; the current one comes forward. Kept fairly
		   opaque so a mistimed frame never reads as "greyed out". */
		transform: scale(0.96);
		opacity: 0.82;
		transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
		            opacity 0.45s ease,
		            box-shadow 0.45s ease;
	}
	.kt-listing .kt-grid .kt-card--model.is-current {
		transform: scale(1);
		opacity: 1;
		box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
	}

	.kt-listing .kt-grid .kt-card--model .kt-card__link {
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	/* Name and specs stay pinned at the top of the card. */
	.kt-listing .kt-grid .kt-card--model .kt-card__body {
		order: -1;
		flex: 0 0 auto;
		border-bottom: 0;
		background: #ffffff;
		padding: 16px 16px 12px;
	}

	/* The photo takes whatever height is left, cropped rather than letterboxed. */
	.kt-listing .kt-grid .kt-card--model .kt-card__media {
		flex: 1 1 auto;
		min-height: 0;
		aspect-ratio: auto !important;
		border-radius: 0 0 24px 24px;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__img,
	.kt-listing .kt-grid .kt-card--model .kt-card-slider,
	.kt-listing .kt-grid .kt-card--model .kt-card-slider__track,
	.kt-listing .kt-grid .kt-card--model .kt-card-slider__slide {
		height: 100%;
		aspect-ratio: auto !important;
		border-radius: 0 0 24px 24px;
	}
	.kt-listing .kt-grid .kt-card--model .kt-card__img {
		object-fit: cover;
	}

	/* Head stop: same problem as the footer had, mirrored — without a snap
	   point above the first card the scroll kept being pulled back down onto
	   it and the header/breadcrumbs were hard to reach. */

	/* Tail stop: lets the scroll settle past the last card instead of being
	   pulled back onto it, so the loader and the footer stay reachable. */
}
/* ===== EXPERIMENT END: full-height model slides on mobile ================= */

/* ===== TRIAL START: services page without the white page card ==============
   The page card is also what hides the sticky footer, so it keeps an opaque
   background — just in the page colour, with the frame removed. Delete this
   block to restore the white card (backup: main.css.before-services-frameless).
   ------------------------------------------------------------------------ */
.kt-site-content:has(.kt-services-page),
.kt-site-content:has(.kt-catalog) {
	background: #fafafa;
	box-shadow: none;
	border-radius: 0;
	width: 100%;
	max-width: var(--kt-maxw);
}
.kt-services-page {
	background: transparent;
	border-radius: 0;
}
/* Cards carry the contrast now, so give them a real edge on the flat page. */
.kt-service-card {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 24px;
}
/* ===== TRIAL END: services page without the white page card =============== */

/* --------------------------------------------------------------------------
   Desktop model cards, styled as cards to match the mobile treatment:
   white surface, hairline border, rounded, photo flush to the top edge.
   Replaces the old "bare photo + text on the page background" look, and the
   hairline divider under the text that stood in for a card edge.
   -------------------------------------------------------------------------- */
@media (min-width: 768px) {
	.kt-listing .kt-grid .kt-card--model {
		background: #ffffff;
		border: 1px solid rgba(0, 0, 0, 0.06);
		border-radius: 24px;
		overflow: hidden;
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
		transition: box-shadow 0.3s ease, transform 0.3s ease;
	}
	.kt-listing .kt-grid .kt-card--model:hover {
		box-shadow: 0 14px 34px rgba(0, 0, 0, 0.12);
		transform: translateY(-3px);
	}
	/* Photo sits flush inside the card: square off its own rounding. */
	.kt-listing .kt-grid .kt-card--model .kt-card__media,
	.kt-listing .kt-grid .kt-card--model .kt-card__img,
	.kt-listing .kt-grid .kt-card--model .kt-card-slider,
	.kt-listing .kt-grid .kt-card--model .kt-card-slider__slide {
		border-radius: 0;
	}
	/* Name + specs live inside the card, so the divider is redundant. */
	.kt-listing .kt-grid .kt-card--model .kt-card__body {
		border-bottom: 0;
		padding: 14px 16px 18px;
		text-align: center;
	}
}

/* --------------------------------------------------------------------------
   Model photo gallery: dot indicators
   Same visual language as the catalog cards. Hidden at rest; shown on hover
   (pointer) or while the strip is being scrolled (touch), and never shown at
   all when there is only one photo.
   -------------------------------------------------------------------------- */
.kt-model-slider__dots {
	position: absolute;
	left: 50%;
	bottom: 18px;
	transform: translateX(-50%);
	z-index: 6;
	display: flex;
	gap: 7px;
	padding: 6px 10px;
	border-radius: 12px;
	/* No backdrop-filter here. The dots sit at the bottom edge of the gallery,
	   right where the pinned contact strip starts, so the blur re-sampled that
	   strip on every frame of a swipe and it visibly flickered. A slightly
	   darker plain fill reads just as well over a photo — the catalog card
	   indicator has used exactly that from the start. */
	background: rgba(0, 0, 0, 0.42);
	opacity: 0;
	transition: opacity 0.3s ease;
}
.kt-model-slider:hover .kt-model-slider__dots,
.kt-model-slider.is-scrolling .kt-model-slider__dots {
	opacity: 1;
}
.kt-model-slider.is-static .kt-model-slider__dots {
	display: none;
}
.kt-model-slider__dot {
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: background 0.25s ease, transform 0.25s ease;
}
.kt-model-slider__dot.is-active {
	background: #ffffff;
	transform: scale(1.25);
}

/* Touch has no hover, so keep them visible a moment after a swipe. */
@media (hover: none) {
	.kt-model-slider__dots { bottom: 14px; }
}

/* --------------------------------------------------------------------------
   Model profile: the cover moved into the gallery, so the hero is now a
   single text column instead of a text/photo split.
   -------------------------------------------------------------------------- */
.kt-model-hero {
	height: auto;
	min-height: 0;
	max-height: none;
	margin-bottom: 28px;
}
.kt-model-hero__info {
	width: 100%;
	max-width: none;
}
.kt-model-hero__image-wrap,
.kt-model-hero__placeholder {
	display: none;
}

/* --------------------------------------------------------------------------
   Model profile: one typographic system for both blocks.

   Previously the "Физические параметры" heading rendered smaller than the
   values beneath it, and the manager block used a third, unrelated size —
   so the panel read as three competing styles. Section headings are now
   identical to each other and clearly outrank their content.
   -------------------------------------------------------------------------- */
.kt-modal--drawer .kt-model-hero__params-title,
.kt-modal--drawer .kt-booking-box__title,
.kt-model-hero__params-title,
.kt-booking-box__title {
	font-family: var(--kt-sans);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--kt-muted);
	margin: 0 0 14px;
}

/* Values sit a step below the heading: label muted, value solid. */
.kt-modal--drawer .kt-model-hero__params-list li,
.kt-model-hero__params-list li {
	font-family: var(--kt-sans);
	font-size: 12px;
	line-height: 1.45;
	color: var(--kt-fg, #111111);
}
.kt-modal--drawer .kt-model-hero__params-list strong,
.kt-model-hero__params-list strong {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--kt-muted);
	margin-right: 6px;
}

/* Manager block centred, buttons equal width and centred with it. */
.kt-modal--drawer .kt-booking-box,
.kt-booking-box {
	text-align: center;
}
.kt-modal--drawer .kt-booking-box__title,
.kt-booking-box__title {
	text-align: center;
}
.kt-modal--drawer .kt-booking-box__buttons,
.kt-booking-box__buttons {
	display: flex;
	justify-content: center;
	gap: 12px;
	max-width: 420px;
	margin: 0 auto;
}
.kt-btn-booking {
	flex: 1 1 0;
	max-width: 200px;
}

/* --------------------------------------------------------------------------
   No text selection on interface elements. Double-clicking a card, arrow or
   menu item used to paint it blue. Real copy (descriptions, policy text,
   e-mail) stays selectable — see the override at the end.
   -------------------------------------------------------------------------- */
.kt-header,
.kt-bottom-nav,
.kt-footer__menu,
.kt-breadcrumbs,
.kt-card,
.kt-card__link,
.kt-card__title,
.kt-card__specs,
.kt-service-card,
.kt-catalog__boards,
.kt-catalog-board-link,
.kt-city-switcher,
.kt-lang-switcher,
.kt-socials,
.kt-pill-btn,
.kt-btn-booking,
.kt-btn-invite,
.kt-service-card__button,
.kt-model-slider__arrow,
.kt-model-slider__dots,
.kt-card-slider__arrow,
.kt-card-slider__indicator,
.kt-hero-slider__arrow,
.kt-homepage-faq__trigger,
.kt-modal__close,
.kt-contact-popup__btn,
.kt-model-hero__params-box,
.kt-booking-box,
.kt-pagination {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	/* Kills the grey/blue tap flash on touch devices too. */
	-webkit-tap-highlight-color: transparent;
}

/* Anything that is genuinely text stays selectable. */
.kt-model-about__content,
.kt-modal-article__content,
.kt-page__content,
.kt-casting__intro,
.kt-casting__list,
.kt-casting__steps,
.kt-casting__content,
.kt-contacts__email,
.kt-contacts__lede,
.kt-homepage-faq__panel,
.kt-geo__intro,
.kt-service-card__description {
	-webkit-user-select: text;
	-moz-user-select: text;
	user-select: text;
}

/* Contact block in its new home under the photo strip. */
.kt-booking-box--under-photos {
	max-height: none;
	overflow: visible;
	margin: 0;
	padding: 22px 0 8px;
	border-top: 1px solid var(--kt-line, #e5e5e5);
}
.kt-modal--drawer .kt-booking-box--under-photos {
	margin-top: 0;
	padding: 22px 0 4px;
	border-top: 1px solid var(--kt-line, #e5e5e5);
}
@media (max-width: 900px) {
	.kt-booking-box--under-photos { padding: 18px 0 4px; }
}

/* The "back to models" link is white — it was written for the dark hero of the
   standalone page. Inside the modal the panel is white, so the link was
   invisible yet still reserved a gap under the attributes. The modal has its
   own close button, so the whole row goes. */
.kt-modal--drawer .kt-model-hero__actions {
	display: none;
}

/* --------------------------------------------------------------------------
   Contact block stays on screen inside the model card.

   It is the point of the whole card, so it pins to the bottom of the scrolling
   dialog instead of waiting at the end of the gallery. Sticky (not fixed) so
   it stays inside the panel and never overlaps the page behind it.
   -------------------------------------------------------------------------- */
.kt-modal--drawer .kt-booking-box--under-photos {
	position: sticky;
	bottom: 0;
	z-index: 6;
	background: #ffffff;
	margin: 8px 0 0;
	padding: 16px 0 calc(12px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--kt-line, #e5e5e5);
}
/* Soft fade so gallery photos do not collide with the pinned edge. */
/* The gradient scrim that used to sit above this strip was removed: being an
   absolutely positioned child of a sticky element, Safari repainted it on
   every scroll frame and the panel flickered. The border below separates the
   strip from the photos just as well. */

/* --------------------------------------------------------------------------
   Long-list performance.

   Each model card carries a 5-photo slider, so every infinite-scroll batch
   adds ~60 images to the DOM. Skipping render work for cards that are off
   screen keeps scrolling smooth once several batches are loaded.
   The reserved size stops the scrollbar from jumping as cards enter view.

   Desktop only: on mobile the cards are sticky/snapped, and content-visibility
   interferes with that.
   -------------------------------------------------------------------------- */
@media (min-width: 768px) {
	.kt-listing .kt-grid .kt-card--model,
	.kt-services-grid .kt-service-card {
		content-visibility: auto;
		contain-intrinsic-size: auto 520px;
	}
}

/* Cross-fade the incoming photo alongside the eased scroll, so the change
   reads as a transition rather than a jump. */
.kt-card-slider__img,
.kt-card__img,
.kt-model-slide__img {
	transition: opacity 0.35s ease;
}
.kt-card-slider__track,
.kt-model-slider__track {
	scroll-behavior: auto; /* the JS easing owns the motion */
}

/* --------------------------------------------------------------------------
   Page transition: a frosted-glass veil with the logo on the way out, and a
   defocus-to-sharp reveal on the way in. Only real page loads — modals, the
   city switcher and anything handled in place are excluded in JS.
   -------------------------------------------------------------------------- */
.kt-page-transition {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: flex;
	align-items: center;
	justify-content: center;
	/* Glass, not paint: the page stays visible underneath, just defocused. */
	background: rgba(250, 250, 250, 0.5);
	/* No backdrop-filter at rest: declaring it keeps a compositing layer over
	   the entire page even while hidden, and that layer bled through / flickered
	   during scrolling. It is switched on only with .is-active below. */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	/* Only opacity/visibility at rest — naming backdrop-filter here was enough
	   to keep the compositing layer alive. The .is-active rule animates it. */
	transition: opacity 0.42s ease, visibility 0s linear 0.42s;
}
.kt-page-transition.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
	-webkit-backdrop-filter: blur(26px) saturate(170%);
	backdrop-filter: blur(26px) saturate(170%);
	transition: opacity 0.32s ease,
	            backdrop-filter 0.52s cubic-bezier(0.16, 1, 0.3, 1),
	            -webkit-backdrop-filter 0.52s cubic-bezier(0.16, 1, 0.3, 1),
	            visibility 0s;
}

/* Same lettering as the header logo, just larger. */
.kt-page-transition__logo {
	font-family: var(--kt-serif);
	font-size: clamp(22px, 4.4vw, 34px);
	font-weight: 400;
	letter-spacing: .28em;
	text-transform: uppercase;
	padding-left: .28em;
	color: #111111;
	opacity: 0;
	transform: scale(0.97);
	filter: blur(6px);
	transition: opacity 0.42s ease 0.06s,
	            transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.06s,
	            filter 0.42s ease 0.06s;
}
.kt-page-transition__logo--img {
	max-width: min(240px, 60vw);
	height: auto;
	letter-spacing: normal;
	padding-left: 0;
}
.kt-page-transition.is-active .kt-page-transition__logo {
	opacity: 1;
	transform: scale(1);
	filter: none;
}

/* Arrival: the veil is already up (class set in the head before first paint)
   and then clears, so the frost carries across the navigation instead of
   restarting. No filter on the wrapper itself — the veil's backdrop blur is
   what defocuses the page, and stacking both looked muddy. */
.kt-nav-in .kt-page-transition {
	opacity: 1;
	visibility: visible;
	-webkit-backdrop-filter: blur(26px) saturate(170%);
	backdrop-filter: blur(26px) saturate(170%);
	transition: none;
}
.kt-nav-in .kt-page-transition__logo {
	opacity: 1;
	transform: scale(1);
	filter: none;
	transition: none;
}
/* Removing the class hands control back to the transitions declared above,
   which dissolve the frost and fade the logo out. */

@media (prefers-reduced-motion: reduce) {
	.kt-page-transition,
	.kt-page-transition__logo { transition: none; }
	.kt-page-wrapper { animation: none; }
}

/* --------------------------------------------------------------------------
   Pin the contact block to the actual bottom of the card.

   A sticky element stops at the container's padding edge, and the drawer
   dialog carries 24–56px of bottom padding — that gap was showing under the
   buttons. Drop the padding when a model profile is inside and let the block
   carry its own instead, so it sits flush with the bottom.
   -------------------------------------------------------------------------- */
.kt-modal--drawer .kt-modal__dialog:has(.kt-model-profile),
.kt-modal--drawer .kt-modal__dialog:has(.kt-modal-article--kt_service) {
	padding-bottom: 0;
}
.kt-modal--drawer .kt-booking-box--under-photos {
	/* Mirror the dialog's own padding via the variable it sets — hardcoding the
	   values meant the two disagreed at some widths and the strip fell short on
	   one side. */
	/* width:100% comes from the base .kt-booking-box; with it the negative
	   margins only shifted the block left and left a gap on the right. */
	width: auto;
	box-sizing: border-box;
	margin: 0 calc(-1 * var(--kt-dialog-pad, 24px));
	/* Just enough below the buttons that they do not touch the panel edge. */
	padding: 14px var(--kt-dialog-pad, 24px) 5px;
	/* Own layer: a sticky element repainted together with the scrolling
	   content is what made Safari flicker. */
	transform: translateZ(0);
}
.kt-modal--drawer .kt-booking-box__buttons {
	margin-bottom: 0;
}
/* The dialog is taller than the content when a card is short; without this the
   article ends early and the pinned strip stops above the dialog floor. */
.kt-modal--drawer .kt-model-profile,
.kt-modal--drawer .kt-modal-article--kt_service {
	min-height: 100%;
	display: flex;
	flex-direction: column;
}
.kt-modal--drawer .kt-model-profile .kt-booking-box--under-photos,
.kt-modal--drawer .kt-modal-article--kt_service .kt-booking-box--under-photos {
	margin-top: auto;
}
/* A flex column does not shrink-wrap images, but it also will not let them
   squash: the banner keeps its own height instead of being compressed to make
   room for the copy below. */
.kt-modal--drawer .kt-modal-article--kt_service > * {
	flex: 0 0 auto;
}


/* --------------------------------------------------------------------------
   iOS Safari smoothness for the catalogs.

   What used to live here did the opposite of its name. `will-change: transform`
   on every card in the list asks the browser to keep a permanent compositing
   layer per card; with a long list of large photos iOS runs out of GPU memory,
   starts evicting those layers and re-rasterising them — which is both the
   stutter and the cards that come back veiled in white.

   The `-webkit-transform: translateZ(0)` next to it was worse than useless:
   `-webkit-transform` is an alias of `transform`, not a separate property, so
   sitting later in the file it simply overwrote the `scale(0.96)`/`scale(1)`
   pair the card stack is built on. The settle has been running without its
   scale ever since.

   Both are gone. Layer promotion is left to the browser, which already
   promotes an element for the duration of a transform transition.
   -------------------------------------------------------------------------- */
@media (max-width: 767px) and (hover: none) {
	/* Touch has no hover state, so the shadow no longer needs to animate; the
	   scale/opacity pair stays, slightly quicker, since that is what makes the
	   settle feel tactile. */
	.kt-listing .kt-grid .kt-card--model {
		transition: transform 0.3s ease, opacity 0.3s ease;
	}
}

/* --------------------------------------------------------------------------
   Modal chrome that survives scrolling.

   The close button and the drag handle were absolutely positioned inside the
   scrolling dialog, so both scrolled away with the content. Sticky keeps them
   pinned; the negative bottom margins stop them from taking up flow height.
   -------------------------------------------------------------------------- */
.kt-modal--drawer .kt-modal__close {
	position: sticky;
	/* Sticky offsets are measured from the scroll container's content box, so
	   the top padding has to be subtracted to land 12px below the panel edge.
	   `right` comes from the base absolute-positioned rule and would drag the
	   button inwards — the margins below do the horizontal placement. */
	top: calc(12px - var(--kt-dialog-pad-top, 48px));
	right: auto;
	z-index: 30;
	display: block;
	width: 38px;
	height: 38px;
	/* Sticky is clamped by its containing block — the dialog's content box —
	   so on its own the cross parks below the whole top padding rather than in
	   the corner. The negative top/right margins lift it back out into that
	   padding; the negative bottom margin keeps it out of the flow. */
	/* The bottom margin cancels the top margin plus the 38px height, so the
	   button occupies no flow height whatever the dialog's padding is —
	   otherwise it shifts the content it is supposed to float over. */
	margin: calc(12px - var(--kt-dialog-pad-top, 48px))
	        calc(12px - var(--kt-dialog-pad, 24px))
	        calc(var(--kt-dialog-pad-top, 48px) - 50px)
	        auto;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	font-size: 28px;
	line-height: 38px;
	text-align: center;
	color: var(--kt-muted, #8a8a8a);
	/* A halo instead of a badge: invisible against the white panel, but keeps
	   the glyph readable on the frames where it floats over a photo. */
	text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 16px #fff;
}

/* The handle is a touch affordance — pointer devices have the close button. */
@media (hover: none) {
	.kt-modal.kt-modal--drawer .kt-modal__dialog::before {
		position: sticky;
		/* Same correction as the close button: sticky offsets start at the
		   dialog's content box, so the top padding is subtracted to keep the
		   handle just under the sheet's edge. */
		top: calc(10px - var(--kt-dialog-pad-top, 48px));
		left: auto;
		transform: none;
		display: block;
		/* Same balance as the close button: top margin + 4px height + bottom
		   margin add up to zero, so the handle never displaces the content. */
		margin: calc(10px - var(--kt-dialog-pad-top, 48px))
		        auto
		        calc(var(--kt-dialog-pad-top, 48px) - 14px);
		z-index: 25;
	}
}
@media (hover: hover) {
	.kt-modal.kt-modal--drawer .kt-modal__dialog::before {
		display: none;
	}
}

/* Clearance for the fixed bottom tab bar: on the footer, so the page card can
   sit flush against it instead of leaving a gap above the footer. */
@media (max-width: 900px) {
	.kt-footer {
		padding-bottom: calc(50px + env(safe-area-inset-bottom, 0px) + 72px);
	}
}