/* Іконка-стрілка кнопки тепер inline-SVG (currentColor) замість <img> —
   відтворюємо ту саму логіку кольору/інверсії, що була у верстці. */
.btn__circle svg { width: 26px; height: 26px; }

.btn .btn__circle svg,
.btn--dark .btn__circle svg { color: #000; }
.btn:hover .btn__circle svg,
.btn--dark:hover .btn__circle svg { color: #fff; }

.btn--light .btn__circle svg,
.btn--light:hover .btn__circle svg { color: #fff; }

/* Легальні спливаючі вікна (Privacy Policy / Terms of Use) */
.legal-modal {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(3, 8, 9, 0.78);
}
.legal-modal.is-open { display: flex; }
.legal-modal__card {
	position: relative;
	width: 100%;
	max-width: 720px;
	max-height: 82vh;
	overflow-y: auto;
	padding: 48px 40px;
	border-radius: var(--r-lg);
	background: var(--bg-panel-2);
	box-shadow: inset 0 0 0 1px rgba(0, 255, 245, 0.2), 0 24px 60px rgba(0, 0, 0, 0.5);
}
.legal-modal__close {
	position: absolute;
	top: 18px;
	right: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	cursor: pointer;
}
.legal-modal__close svg { width: 18px; height: 18px; }
.legal-modal__title { font-weight: 800; font-size: 26px; margin-bottom: 20px; }
.legal-modal__body { font-weight: 300; font-size: 16px; line-height: 1.6; opacity: 0.9; }
.legal-modal__body p { margin: 0 0 16px; }
.legal-modal__body a { text-decoration: underline; }

/* Кнопки, оформлені як посилання у футері (Privacy/Terms).
   Важливо: у footer.php ці елементи — <button>, а не <a>, тому правило
   ".footer__legal a" з frontend.css їх не зачіпає — колір/підкреслення
   задаємо тут окремо (світлий колір замість дефолтного темного кольору кнопки браузера). */
.footer__legal button.link-as-a {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
	font-weight: 500;
	font-size: 16px;
	color: rgb(181, 229, 249);
	opacity: 0.7;
	text-decoration: underline;
	text-decoration-color: rgba(181, 229, 249, 0.4);
	transition: color 0.2s ease, opacity 0.2s ease;
}
.footer__legal button.link-as-a:hover {
	color: var(--accent);
	opacity: 1;
}

/* Про нас — марквee з непарною кількістю картинок теж мають виглядати добре */
.marquee__track img { object-fit: cover; }

/* flex-wrap fallback для карток тарифів, якщо адмін додав більше 3 */
.pricing__grid { flex-wrap: wrap; }

/* Rich-text поля (About text, Service area bubble text) */
.lead p,
.area__bubble p.rich-p { margin: 0 0 16px; }
.lead p:last-child,
.area__bubble p.rich-p:last-child { margin-bottom: 0; }