/* ─── BUTTONS ─── */
.mh__btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 14px 22px;
	font-family: var(--font-mh-body);
	font-weight: 600;
	font-size: var(--text-body-sm); /* 14px → token */
	letter-spacing: -0.003em;
	text-decoration: none;
	border: 1.5px solid var(--ink);
	cursor: pointer;
	transition: transform 150ms ease-out, background 150ms;
}
.mh__btn--primary {
	background: var(--ink);
	color: var(--paper);
}
.mh__btn--primary:hover { transform: translateY(var(--motion-lift-y-sm)); background: var(--color-ink-black); }
.mh__btn--ghost {
	background: transparent;
	color: var(--fg);
}
.mh__btn--ghost:hover { background: var(--ink); color: var(--paper); }
.mh__btn--accent {
	background: var(--accent);
	color: var(--paper);
	border-color: var(--accent);
}
.mh__btn--accent { color: var(--ink); }
.mh__btn--accent:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--ink); }
.mh__btn--lg { padding: 18px 26px; font-size: var(--text-body); }
.mh__btn-arr { font-family: var(--font-mh-mono); font-size: var(--text-body); /* 16px → token */ }

/* ─── Back-to-top — Mohawk square (round 10, 2026-05-23) ───
   Sharp-edged ink button с yellow accent stripe слева (как paper-card
   accent в Mohawk-системе). Концепция сайта = square edges, не круг.
   Появляется при scroll > 30%. Site-wide. */
.mh__back-to-top {
	position: fixed;
	right: 24px;
	/* iOS safe-area: ниже на home-indicator iPhone 14/15. На non-iOS 0px. */
	bottom: calc(28px + var(--safe-bottom));
	z-index: 45;
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-graphite-900);
	color: var(--color-yellow-500);
	border: 0;
	border-left: 3px solid var(--color-yellow-500); /* accent stripe — Mohawk pattern */
	border-radius: 0; /* sharp edges — Mohawk-style */
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity 180ms ease, visibility 0s linear 180ms, transform 180ms ease, background 160ms ease, color 160ms ease;
	box-shadow: 0 6px 18px rgba(var(--rgb-black), 0.22);
}
.mh__back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition: opacity 180ms ease, visibility 0s, transform 180ms ease, background 160ms ease, color 160ms ease;
}
.mh__back-to-top:hover,
.mh__back-to-top:focus-visible {
	background: var(--color-yellow-500);
	color: var(--color-graphite-900);
	border-left-color: var(--color-graphite-900);
	outline: none;
}
.mh__back-to-top-arrow {
	font-family: var(--font-mh-mono);
	font-size: var(--text-price); /* 22px → token */
	font-weight: 700;
	line-height: 1;
	transition: transform 240ms ease;
}
.mh__back-to-top:hover .mh__back-to-top-arrow,
.mh__back-to-top:focus-visible .mh__back-to-top-arrow {
	transform: translateY(var(--motion-lift-y-md));
}

/* Mobile compact + поднять над sticky price-bar на странице услуги */
@media (max-width: 640px) {
	.mh__back-to-top {
		right: 16px;
		/* iOS safe-area mobile: home-indicator iPhone 14/15. */
		bottom: calc(24px + var(--safe-bottom));
		width: 42px;
		height: 42px;
	}
	body.single-usluga .mh__back-to-top {
		/* над sticky price-bar калькулятора. Bar тоже учитывает safe-bottom
		   через _usluga-calc-magazine.css padding-bottom, поэтому 110px
		   остаётся базой, а safe-bottom добавляется тут поверх. */
		bottom: calc(110px + var(--safe-bottom));
	}
	.mh__back-to-top-arrow {
		font-size: var(--text-h3-sm); /* 18px → token */
	}
}

