/*
 * Внутрішні сторінки в стилі головної (головна — еталон, сюди не входить).
 *  1) нові блоки .abx-* (page.php, 404.php, нижній заклик cta-blog);
 *  2) єдиний вигляд «старих» hero інших шаблонів: заходять під прозору шапку,
 *     темно-синій фон зі світінням і сіткою, як hero головної й сторінок справ;
 *  3) заголовки секцій у старих шаблонах — та сама типографіка, що на головній.
 */
:root { --abx-navy: #0b1220; --abx-dark: #1E3A5F; --abx-primary: #2B4C7E; --abx-sky: #9cc0ee; --abx-ink: #0f172a; --abx-text: #475569; --abx-soft: #f5f7fb; --abx-line: #e3e9f1; }

/* ═════ 1. Нові блоки ═════ */
.abx-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
@media (min-width:640px) { .abx-wrap { padding: 0 1.5rem; } }
@media (min-width:1024px) { .abx-wrap { padding: 0 2rem; } }
.abx-wrap--narrow { max-width: 58rem; }
.abx-center { text-align: center; display: flex; flex-direction: column; align-items: center; }

.abx-hero { position: relative; isolation: isolate; overflow: hidden; margin-top: -5rem; padding: 8rem 0 3.5rem; color: #fff; }
@media (min-width:1024px) { .abx-hero { padding: 9rem 0 4.5rem; } }
.abx-crumbs { display: flex; flex-wrap: wrap; gap: .45rem; font-size: .82rem; color: rgba(226, 236, 250, .55); }
.abx-crumbs a { color: rgba(226, 236, 250, .78); text-decoration: none; }
.abx-crumbs a:hover { color: #fff; }
.abx-title { margin: 1.1rem 0 0; max-width: 24ch; font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.06; font-weight: 800; letter-spacing: -.028em; color: #fff; text-wrap: balance; }
.abx-lede { margin: 1rem 0 0; max-width: 44rem; font-size: clamp(1rem, 1.5vw, 1.15rem); line-height: 1.6; color: rgba(226, 236, 250, .8); }
.abx-404 { margin: 0; font-size: clamp(6rem, 18vw, 11rem); line-height: .9; font-weight: 800; letter-spacing: -.05em;
	background: linear-gradient(180deg, rgba(156, 192, 238, .55), rgba(156, 192, 238, .05)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.abx-hero--404 .abx-title { margin-top: .25rem; }
.abx-search { display: flex; width: 100%; max-width: 34rem; margin-top: 1.75rem; padding: .35rem; border-radius: 1rem; background: rgba(255, 255, 255, .08); border: 1px solid rgba(156, 192, 238, .25); }
.abx-search input { flex: 1; min-width: 0; padding: .75rem .9rem; border: 0; background: transparent; color: #fff; font: inherit; font-size: 1rem; }
.abx-search input::placeholder { color: rgba(226, 236, 250, .5); }
.abx-search input:focus { outline: none; }
.abx-search button { flex: none; padding: 0 1.25rem; border: 0; border-radius: .75rem; font: inherit; font-weight: 700; color: var(--abx-dark); background: #fff; cursor: pointer; }
.abx-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.4rem; }

.abx-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 50px; padding: .75rem 1.3rem; border-radius: .9rem; font: inherit; font-size: 1rem; font-weight: 700; white-space: nowrap; text-decoration: none; cursor: pointer; border: 1px solid transparent; transition: transform .2s, background-color .2s, border-color .2s; }
.abx-btn svg { width: 1.1rem; height: 1.1rem; }
.abx-btn:hover { transform: translateY(-2px); }
.abx-btn:focus-visible { outline: 3px solid var(--abx-sky); outline-offset: 3px; }
.abx-btn--light { color: var(--abx-dark) !important; background: #fff; box-shadow: 0 14px 30px -14px rgba(156, 192, 238, .6); }
.abx-btn--ghost { color: #fff !important; background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .26); }
.abx-btn--ghost:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .55); }

.abx-page { background: var(--abx-soft); padding: 3rem 0 4rem; }
.abx-paper { padding: 1.6rem 1.35rem; border-radius: 1.4rem; background: #fff; border: 1px solid #e6ecf4; box-shadow: 0 18px 40px -32px rgba(15, 23, 42, .35); }
@media (min-width:640px) { .abx-paper { padding: 2.5rem 2.75rem; } }

.abx-sec { background: var(--abx-soft); padding: 4rem 0; }
.abx-sec-head { margin-bottom: 2rem; }
.abx-kicker { display: flex; align-items: center; gap: 1rem; margin: 0 0 .9rem; font-size: .78rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--abx-primary); }
.abx-kicker::before { content: ""; width: 3rem; height: 1px; background: linear-gradient(90deg, transparent, currentColor); }
.abx-h2 { margin: 0; font-size: clamp(1.7rem, 3.6vw, 2.6rem); line-height: 1.1; font-weight: 800; letter-spacing: -.025em; color: var(--abx-ink); text-wrap: balance; }
.abx-links { display: grid; gap: .75rem; grid-template-columns: 1fr; }
@media (min-width:640px) { .abx-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width:1024px) { .abx-links { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.abx-link { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.1rem; border-radius: 1rem; background: #fff; border: 1px solid #e6ecf4; color: var(--abx-ink); font-weight: 700; text-decoration: none; transition: border-color .2s, transform .2s; }
.abx-link:hover { border-color: var(--abx-primary); transform: translateY(-2px); }
.abx-link-ico { flex: none; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: .75rem; color: #fff; background: linear-gradient(140deg, var(--abx-primary), var(--abx-dark)); }
.abx-link-ico svg { width: 1.25rem; height: 1.25rem; }
.abx-link-arr { width: 1rem; height: 1rem; margin-left: auto; color: var(--abx-primary); }

/* Нижній заклик */
.abx-cta { background: var(--abx-soft); padding: 3rem 0; }
.abx-cta-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
@media (min-width:640px) { .abx-cta-wrap { padding: 0 1.5rem; } }
@media (min-width:1024px) { .abx-cta-wrap { padding: 0 2rem; } }
.abx-cta-card { position: relative; overflow: hidden; isolation: isolate; display: grid; gap: 1.5rem; align-items: center; padding: 2rem 1.5rem; border-radius: 1.6rem; color: #fff;
	background: radial-gradient(40rem 20rem at 100% 0%, rgba(156, 192, 238, .3), transparent 60%), linear-gradient(135deg, var(--abx-dark), var(--abx-navy)); box-shadow: 0 40px 70px -40px rgba(11, 18, 32, .8); }
.abx-cta-card::after { content: ""; position: absolute; right: -8rem; top: 50%; width: 26rem; height: 26rem; margin-top: -13rem; z-index: -1; border-radius: 50%; border: 1px solid rgba(156, 192, 238, .14); box-shadow: 0 0 0 3rem rgba(156, 192, 238, .03), 0 0 0 6rem rgba(156, 192, 238, .025); }
@media (min-width:1024px) { .abx-cta-card { grid-template-columns: minmax(0, 1fr) auto; gap: 3rem; padding: 2.5rem 3rem; } }
.abx-cta-kicker { margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--abx-sky); }
.abx-cta-title { margin: .45rem 0 0; font-size: clamp(1.4rem, 2.4vw, 1.9rem); line-height: 1.2; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.abx-cta-lead { margin: .55rem 0 0; max-width: 38rem; font-size: .98rem; line-height: 1.55; color: rgba(226, 236, 250, .8); }
.abx-cta-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
@media (max-width:539.98px) { .abx-cta-actions { display: grid; grid-template-columns: 1fr 1fr; } .abx-cta-actions .abx-btn { padding-left: .7rem; padding-right: .7rem; font-size: .92rem; white-space: normal; } .abx-cta-actions .abx-btn--light { grid-column: 1 / -1; } }

/* ═════ 2. Спільний фон hero (нові й старі шаблони) ═════ */
.abx-hero, .abx-legacy-hero, .abpl-hero, .abp-blog .abp-hero, .abp-blog .abp-article-hero {
	background-color: var(--abx-navy) !important;
	background-image:
		radial-gradient(50rem 28rem at 12% 0%, rgba(43, 76, 126, .62), transparent 65%),
		radial-gradient(40rem 24rem at 100% 100%, rgba(43, 76, 126, .42), transparent 60%),
		linear-gradient(180deg, #0b1220 0%, #0e1a2e 100%) !important;
}
.abx-hero::after, .abx-legacy-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
	background-image: linear-gradient(rgba(156, 192, 238, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(156, 192, 238, .06) 1px, transparent 1px); background-size: 64px 64px;
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 30% 20%, #000, transparent 75%); mask-image: radial-gradient(ellipse 80% 70% at 30% 20%, #000, transparent 75%); }
.abx-legacy-hero { isolation: isolate; }

/* Старі hero заходять під прозору шапку */
.abx-legacy-hero { margin-top: -5rem; }
.abpl-hero { margin-top: -5rem; padding-top: 7.5rem !important; }
@media (min-width:640px) { .abpl-hero { padding-top: 8.25rem !important; } }
.abp-blog .abp-hero, .abp-blog .abp-article-hero { margin-top: -5rem; padding-top: 5rem; }

/* Типографіка заголовків у старих hero */
.abx-legacy-hero h1, .abpl-h1, .abp-blog .abp-hero h1, .abp-blog .abp-article-hero h1 { font-weight: 800 !important; letter-spacing: -.028em; line-height: 1.06 !important; text-wrap: balance; }
.abx-legacy-hero h1 { font-size: clamp(2.1rem, 4.8vw, 3.5rem) !important; }

/* ═════ 3. Заголовки секцій у старих шаблонах ═════ */
#main section:not(.abx-legacy-hero):not(.hx):not(.abs):not(.abc) > div > .text-center > h2,
#main section:not(.abx-legacy-hero):not(.hx):not(.abs):not(.abc) > div > .text-center > h3:first-child {
	font-weight: 800 !important; letter-spacing: -.025em; line-height: 1.1; font-size: clamp(1.8rem, 3.6vw, 2.6rem) !important; color: var(--abx-ink) !important; text-wrap: balance;
}
#main section:not(.abx-legacy-hero):not(.hx):not(.abs):not(.abc) > div > .text-center > h2::before {
	content: ""; display: block; width: 2.75rem; height: 3px; margin: 0 auto 1.1rem; border-radius: 3px; background: linear-gradient(90deg, var(--abx-primary), #7ea2d6);
}
/* Світлі секції старих шаблонів — одна нейтральна підкладка замість різнокольорових градієнтів */
#main > section.bg-gradient-to-br:not(.abx-legacy-hero) { background-image: none !important; background-color: var(--abx-soft) !important; }

/* ═════ 4. Блог (архів, рубрики, пошук, статті) — палітра головної ═════ */
.abp-blog { --abp-cream: #f5f7fb; --abp-cream-2: #eef2f8; --abp-line: #e3e9f1; --abp-line-2: #e8edf4; --abp-navy-800: #0b1220; --abp-navy-900: #0b1220; }
body:not(.home) .abp-blog { background: #f5f7fb; }
/* Непарна остання картка горизонтальна: картинка не наїжджає на текст */
.abp-blog .abp-grid.with-sidebar .abp-grid-cards > a.abp-card:last-child:nth-child(odd) .abp-thumb { overflow: hidden !important; min-width: 0; position: relative; }
.abp-blog .abp-grid.with-sidebar .abp-grid-cards > a.abp-card:last-child:nth-child(odd) .abp-thumb img { position: absolute; inset: 0; max-width: 100%; }
@media (max-width: 760px) { .abp-blog .abp-grid.with-sidebar .abp-grid-cards > a.abp-card:last-child:nth-child(odd) .abp-thumb { aspect-ratio: 16 / 9; } }
@media (min-width: 761px) { .abp-blog .abp-grid.with-sidebar .abp-grid-cards > a.abp-card:last-child:nth-child(odd) .abp-thumb { aspect-ratio: auto !important; width: auto !important; } }

/* Сторінка послуги: картки «Наші спеціалізації» — одна фірмова іконка, текст ліворуч */
.abx-spec [class*="bg-gradient-to-br"] { background-image: linear-gradient(140deg, #2B4C7E, #1E3A5F) !important; box-shadow: 0 12px 24px -12px rgba(30, 58, 95, .7) !important; }
.abx-spec h3 { text-align: left !important; min-height: 0 !important; }
.abx-spec .flex.justify-center { justify-content: flex-start !important; }
.abx-spec { border-radius: 1.4rem !important; box-shadow: 0 18px 40px -30px rgba(15, 23, 42, .4) !important; }

/* Візуальні хлібні крихти не показуємо ніде (рішення власника); BreadcrumbList для пошуку — Rank Math */
.abp-crumbs, .acs-crumbs, .abx-crumbs, .rank-math-breadcrumb { display: none !important; }

/* ═════ 5. Стаття блогу: сітка як на інших сторінках (80rem), ширший текст ═════ */
body .abp-blog .abp-article-hero .abp-container, body .abp-blog .abp-article-layout, body .abp-blog .abp-article-tail { max-width: 80rem; padding-left: 2rem; padding-right: 2rem; }
body .abp-blog .abp-article-hero-inner { max-width: none; margin: 0; padding: 3rem 0 3.75rem; }
body .abp-blog .abp-article-hero h1 { max-width: 24ch; font-size: clamp(2rem, 4.2vw, 3.2rem) !important; }
body .abp-blog .abp-article-hero .abp-lede { max-width: 46rem; }
body .abp-blog .abp-article-layout { grid-template-columns: minmax(0, 1fr) 20rem; gap: 2.5rem; padding-top: 3rem; }
body .abp-blog .abp-share-rail { display: none; }
body .abp-blog .abp-article-card { padding: 2.75rem 3rem; border-radius: 1.4rem; border: 1px solid #e6ecf4; box-shadow: 0 18px 40px -32px rgba(15, 23, 42, .35); }
body .abp-blog .abp-article-content { font-size: 1.06rem; line-height: 1.75; color: #334155; }
body .abp-blog .abp-article-content p:first-of-type { font-size: 1.15rem; color: #1e293b; }
body .abp-blog .abp-article-content h2 { margin: 2.6rem 0 1rem; padding-top: 1.8rem; border-top: 1px solid #edf1f6; font-size: clamp(1.4rem, 2.4vw, 1.75rem); line-height: 1.2; font-weight: 800; letter-spacing: -.015em; color: #0f172a; scroll-margin-top: 6rem; }
body .abp-blog .abp-article-card > h2:first-child, body .abp-blog .abp-article-content h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
body .abp-blog .abp-article-content h3 { font-size: 1.2rem; font-weight: 800; color: #0f172a; }
body .abp-blog .abp-article-content ul { list-style: none; padding: 0; margin: 0 0 1.4rem; display: grid; gap: .55rem; }
body .abp-blog .abp-article-content ul li { position: relative; margin: 0; padding: .7rem .9rem .7rem 2.3rem; border-radius: .8rem; background: #f5f7fb; border: 1px solid #edf1f6; }
body .abp-blog .abp-article-content ul li::before { content: ""; position: absolute; left: .95rem; top: 1.2rem; width: .5rem; height: .5rem; border-radius: 2px; transform: rotate(45deg); background: linear-gradient(135deg, #2B4C7E, #9cc0ee); }
body .abp-blog .abp-article-content blockquote { border-left: 3px solid #2B4C7E; border-radius: 0 1rem 1rem 0; background: #f5f7fb; }
body .abp-blog .abp-article-content table { width: 100%; border-collapse: collapse; font-size: .95rem; }
body .abp-blog .abp-article-content th, body .abp-blog .abp-article-content td { padding: .7rem .85rem; border: 1px solid #e3e9f1; vertical-align: top; text-align: left; }
body .abp-blog .abp-article-content th { background: #f5f7fb; color: #0f172a; }
body .abp-blog .abp-toc { border-radius: 1.2rem; border: 1px solid #e6ecf4; }
@media (max-width: 1024px) {
	body .abp-blog .abp-article-layout { grid-template-columns: minmax(0, 1fr); }
	body .abp-blog .abp-article-card { padding: 2rem 1.6rem; }
}
@media (max-width: 640px) {
	body .abp-blog .abp-article-hero .abp-container, body .abp-blog .abp-article-layout, body .abp-blog .abp-article-tail { padding-left: 1rem; padding-right: 1rem; }
	body .abp-blog .abp-article-card { padding: 1.5rem 1.15rem; }
	body .abp-blog .abp-article-content { font-size: 1rem; }
}
body .abp-blog .abp-article-content .abp-inline-cta h3, body .abp-blog .abp-inline-cta h3 { color: #fff !important; border: 0; padding: 0; }
body .abp-blog .abp-toc-wrap { position: sticky; top: 6rem; align-self: start; }