/* Piknikovich - footer.css
   Подвал сайта и пре-футер перелинковки «Каталог по городам и районам».
   Перенос эталона дизайн-системы: components/navigation/SiteFooter.jsx,
   ui_kits/website/HomeSeo.jsx (PreFooterLinks / QuietLink),
   ui_kits/website/HomeMobile.jsx (мобильные аккордеоны).

   Зона подвала держится в отдельном файле, а не в layout.css: шапка и
   подвал переносятся разными окнами, общий файл они бы делили с гонкой.
   Старые правила .pk-footer* из layout.css удалены этим же переносом.

   Разметка: footer.php. Данные: inc/footer-links.php.
   Загрузка: functions.php -> piknikovich_scripts(), версия по filemtime.

   Порядок в файле: пре-футер -> подвал -> адаптив (<=1200, <=900).
   ================================================================ */

/* ================================================================
   ПРЕ-ФУТЕР «Каталог по городам и районам»
   Кремовая полноширинная полоса над подвалом. Навигационный блок,
   поэтому заголовок полосы и шапки колонок - не h-теги.
   ================================================================ */
.pk-prefooter {
	position: relative;
	overflow: hidden;
	background: var(--pk-cream);
	/* Ритм секций эталона - Band в Polish.jsx: 48px сверху и снизу,
	   то есть 96px между соседними полосами. Пре-футер - такая же полоса. */
	padding: 48px 0;
	font-family: var(--pk-font-sans);
}
.pk-front .pk-prefooter__title {
	margin: 0 0 28px;
	font-size: var(--fs-h2-seo, 24px);
	font-weight: var(--fw-semibold);
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--pk-text);
}
/* auto-fit: колонка нового города встаёт сама, при нехватке ширины ряд
   переносится. Ничего не настраивается руками при запуске региона. */
.pk-prefooter__grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 26px 32px;
}
.pk-prefooter__col > summary::-webkit-details-marker { display: none; }
.pk-prefooter__head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(29, 37, 48, 0.10);
	font-size: var(--fs-ui-xs);
	font-weight: var(--fw-bold);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pk-green);
	list-style: none;
	cursor: default;
}
/* Зелёная засечка перед названием города. */
.pk-prefooter__head::before {
	content: "";
	flex: none;
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: var(--pk-green);
}
.pk-prefooter__head-text { min-width: 0; }
.pk-prefooter__chev { display: none; }
.pk-front .pk-prefooter .pk-prefooter__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
/* base.css добавляет li + li отступ на внутренних страницах, а подвал
   должен быть одинаковым на главной и внутри, гасим. */
.pk-front .pk-prefooter .pk-prefooter__list li + li { margin-top: 0; }

/* Тихая ссылка со счётчиком - QuietLink из эталона. */
.pk-front .pk-prefooter .pk-quiet-link {
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	font-size: var(--fs-ui-sm);
	line-height: 1.45;
	color: var(--pk-muted);
	text-decoration: none;
	transition: color var(--dur-base) ease;
}
.pk-front .pk-prefooter .pk-quiet-link:hover,
.pk-front .pk-prefooter .pk-quiet-link:focus-visible { color: var(--pk-green-dark); }
.pk-quiet-link__count {
	font-size: var(--fs-ui-xs);
	color: rgba(92, 103, 117, 0.7);
	transition: color var(--dur-base) ease;
}
.pk-front .pk-prefooter .pk-quiet-link:hover .pk-quiet-link__count,
.pk-front .pk-prefooter .pk-quiet-link:focus-visible .pk-quiet-link__count { color: var(--pk-green); }

/* ================================================================
   ПОДВАЛ
   ================================================================ */
.pk-footer {
	position: relative;
	/* Кремовая земля вместо белого листа: подвал отделяется от контента
	   тоном, а не только волосяной линией. */
	background: linear-gradient(180deg, #fff 0%, var(--pk-bg-soft) 34%, var(--pk-bg-soft) 100%);
	padding: 60px 0 26px;
	margin-top: 72px;
	font-family: var(--pk-font-sans);
}
/* Пре-футер уже отбил подвал от контента, своего отступа не нужно. */
.pk-footer--tight { margin-top: 0; }
/* Фирменная кромка: зелёный уходит в янтарь и гаснет к правому краю. */
.pk-footer::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--pk-green-deep) 0%, var(--pk-green) 32%, rgba(242, 167, 59, 0.85) 62%, rgba(242, 167, 59, 0) 100%);
}
.pk-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr 1.3fr;
	gap: 34px;
}

/* ---- Бренд-блок ---- */
.pk-footer__brand {
	position: relative;
	padding-right: 24px;
}
/* Вертикальная линия с затуханием: отделяет бренд-блок от колонок. */
.pk-footer__brand::after {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 6px;
	right: 0;
	width: 1px;
	background: linear-gradient(180deg, rgba(37, 95, 56, 0) 0%, rgba(37, 95, 56, 0.16) 22%, rgba(37, 95, 56, 0.16) 74%, rgba(37, 95, 56, 0) 100%);
}
.pk-footer__logo {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}
.pk-footer__logo img { height: 62px; width: auto; display: block; }
.pk-footer__logo-text {
	display: flex;
	flex-direction: column;
	line-height: 1.08;
}
.pk-footer__logo-title {
	font-size: 24px;
	font-weight: var(--fw-black);
	color: var(--pk-main);
	letter-spacing: -0.02em;
}
.pk-footer__logo-sub { font-size: var(--fs-ui-xs); color: var(--pk-muted); }
.pk-front .pk-footer__about {
	margin: 18px 0 20px;
	max-width: 280px;
	font-size: var(--fs-body);
	line-height: 1.55;
	color: var(--pk-muted);
}
.pk-footer__socials { display: flex; gap: 10px; }
.pk-front .pk-footer .pk-footer__social {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	color: var(--pk-green-dark);
	text-decoration: none;
	box-shadow: inset 0 0 0 1px rgba(37, 95, 56, 0.18), 0 1px 2px rgba(16, 24, 40, 0.05);
	transition: background var(--dur-base) ease, color var(--dur-base) ease, transform var(--dur-base) ease, box-shadow var(--dur-base) ease;
}
.pk-front .pk-footer .pk-footer__social:hover,
.pk-front .pk-footer .pk-footer__social:focus-visible {
	background: var(--pk-green-dark);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--e-green-soft);
}

/* ---- Колонки ссылок ---- */
.pk-footer__col > summary::-webkit-details-marker { display: none; }
.pk-footer__head {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin: 0 0 14px;
	padding-bottom: 11px;
	font-size: var(--fs-ui-xs);
	font-weight: var(--fw-bold);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pk-green-dark);
	list-style: none;
	cursor: default;
}
/* Линия под заголовком колонки гаснет вправо: шапка читается как акцент,
   а не как граница таблицы. */
.pk-footer__head::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: linear-gradient(90deg, var(--pk-green) 0%, rgba(37, 95, 56, 0.22) 34%, rgba(37, 95, 56, 0) 100%);
}
.pk-footer__head-text { min-width: 0; }
.pk-footer__chev { display: none; }
.pk-front .pk-footer .pk-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 9px;
}
.pk-front .pk-footer .pk-footer__list li + li { margin-top: 0; }
.pk-front .pk-footer .pk-footer__list a {
	font-size: var(--fs-ui-sm);
	line-height: 1.45;
	color: var(--pk-muted);
	text-decoration: none;
	transition: color var(--dur-base) ease;
}
.pk-front .pk-footer .pk-footer__list a:hover,
.pk-front .pk-footer .pk-footer__list a:focus-visible { color: var(--pk-green-dark); }

/* ---- Карточка «Мы на связи» ---- */
.pk-footer__card {
	position: relative;
	overflow: hidden;
	padding: 18px 20px 20px;
	border-radius: var(--pk-radius);
	background: #fff;
	box-shadow: inset 0 0 0 1px rgba(37, 95, 56, 0.10), 0 1px 2px rgba(16, 24, 40, 0.04), 0 14px 30px -18px rgba(16, 24, 40, 0.22);
}
/* Тёплый отблеск в верхнем правом углу карточки связи. */
.pk-footer__card::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(120px 84px at 100% 0%, rgba(242, 167, 59, 0.13), rgba(242, 167, 59, 0) 72%);
}
.pk-footer__card-rows {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.pk-front .pk-footer .pk-footer__contact-row {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: var(--fs-body);
	font-weight: var(--fw-semibold);
	color: var(--pk-text);
	text-decoration: none;
	transition: color var(--dur-base) ease;
}
.pk-footer__contact-row svg { flex: none; color: var(--pk-green); }
.pk-front .pk-footer .pk-footer__contact-row:hover,
.pk-front .pk-footer .pk-footer__contact-row:focus-visible { color: var(--pk-green-dark); }
.pk-front .pk-footer__card-note {
	position: relative;
	margin: 14px 0;
	padding-top: 12px;
	border-top: 1px solid var(--pk-border);
	font-size: var(--fs-ui-xs);
	line-height: 1.5;
	color: var(--pk-muted);
}
.pk-front .pk-footer .pk-footer__card-btn {
	position: relative;
	gap: 6px;
	/* .pk-btn--sm в теме скругляется на 10px, в эталоне кнопка карточки
	   связи остаётся пилюлей. Правим точечно, общий компонент не трогаем. */
	border-radius: var(--pk-radius-pill);
	/* Явный цвет: base.css гасит цвет посещённых ссылок до inherit. */
	color: var(--pk-text);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 8px 18px -12px rgba(37, 95, 56, 0.45);
}
.pk-front .pk-footer .pk-footer__card-btn:hover,
.pk-front .pk-footer .pk-footer__card-btn:focus-visible { color: var(--pk-green); }

/* ---- Правовая строка ---- */
.pk-footer__bottom {
	position: relative;
	margin-top: 42px;
	padding-top: 22px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
	font-size: var(--fs-ui-xs);
	color: var(--pk-muted);
}
/* Линия правовой строки гаснет к обоим краям. */
.pk-footer__bottom::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, rgba(37, 95, 56, 0) 0%, rgba(37, 95, 56, 0.16) 18%, rgba(37, 95, 56, 0.16) 82%, rgba(37, 95, 56, 0) 100%);
}
/* Пять документов (legal-01): строка переносится, на планшете уходит
   под копирайт и прижимается вправо, размер и цвет ссылок прежние. */
.pk-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px 24px;
}
.pk-front .pk-footer .pk-footer__legal a {
	font-size: var(--fs-ui-xs);
	color: var(--pk-muted);
	text-decoration: none;
	transition: color var(--dur-base) ease;
}
.pk-front .pk-footer .pk-footer__legal a:hover,
.pk-front .pk-footer .pk-footer__legal a:focus-visible { color: var(--pk-green-dark); }

/* ================================================================
   АДАПТИВ
   ================================================================ */

/* На десктопе колонка не складывается: <details> нужен только мобильному
   аккордеону, и клик по шапке не должен схлопывать столбец. Мышь глушим
   здесь, клавиатуру - в assets/js/footer.js. */
@media (min-width: 901px) {
	.pk-footer__head,
	.pk-prefooter__head { pointer-events: none; }
}

/* Промежуточная ширина: бренд + три колонки в ряд, карточка связи
   уходит на вторую строку. */
@media (max-width: 1200px) {
	.pk-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
	.pk-footer__contact { grid-column: 2 / -1; max-width: 420px; }
}

/* Мобильная раскладка по эталону HomeMobile.jsx: стопка, карточка связи
   сразу под бренд-блоком, колонки ссылок и города пре-футера -
   аккордеоны (первый раскрыт), тап-цели 44px. */
@media (max-width: 900px) {
	/* --- пре-футер --- */
	.pk-prefooter { padding: 32px 0; }
	.pk-front .pk-prefooter__title {
		margin: 0 0 16px;
		font-size: 18px;
		font-weight: var(--fw-bold);
		letter-spacing: -0.015em;
	}
	.pk-prefooter__grid { grid-template-columns: 1fr; gap: 0; }
	.pk-prefooter__col { border-bottom: 1px solid rgba(29, 37, 48, 0.09); }
	.pk-prefooter__head {
		justify-content: space-between;
		min-height: 48px;
		margin: 0;
		padding: 12px 0;
		border-bottom: 0;
		font-size: 12px;
		letter-spacing: 0.05em;
		color: var(--pk-green-dark);
		cursor: pointer;
	}
	.pk-prefooter__head::before { display: none; }
	.pk-prefooter__head-text { flex: 1; }
	.pk-prefooter__chev {
		display: inline-flex;
		flex: none;
		color: var(--pk-green);
		transition: transform var(--dur-base) var(--ease-entrance);
	}
	.pk-prefooter__col[open] > .pk-prefooter__head .pk-prefooter__chev { transform: rotate(90deg); }
	.pk-front .pk-prefooter .pk-prefooter__list { padding: 0 0 6px; gap: 0; }
	.pk-front .pk-prefooter .pk-quiet-link {
		display: flex;
		align-items: center;
		min-height: 44px;
	}

	/* --- подвал --- */
	.pk-footer { padding: 32px 0 24px; }
	.pk-footer__grid { grid-template-columns: 1fr; gap: 0; }
	.pk-footer__brand { order: 1; padding-right: 0; margin-bottom: 22px; }
	.pk-footer__brand::after { display: none; }
	.pk-footer__contact { order: 2; grid-column: auto; max-width: none; margin-bottom: 6px; }
	.pk-footer__col { order: 3; }
	.pk-footer__logo img { height: 54px; }
	.pk-footer__logo-title { font-size: 22px; }
	.pk-front .pk-footer__about { margin: 16px 0 18px; max-width: none; }
	.pk-front .pk-footer .pk-footer__social { width: 44px; height: 44px; }

	.pk-footer__head {
		min-height: 48px;
		margin: 0;
		padding: 12px 0;
		cursor: pointer;
	}
	.pk-footer__head--static { cursor: default; margin-bottom: 4px; }
	.pk-footer__chev {
		display: inline-flex;
		flex: none;
		color: var(--pk-green);
		transition: transform var(--dur-base) var(--ease-entrance);
	}
	.pk-footer__col[open] > .pk-footer__head .pk-footer__chev { transform: rotate(90deg); }
	.pk-front .pk-footer .pk-footer__list { padding: 6px 0 10px; gap: 0; }
	.pk-front .pk-footer .pk-footer__list a {
		display: flex;
		align-items: center;
		min-height: 44px;
	}
	.pk-front .pk-footer .pk-footer__contact-row { min-height: 44px; }
	.pk-footer__card-btn { width: 100%; }

	/* Правовая строка: сперва документы столбиком с тап-целями 44px,
	   под ними - копирайт с волосяной линией. */
	.pk-footer__bottom {
		flex-direction: column;
		gap: 0;
		margin-top: 14px;
		padding-top: 0;
	}
	.pk-footer__bottom::before { display: none; }
	.pk-footer__legal { order: 1; flex-direction: column; gap: 0; }
	.pk-front .pk-footer .pk-footer__legal a {
		display: flex;
		align-items: center;
		min-height: 44px;
	}
	.pk-footer__copy {
		order: 2;
		position: relative;
		margin-top: 14px;
		padding-top: 18px;
		line-height: 1.6;
	}
	.pk-footer__copy::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 1px;
		background: linear-gradient(90deg, rgba(37, 95, 56, 0) 0%, rgba(37, 95, 56, 0.16) 18%, rgba(37, 95, 56, 0.16) 82%, rgba(37, 95, 56, 0) 100%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.pk-footer__chev,
	.pk-prefooter__chev { transition: none; }
}