/* Price page (/price/). Markup is generated by tools/price/build_price.py */
.sa-price {
	--sa-accent: #355a9f;
	--sa-dark: #302e33;
	--sa-text: #5f5d63;
	--sa-muted: #8c8a90;
	--sa-line: #e6e4e8;
	--sa-soft: #f7f6f8;
	--sa-hl: #ecebef;
	color: var(--sa-text);
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 0;
	text-align: left; /* #content is justified site-wide */
}
/* Price page only: tighten the gap before the "Наши координаты" block (was ~250px) */
#content:has(.sa-price) { padding-bottom: 0; }
#content:has(.sa-price) .page-item { padding-bottom: 0; }
#content:has(.sa-price) + #block_content_2 { margin-top: 48px; }
/* #wrapper has overflow:hidden, which breaks position:sticky; clip keeps the clipping */
#wrapper:has(.sa-price) { overflow: clip; }
.sa-price a { color: var(--sa-accent); }
.sa-price .sa-lead { max-width: 760px; margin: 0 auto 32px; text-align: center; }
.sa-price .sa-lead a, .sa-price .sa-foot a { white-space: nowrap; font-weight: 600; text-decoration: none; }

.sa-price .sa-h {
	color: var(--sa-dark);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
	margin: 48px 0 16px;
	text-transform: none;
	scroll-margin-top: 90px;
}

.sa-price > .sa-h:first-child { margin-top: 8px; }

/* Main service cards */
.sa-price .sa-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
.sa-price .sa-card {
	display: flex;
	flex-direction: column;
	padding: 20px;
	border: 1px solid var(--sa-line);
	border-top: 3px solid var(--sa-accent);
	background: #fff;
	text-decoration: none;
	color: var(--sa-text);
	transition: box-shadow .2s, transform .2s;
}
.sa-price .sa-card:hover { box-shadow: 0 6px 20px rgba(48, 46, 51, .12); transform: translateY(-2px); }
.sa-price .sa-card-name { color: var(--sa-dark); font-weight: 700; font-size: 17px; line-height: 1.3; }
.sa-price .sa-card-desc { flex: 1; margin: 8px 0 16px; font-size: 14px; color: var(--sa-muted); }
.sa-price .sa-card-price { color: var(--sa-accent); font-weight: 700; font-size: 22px; white-space: nowrap; }

/* Category legend */
.sa-price .sa-legend { margin: 32px 0 0; padding: 16px 20px; background: var(--sa-soft); font-size: 15px; }
.sa-price .sa-legend ul { margin: 8px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px 24px; }
.sa-price .sa-legend li span {
	display: inline-block; min-width: 22px; margin-right: 4px; text-align: center;
	background: var(--sa-dark); color: #fff; font-weight: 700; border-radius: 3px;
}

/* Section navigation */
.sa-price .sa-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 40px 0 0; }
.sa-price .sa-nav a {
	padding: 6px 14px; border: 1px solid var(--sa-line); border-radius: 18px;
	color: var(--sa-dark); font-size: 14px; text-decoration: none; line-height: 1.5;
}
.sa-price .sa-nav a:hover { border-color: var(--sa-accent); color: var(--sa-accent); }

/* Tables */
.sa-price .sa-table { width: 100%; border-collapse: collapse; margin: 0; font-size: 15px; background: #fff; }
.sa-price .sa-table th, .sa-price .sa-table td {
	padding: 10px 12px; border: 0; border-bottom: 1px solid var(--sa-line);
	line-height: 1.4; vertical-align: middle; background: none;
}
.sa-price .sa-table thead th {
	background: var(--sa-accent); color: #fff; font-weight: 600; font-size: 14px; text-align: left;
}
.sa-price .sa-table thead th.sa-name { text-align: left; }
/* Category header stays visible while scrolling; --sa-top = height of the fixed site header (set in base.html) */
.sa-price .sa-table thead th { position: sticky; top: var(--sa-top, 0px); z-index: 3; }
.sa-price .sa-table td.sa-name { color: var(--sa-dark); font-weight: 500; width: 40%; }
.sa-price .sa-table td.sa-name small { display: block; color: var(--sa-muted); font-size: 13px; font-weight: 400; }
.sa-price .sa-table td.sa-c { text-align: left; white-space: nowrap; color: var(--sa-dark); }
.sa-price .sa-table td.sa-all { color: var(--sa-dark); text-align: center; }
.sa-price .sa-table tbody tr:nth-child(even) td { background: var(--sa-soft); }
.sa-price .sa-table tbody tr.sa-main td.sa-name { font-weight: 700; }
.sa-price .sa-table tbody tr:target td,
.sa-price .sa-table tbody tr.sa-hl td { background: var(--sa-hl); transition: background 1s; }
@media (max-width: 767px) {
	.sa-price .sa-table tbody tr.sa-hl { background: var(--sa-hl); }
}
.sa-price .sa-table tbody tr { scroll-margin-top: 90px; }

.sa-price .sa-foot { margin: 32px 0 0; }

/* Note that replaces old price tables on service pages */
.sa-price-note {
	margin: 24px 0 40px; padding: 20px 24px; border-left: 3px solid #355a9f;
	background: #f7f6f8; color: #5f5d63; line-height: 1.5; text-align: left;
}
.sa-price-note p { margin: 0 0 12px; }
.sa-price-note a.sa-btn {
	display: inline-block; padding: 8px 22px; background: #355a9f; color: #fff;
	text-decoration: none; font-weight: 600; line-height: 1.5;
}
.sa-price-note a.sa-btn:hover { background: #302e33; }

@media (max-width: 991px) {
	.sa-price .sa-cards { grid-template-columns: repeat(2, 1fr); }
}

/* Phones: each table row becomes a card with a grid of prices */
@media (max-width: 767px) {
	.sa-price .sa-h { font-size: 20px; margin-top: 36px; }
	.sa-price .sa-card { padding: 16px; }
	.sa-price .sa-card-price { font-size: 21px; }
	.sa-price .sa-card-name { font-size: 18px; }
	.sa-price .sa-card-desc { font-size: 15px; }
	.sa-price .sa-nav a { font-size: 15px; }
	.sa-price, .sa-price .sa-foot { font-size: 17px; }
	.sa-price .sa-table, .sa-price .sa-table tbody { display: block; }
	.sa-price .sa-table thead { display: none; }
	.sa-price .sa-table tbody tr {
		display: grid; grid-template-columns: repeat(5, 1fr);
		border: 1px solid var(--sa-line); margin-bottom: 8px; background: #fff;
	}
	.sa-price .sa-table tbody tr td,
	.sa-price .sa-table tbody tr:nth-child(even) td { background: none; border: 0; }
	.sa-price .sa-table td.sa-name { grid-column: 1 / -1; width: auto; padding: 12px 12px 4px; font-size: 17px; }
	.sa-price .sa-table td.sa-name small { font-size: 14px; }
	.sa-price .sa-table td.sa-c {
		padding: 4px 4px 12px; font-size: 16px; white-space: normal; font-weight: 600;
	}
	.sa-price .sa-table td.sa-c::before {
		display: block; color: var(--sa-muted); font-size: 13px; font-weight: 400;
	}
	.sa-price .sa-table td.sa-c:nth-child(2)::before { content: "1 кат."; }
	.sa-price .sa-table td.sa-c:nth-child(3)::before { content: "2 кат."; }
	.sa-price .sa-table td.sa-c:nth-child(4)::before { content: "3 кат."; }
	.sa-price .sa-table td.sa-c:nth-child(5)::before { content: "4 кат."; }
	.sa-price .sa-table td.sa-c:nth-child(6)::before { content: "5 кат."; }
	.sa-price .sa-table td.sa-all { grid-column: 1 / -1; text-align: left; padding-left: 12px; font-size: 17px; }
	.sa-price .sa-table td.sa-all::before { content: "Все категории" !important; }
}
@media (max-width: 479px) {
	.sa-price .sa-cards { grid-template-columns: 1fr; }
	.sa-price .sa-table tbody tr { grid-template-columns: repeat(3, 1fr); }
}