/*
 * kvand.com — оформление поверх UIkit 3.
 * Цвета и размеры перенесены со старой темы (YOOtheme «Horizon»),
 * собственные классы сайта (c-zoom, m-hide и др.) — из её пользовательского CSS.
 */

:root {
	--kv-text: #313e4f;
	--kv-heading: #19365d;
	--kv-muted: #8a94a8;
	--kv-gold: #cb8e14;
	--kv-dark: #111;
	--kv-grey: #ededed;
	--kv-footer: #5a5a5a;
	--kv-overlay: rgba(43, 49, 69, .8);
	--kv-overlay-strong: rgba(43, 49, 69, .95);
	--kv-header-h: 80px;
}

/* ---------- База ---------- */

html {
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	font-weight: 300;
	line-height: 1.6;
	color: var(--kv-text);
	background: #fff;
}

h1, .uk-h1, h2, .uk-h2, h3, .uk-h3, h4, .uk-h4 {
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif;
	font-weight: 300;
	color: var(--kv-heading);
	margin: 0 0 20px;
}

h1, .uk-h1 { font-size: 34px; line-height: 1.4; }
h2, .uk-h2 { font-size: 30px; line-height: 1.3; }
h3, .uk-h3 { font-size: 22px; line-height: 1.4; }
h4, .uk-h4 { font-size: 18px; line-height: 1.4; }

@media (min-width: 960px) {
	h1, .uk-h1 { font-size: 42px; }
	h2, .uk-h2 { font-size: 34px; }
}

a, .uk-link { color: var(--kv-gold); }
a:hover, .uk-link:hover { color: var(--kv-heading); text-decoration: none; }

strong, b { font-weight: 600; }

/* Служебный класс Joomla: текст только для экранных дикторов. */
.visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/*
 * Меню Joomla 6 сворачивает вложенные пункты и добавляет кнопки-раскрывашки.
 * В боковых меню сайта вложенность показывается сразу, как на старом сайте.
 */
.kv-sidebar .mod-menu__toggle-sub,
.kv-offcanvas .mod-menu__toggle-sub,
.kv-footer .mod-menu__toggle-sub { display: none !important; }

.kv-sidebar .mod-menu__sub,
.kv-offcanvas .mod-menu__sub { display: block !important; }

/* Картинки нельзя перетаскивать и выделять (как на старом сайте). */
img {
	-webkit-user-drag: none;
	user-select: none;
	-webkit-touch-callout: none;
}

::-webkit-scrollbar { width: 5px; background-color: #f5f5f5; }
::-webkit-scrollbar-thumb { background-color: #b3b3b3; }

/* ---------- Кнопки ---------- */

.uk-button {
	font-family: Montserrat, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1px;
	text-transform: uppercase;
	line-height: 38px;
	padding: 0 30px;
}

.uk-button-default {
	background: #fff;
	color: var(--kv-gold);
	border: 1px solid transparent;
	border-radius: 500px;
	box-shadow: 0 4px 28px rgba(0, 0, 0, .07);
}

.uk-button-default:hover,
.uk-button-default:focus {
	background: #fff;
	color: var(--kv-heading);
	border-color: transparent;
	box-shadow: 0 6px 32px rgba(0, 0, 0, .12);
}

.uk-button-primary {
	background: var(--kv-gold);
	color: #fff;
}

.uk-button-primary:hover,
.uk-button-primary:focus { background: #b07a0e; color: #fff; }

/* Ссылка-кнопка «Подробнее о проекте →». */
.kv-more {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.kv-more::after {
	content: "";
	width: 20px;
	height: 1px;
	background: var(--kv-gold);
	box-shadow: 0 0 0 0 var(--kv-gold);
	transition: width .2s ease;
}

.kv-more:hover { color: #fff; }
.kv-more:hover::after { width: 30px; }

/* ---------- Шапка ---------- */

.kv-header__bar {
	background: var(--kv-dark);
	transition: background-color .25s ease;
}

.kv-header--overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 980;
}

.kv-header--overlay .kv-header__bar { background: transparent; }
.kv-header--overlay .kv-header__bar.kv-header__bar--stuck { background: rgba(17, 17, 17, .92); }

.kv-header .uk-navbar-item,
.kv-header .uk-navbar-toggle { min-height: var(--kv-header-h); color: #fff; }

.kv-header .uk-navbar-toggle:hover { color: var(--kv-gold); }

.kv-logo img { display: block; width: 160px; height: auto; }

.kv-header__contacts { text-align: center; color: #fff; }
.kv-header__contacts p { margin: 0; }
.kv-header__contacts a { color: #fff; }
.kv-header__contacts a:hover { color: var(--kv-gold); }

.kv-contacts__mail { display: block; font-size: 18px; font-weight: 400; line-height: 1.5; }
.kv-contacts__phone { display: block; font-size: 26px; font-weight: 500; line-height: 1.3; }

/* Переключатель языков */
.kv-lang .mod-languages ul {
	display: flex;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Штатный стиль модуля подсвечивает активный язык серой заливкой — она здесь не нужна. */
.kv-lang div.mod-languages ul li,
.kv-lang div.mod-languages ul li.lang-active {
	margin: 0;
	padding: 0;
	background: none;
}

.kv-lang div.mod-languages a {
	display: block;
	padding: 2px 0;
	background: none;
	color: rgba(255, 255, 255, .6);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 1px;
	line-height: 1.4;
}

.kv-lang .mod-languages .lang-active a,
.kv-lang .mod-languages a:hover { color: #fff; }

.kv-lang .mod-languages .lang-active a { border-bottom: 1px solid var(--kv-gold); }

/* ---------- Боковое меню (offcanvas) ---------- */

.kv-offcanvas {
	width: 350px;
	background: #fff;
	color: #333;
	padding: 60px 40px 40px;
}

@media (max-width: 639px) {
	.kv-offcanvas { width: 100vw; }
}

.kv-offcanvas .uk-offcanvas-close { color: #333; }

.kv-offcanvas__nav ul { list-style: none; margin: 0; padding: 0; }

.kv-offcanvas__nav > .mod-menu > li > a,
.kv-offcanvas__nav > ul > li > a,
.kv-offcanvas__nav > ul > li > span {
	display: block;
	padding: 8px 0;
	color: #333;
	font-size: 18px;
	font-weight: 400;
}

.kv-offcanvas__nav li ul { padding: 0 0 8px 15px; }

.kv-offcanvas__nav li ul a,
.kv-offcanvas__nav li ul span {
	display: block;
	padding: 3px 0;
	color: var(--kv-muted);
	font-size: 14px;
}

.kv-offcanvas__nav a:hover,
.kv-offcanvas__nav .current > a,
.kv-offcanvas__nav .active > a { color: var(--kv-gold); }

.kv-offcanvas__contacts {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid #e5e5e5;
}

.kv-offcanvas__contacts a { color: #333; }
.kv-offcanvas__contacts .kv-contacts__mail { font-size: 15px; }
.kv-offcanvas__contacts .kv-contacts__phone { font-size: 20px; }

@media (min-width: 960px) {
	.kv-offcanvas__contacts { display: none; }
}

/* ---------- Внутренние страницы ---------- */

.kv-page { padding-top: 60px; padding-bottom: 80px; }

.kv-content .page-header h1,
.kv-content .page-header h2,
.kv-content > .com-content-article h1 { margin-top: 0; }

.kv-content ul:not([class]) { padding-left: 25px; }

.kv-content img { max-width: 100%; height: auto; }

/* Меню раздела справа */
.kv-sidebar .kv-module + .kv-module { margin-top: 40px; }

.kv-module__title {
	color: var(--kv-gold);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 15px;
}

.kv-sidebar ul { list-style: none; margin: 0; padding: 0; }
.kv-sidebar ul ul { padding: 2px 0 10px 15px; }

.kv-sidebar a,
.kv-sidebar .mod-menu__separator,
.kv-sidebar .mod-menu__heading {
	display: block;
	padding: 3px 0;
	color: var(--kv-muted);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.kv-sidebar a:hover,
.kv-sidebar .current > a,
.kv-sidebar .active > a { color: var(--kv-heading); }

/* Первый уровень меню раздела — золотой заголовок (как на старом сайте). */
.kv-sidebar .mod-menu > li > a,
.kv-sidebar .mod-menu > li > span {
	color: var(--kv-gold);
	font-size: 15px;
	letter-spacing: 2px;
	margin-bottom: 10px;
}

.kv-sidebar .mod-menu > li > a:hover,
.kv-sidebar .mod-menu > li.current > a { color: var(--kv-gold); }

.kv-sidebar .mod-menu > li > ul { padding-left: 12px; }

/* ---------- Подвал ---------- */

.kv-footer {
	padding: 50px 0 60px;
	color: var(--kv-footer);
	font-weight: 500;
}

.kv-footer .kv-footer__grid { border-top: 1px solid #ababab; padding-top: 50px; }

.kv-home .kv-footer { background: var(--kv-grey); }

.kv-footer p { margin: 0 0 12px; font-size: 16px; line-height: 1.5; }
.kv-footer img { display: block; margin-bottom: 20px; }

.kv-footer .kv-module__title {
	color: var(--kv-footer);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0;
	margin-bottom: 20px;
}

.kv-footer__menu ul { list-style: none; margin: 0; padding: 0; }

.kv-footer__menu a {
	display: block;
	padding: 5px 0;
	color: var(--kv-footer);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.kv-footer__menu a:hover,
.kv-footer__menu .current > a { color: var(--kv-gold); }

.kv-footer__contacts a { color: var(--kv-footer); }
.kv-footer__contacts a:hover { color: var(--kv-gold); }
.kv-footer__contacts .kv-footer__phone,
.kv-footer__contacts .kv-footer__mail { font-size: 19px; font-weight: 600; }

.kv-footer__credits p { font-size: 11px; font-weight: 400; }
.kv-footer__credits a { color: #333; font-weight: 500; }

@media (max-width: 639px) {
	.kv-footer { text-align: center; }
	.kv-footer img { margin-left: auto; margin-right: auto; }
	.kv-footer .kv-footer__grid { border-top: 0; padding-top: 20px; }
}

/* ---------- Галереи и эффекты ---------- */

.c-zoom { transition: transform .5s cubic-bezier(.4, 0, .4, 1); }

.c-zoom:hover {
	transform: scale(1.1);
	transition: transform .3s cubic-bezier(.2, 0, .4, 1);
	position: relative;
	z-index: 5;
}

/* ---------- Слайдер проектов: стрелки и плашка ---------- */

.kv-slidenav {
	background: var(--kv-overlay);
	color: #fff;
	padding: 38px 36px;
}

.kv-slidenav:hover,
.kv-slidenav:focus { background: var(--kv-overlay-strong); color: #fff; }

.kv-slidenav:active { background: var(--kv-overlay-strong); color: rgba(255, 255, 255, .7); }

.kv-overlay { background: var(--kv-overlay); color: rgba(255, 255, 255, .7); }
.kv-overlay .kv-overlay__meta { font-size: 16px; color: rgba(255, 255, 255, .8); margin: 0 0 10px; }
.kv-overlay .kv-overlay__title { color: #fff; font-size: 30px; font-weight: 600; margin: 0 0 30px; }

/*
 * Стрелки и плашка: при наведении мыши или по одиночному тапу на сенсоре.
 * pointer-events убирает клики по скрытой ссылке — иначе первый тап сразу
 * уводил бы на страницу проекта.
 */
.tap-reveal .kv-slidenav,
.tap-reveal .kv-overlay {
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s ease-in-out;
}

.tap-reveal:hover .kv-slidenav,
.tap-reveal:hover .kv-overlay,
.tap-reveal.is-tapped .kv-slidenav,
.tap-reveal.is-tapped .kv-overlay {
	opacity: 1;
	pointer-events: auto;
}

/* ---------- Адаптив (классы старого сайта) ---------- */

.m-ta-center { }

@media (max-width: 767px) {
	.m-hide { display: none !important; }
	.m-ta-center { text-align: center !important; }
}

@media (max-width: 960px) {
	.p-hide { display: none !important; }
}

@media (min-width: 1024px) {
	.t-hide { display: none !important; }
}

/* ======================= Главная ======================= */

.kv-hero {
	position: relative;
	min-height: 760px;
	display: flex;
	align-items: flex-end;
	background: #111;
}

.kv-hero__shade {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .52);
}

.kv-hero__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 40px;
	padding: calc(var(--kv-header-h) + 120px) 0 90px;
}

.kv-hero__title {
	max-width: 700px;
	margin: 0;
	color: #fff;
	font-size: 48px;
	line-height: 58px;
	font-weight: 300;
}

/* Карточка видеопрезентации */
.kv-video { position: relative; display: block; flex: none; width: 315px; }

.kv-video__card {
	display: block;
	position: relative;
	overflow: hidden;
	border-radius: 22px;
}

.kv-video__card img { display: block; width: 100%; height: auto; }

/* Блик, пробегающий по карточке при наведении. */
.kv-video__card::before {
	content: "";
	position: absolute;
	top: 0;
	left: -250px;
	width: 158px;
	height: 100%;
	background: rgba(255, 255, 255, .3);
	transform: skewX(-30deg);
	transition: left .8s;
}

.kv-video:hover .kv-video__card::before { left: 390px; }

.kv-video__play {
	position: absolute;
	left: -26px;
	bottom: 58px;
	width: 134px;
	height: auto;
}

@media (max-width: 959px) {
	.kv-hero { min-height: 560px; }
	.kv-hero__inner { flex-direction: column; align-items: flex-start; padding: calc(var(--kv-header-h) + 60px) 0 50px; }
	.kv-hero__title { font-size: 32px; line-height: 44px; }
	.kv-video { width: 260px; margin: 10px auto 0; }
	.kv-video__play { width: 100px; left: -18px; bottom: 44px; }
}

/* Секции главной */
.kv-section { padding: 80px 0; background-repeat: no-repeat; }

.kv-h2 {
	margin: 0 0 45px;
	color: #000;
	font-size: 50px;
	line-height: 1.05;
	font-weight: 300;
}

.kv-lead { font-size: 18px; line-height: 26px; color: #000; margin: 0 0 25px; }

@media (max-width: 767px) {
	.kv-section { padding: 50px 0; }
	.kv-h2 { font-size: 36px; margin-bottom: 30px; }
}

/* Реализованные проекты */
.kv-cases {
	background-color: var(--kv-grey);
	background-image: url(/images/site/bg-02.jpg);
	background-position: bottom center;
	background-size: cover;
}

.kv-cases__mark { display: inline-block; margin-bottom: 20px; }

.kv-case { display: block; color: inherit; text-decoration: none; }

.kv-case__stack { position: relative; display: block; max-width: 240px; margin: 0 auto; }

.kv-case__plate { display: block; width: 100%; height: auto; }

.kv-case__img {
	position: absolute;
	left: 50%;
	bottom: 32%;
	transform: translateX(-50%);
	height: auto;
}

.kv-case__img.c-zoom:hover { transform: translateX(-50%) scale(1.1); }

.kv-case__name {
	display: block;
	margin-top: 18px;
	color: #333;
	font-size: 30px;
	line-height: 1.3;
	font-weight: 300;
	text-transform: uppercase;
}

.kv-case:hover .kv-case__name { color: var(--kv-gold); }

@media (max-width: 767px) {
	.kv-case__name { font-size: 20px; }
}

/* Каталог */
.kv-catalog {
	background-image: url(/images/site/bg-04.jpg);
	background-position: center center;
	background-size: cover;
}

.kv-catalog__slider { margin-top: 30px; }

.kv-catalog__item { display: block; }

.kv-catalog__item img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
}

/* Стрелки карусели — полупрозрачные, как у галереи проектов. */
.kv-slider-nav {
	padding: 21px 18px;
	background: var(--kv-overlay);
	color: #fff;
}
.kv-slider-nav:hover,
.kv-slider-nav:focus { background: var(--kv-overlay-strong); color: #fff; }
.kv-slider-nav:active { background: var(--kv-overlay-strong); color: rgba(255, 255, 255, .7); }

/* О компании: фон с самолётом внизу секции */
.kv-about {
	background-image: url(/images/site/bg-03.jpg);
	background-position: bottom center;
	background-size: contain;
	padding-bottom: 46vw;
}

.kv-showcase { margin-top: -180px; }

.kv-showcase__nav { display: flex; }

.kv-about__text { max-width: 780px; margin: 90px auto 0; }

@media (max-width: 767px) {
	.kv-showcase { margin-top: -40px; }
	.kv-about { padding-bottom: 60vw; }
	.kv-about__text { margin-top: 50px; }
}

/* Форма «Заказать звонок» */
.kv-callback { max-width: 900px; }
.kv-callback__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kv-callback__note { margin-top: 10px; font-size: 14px; }
.kv-callback__note--ok { color: #2a7f3e; }
.kv-callback__note--error { color: #b3261e; }
.kv-callback .uk-button-large { border-radius: 500px; }

/* Карта сайта */
.kv-sitemap, .kv-sitemap ul { list-style: none; margin: 0; padding: 0; }
.kv-sitemap ul { padding: 4px 0 10px 20px; }
.kv-sitemap > li { padding: 6px 0; border-bottom: 1px solid #eee; }
.kv-sitemap > li > a { font-size: 18px; font-weight: 400; color: var(--kv-heading); }
.kv-sitemap ul a { font-size: 15px; color: var(--kv-muted); }
.kv-sitemap a:hover { color: var(--kv-gold); }

/* Карта на странице контактов */
.kv-map { max-width: 100%; }

/* Кнопка в окне заявки: одна строка, обычная высота */
.kv-callback .uk-button-large {
	line-height: 46px;
	padding: 0 28px;
	white-space: nowrap;
}

.kv-callback .uk-input.uk-form-large { height: 46px; }

/* ---- Широкие экраны: правка пропорций главной ---- */

/* Снизу каталога оставляем место: на него наезжает фото проектов. */
.kv-catalog { padding-bottom: 300px; }
.kv-showcase { margin-top: -220px; }

/*
 * Самолёт — фон секции «О компании». Без ограничения ширины на больших
 * экранах картинка растягивалась и давала лишнюю серую полосу за текстом.
 */
.kv-about {
	/* Фон самой картинки — #ededed, поэтому секция того же цвета: стык не виден. */
	background-color: var(--kv-grey);
	background-size: contain;
	padding-top: 40px;
	padding-bottom: 44vw;
}

@media (max-width: 1199px) {
	.kv-catalog { padding-bottom: 220px; }
	.kv-showcase { margin-top: -160px; }
	.kv-about { padding-bottom: 46vw; }
}

@media (max-width: 767px) {
	.kv-catalog { padding-bottom: 70px; }
	.kv-showcase { margin-top: -40px; }
	.kv-about { padding-bottom: 62vw; }
}

/* Кнопка в подвале — золотая, как везде (ссылки подвала серые, кнопка — нет). */
.kv-footer__contacts a.uk-button,
.kv-footer__contacts a.uk-button:hover { color: var(--kv-gold); }
.kv-footer__contacts a.uk-button:hover { color: var(--kv-heading); }

/* ---------- Меню-бургер: полупрозрачная панель на светлом фоне ---------- */
/* Класс kv-glass ставит скрипт перед открытием, если под панелью светлый однотонный фон. */
.kv-offcanvas { transition: background-color .25s ease; }

.kv-offcanvas.kv-glass {
	background: var(--kv-overlay);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: #fff;
}

.kv-offcanvas.kv-glass .uk-offcanvas-close,
.kv-offcanvas.kv-glass .kv-offcanvas__nav > .mod-menu > li > a,
.kv-offcanvas.kv-glass .kv-offcanvas__nav > ul > li > a,
.kv-offcanvas.kv-glass .kv-offcanvas__nav > ul > li > span,
.kv-offcanvas.kv-glass .kv-offcanvas__contacts a { color: #fff; }

.kv-offcanvas.kv-glass .kv-offcanvas__nav li ul a,
.kv-offcanvas.kv-glass .kv-offcanvas__nav li ul span { color: rgba(255, 255, 255, .7); }

.kv-offcanvas.kv-glass .kv-offcanvas__nav a:hover,
.kv-offcanvas.kv-glass .kv-offcanvas__nav .current > a,
.kv-offcanvas.kv-glass .kv-offcanvas__nav .active > a { color: var(--kv-gold); }

.kv-offcanvas.kv-glass .kv-offcanvas__contacts { border-top-color: rgba(255, 255, 255, .2); }