/* Главная www (www/html/main.php подключает этот файл сама),
   поэтому цвета Bootstrap (ссылки, кнопки, фокус) переопределены для всей страницы. */
:root,
[data-bs-theme=light] {
	--lp-accent: #4fd1c5;
	--lp-accent-hover: #38b2a6;
	--lp-accent-text: #0f766e;
	--lp-accent-rgb: 79, 209, 197;
	--bs-link-color: #0f766e;
	--bs-link-color-rgb: 15, 118, 110;
	--bs-link-hover-color: #115e59;
	--bs-link-hover-color-rgb: 17, 94, 89;
}
[data-bs-theme=dark] {
	--lp-accent-text: #4fd1c5;
	--bs-link-color: #4fd1c5;
	--bs-link-color-rgb: 79, 209, 197;
	--bs-link-hover-color: #81e6d9;
	--bs-link-hover-color-rgb: 129, 230, 217;
}

.btn-primary {
	--bs-btn-color: #0b0d10;
	--bs-btn-bg: var(--lp-accent);
	--bs-btn-border-color: var(--lp-accent);
	--bs-btn-hover-color: #0b0d10;
	--bs-btn-hover-bg: var(--lp-accent-hover);
	--bs-btn-hover-border-color: var(--lp-accent-hover);
	--bs-btn-focus-shadow-rgb: var(--lp-accent-rgb);
	--bs-btn-active-color: #0b0d10;
	--bs-btn-active-bg: var(--lp-accent-hover);
	--bs-btn-active-border-color: var(--lp-accent-hover);
	--bs-btn-disabled-color: #0b0d10;
	--bs-btn-disabled-bg: var(--lp-accent);
	--bs-btn-disabled-border-color: var(--lp-accent);
	font-weight: 600;
}
.btn-outline-primary {
	--bs-btn-color: var(--lp-accent-text);
	--bs-btn-border-color: var(--lp-accent-text);
	--bs-btn-hover-color: #0b0d10;
	--bs-btn-hover-bg: var(--lp-accent);
	--bs-btn-hover-border-color: var(--lp-accent);
	--bs-btn-focus-shadow-rgb: var(--lp-accent-rgb);
	--bs-btn-active-color: #0b0d10;
	--bs-btn-active-bg: var(--lp-accent-hover);
	--bs-btn-active-border-color: var(--lp-accent-hover);
	font-weight: 500;
}
.form-control:focus,
.form-select:focus {
	border-color: var(--lp-accent);
	box-shadow: 0 0 0 .25rem rgba(var(--lp-accent-rgb), .25);
}
.accordion {
	--bs-accordion-active-color: var(--lp-accent-text);
	--bs-accordion-active-bg: rgba(var(--lp-accent-rgb), .1);
	--bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(var(--lp-accent-rgb), .25);
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230f766e' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}
[data-bs-theme=dark] .accordion-button::after {
	--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%234fd1c5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}

.lp {
	margin-bottom: 0;
	border: 0;
	box-shadow: none;
}

.lp section { scroll-margin-top: 3.5em; }

.lp-hero {
	color: #fff;
	background:
		radial-gradient(60rem 30rem at 85% 40%, rgba(79, 209, 197, .18), transparent 60%),
		radial-gradient(40rem 25rem at 10% 100%, rgba(167, 139, 250, .15), transparent 60%),
		#0b0d10;
}
.lp-badge {
	color: var(--lp-accent);
	background: rgba(79, 209, 197, .12);
	border: 1px solid rgba(79, 209, 197, .35);
	font-weight: 500;
}

/* макеты часов */
.lp-watches {
	display: flex;
	justify-content: center;
	align-items: center;
}
.lp-watch {
	width: 38%;
	max-width: 220px;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	filter: drop-shadow(0 1.5rem 2rem rgba(0, 0, 0, .6));
}
.lp-watch:nth-child(1) { transform: translateX(18%) scale(.82) rotate(-8deg); opacity: .85; }
.lp-watch:nth-child(2) { position: relative; z-index: 1; }
.lp-watch:nth-child(3) { transform: translateX(-18%) scale(.82) rotate(8deg); opacity: .85; }
.lp-watch .lp-case { fill: #2b2f35; stroke: #4a5058; stroke-width: 2; }
.lp-watch .lp-strap { fill: #17191c; }

.lp-alt { background: var(--bs-tertiary-bg); }

.lp-step-num {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-weight: 700;
	color: #0b0d10;
	background: var(--lp-accent);
}

.lp-icon {
	width: 2.75rem;
	height: 2.75rem;
	border-radius: .75rem;
	display: grid;
	place-items: center;
	color: var(--lp-accent-text);
	background: rgba(var(--lp-accent-rgb), .14);
}

.lp-checks li {
	position: relative;
	padding-left: 1.75rem;
	margin-bottom: .5rem;
}
.lp-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .45em;
	width: .9rem;
	height: .5rem;
	border-left: 2px solid var(--lp-accent-text);
	border-bottom: 2px solid var(--lp-accent-text);
	transform: rotate(-45deg);
}

.lp-list li { margin-bottom: .5rem; }
.lp-cols { columns: 2 20rem; column-gap: 2rem; }
.lp-cols li { break-inside: avoid; }

.lp-counter {
	background: var(--bs-tertiary-bg);
	border: 1px solid var(--bs-border-color);
}

/* honeypot для ботов */
.lp-hp { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }

@media (max-width: 575.98px) {
	.lp-watch { width: 46%; }
	.lp-watch:nth-child(3) { display: none; }
	.lp-watch:nth-child(1) { transform: translateX(8%) scale(.85) rotate(-6deg); }
}

/* надпись над заголовком раздела: для кого этот раздел */
.lp-eyebrow {
	margin-bottom: .5rem;
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--lp-accent-text);
}