/* Компоненти: мобільна панель, модалка, поля CF7, фокус. Bootstrap дає поведінку й базовий вигляд — тут лише мова дизайну верстки. */

/* Пропуск навігації: видимий тільки у фокусі */
.ge-skip-link { position: absolute; left: -9999px; top: 0; z-index: 2000; background: var(--bgColor4); color: var(--fontColor1); font-weight: 700; padding: 12px 18px; border-radius: 0 0 6px 0; text-decoration: none; }
.ge-skip-link:focus { left: 0; }

/* Видимий фокус на всьому інтерактивному */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
details:focus-visible { outline: 3px solid var(--bgColor4); outline-offset: 2px; border-radius: 4px; }

/* Кнопки, що виглядають як посилання верстки. Скидання UA-стилів живе в 01-compat.css —
   там воно йде перед 03-nav.css і 05-pages.css і не затирає їхні фон та шрифт. */
.footer-nav-btn,
.callBlock-form-btn { display: flex; align-items: center; gap: 12px; text-align: left; }
/* <a> у верстці — блоковий і займає всю ширину колонки; <button> стискається до вмісту */
.callBlock-form-btn { width: 100%; }

/* --- Мобільна панель ------------------------------------------------------ */
.ge-nav-panel { --bs-offcanvas-width: min(86vw, 380px); --bs-offcanvas-bg: var(--bgColor3); --bs-offcanvas-color: var(--fontColor2); --bs-offcanvas-border-width: 0; --bs-offcanvas-padding-x: 24px; --bs-offcanvas-padding-y: 24px; display: flex; flex-direction: column; padding: 24px; }
.ge-nav-panel-head { display: flex; align-items: center; justify-content: space-between; padding: 0 0 24px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.ge-nav-panel-title { font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.75px; color: var(--fontColor2); }
.ge-nav-panel-links { display: flex; flex-direction: column; gap: 18px; padding: 24px 0; }
.ge-nav-panel-links > * { font-size: 19px; font-weight: 500; letter-spacing: -0.5px; color: var(--fontColor2); text-decoration: none; }
.ge-nav-panel-links > *.active { color: var(--bgColor4); }
.ge-nav-panel-foot { margin-top: auto; display: flex; flex-direction: column; gap: 18px; padding: 24px 0 0 0; border-top: 1px solid rgba(255, 255, 255, 0.12); }
.ge-nav-panel-foot .nav-line-call { align-self: flex-start; padding: 8px 18px; border-radius: 24px; background: var(--bgColor4); color: var(--fontColor1); font-size: 15px; font-weight: 500; }
.ge-nav-panel-contact { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--fontColor2); text-decoration: none; }
.ge-nav-panel-contact img { filter: invert(1); }
.ge-nav-panel-social { display: flex; gap: 12px; padding: 6px 0 0 0; }
.ge-nav-panel-social img { filter: invert(1); }

/* Кнопка закриття: іконки набору верстки для неї немає, малюємо хрестик */
.ge-nav-close,
.ge-modal-close { position: relative; width: 32px; height: 32px; background: none; border: 0; cursor: pointer; flex: 0 0 auto; }
.ge-nav-close::before, .ge-nav-close::after,
.ge-modal-close::before, .ge-modal-close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; background: var(--fontColor2); }
.ge-nav-close::before, .ge-modal-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.ge-nav-close::after, .ge-modal-close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.ge-modal-close::before, .ge-modal-close::after { background: var(--fontColor1); }

/* --- Модалка заявки ------------------------------------------------------- */
.modal-backdrop { --bs-backdrop-bg: #0f0f0f; --bs-backdrop-opacity: 0.55; }
.offcanvas-backdrop { --bs-backdrop-bg: #0f0f0f; --bs-backdrop-opacity: 0.55; }
.ge-consult-modal .modal-content { background: var(--bgColor0); border: 0; border-radius: 12px; }
.ge-consult-modal .modal-dialog { max-width: 520px; }
.ge-consult-modal .ge-modal-close { position: absolute; right: 12px; top: 12px; z-index: 2; }
.ge-consult-modal .callBlock-form { padding: 48px 32px; }

/* --- Поля й повідомлення Contact Form 7 ----------------------------------- */
/* CF7 не вміє видати `<label>` і `<input>` сусідами без спільного id, а форма на сторінці
   двічі — тому поле лежить усередині підпису. Щоб рядок мав ті самі 70 px, що у верстці,
   колонковий flex із gap: 6px переїжджає з .callBlock-form-line на сам підпис. */
.callBlock-form-line label { display: flex; flex-direction: column; gap: 6px; }
/* CF7 вкладає форму у дві власні обгортки, і колонковий flex .callBlock-form опинявся
   з єдиним нащадком — усі п'ять проміжків між рядками зникали (форма на 90 px нижча).
   Обгортки переносять flex далі, а `gap: inherit` тягне значення з .callBlock-form,
   тож проміжок лишається правильним на кожній контрольній ширині. */
.callBlock-form > .wpcf7,
.callBlock-form .wpcf7-form { display: flex; flex-direction: column; gap: inherit; }
.callBlock-form .wpcf7-form-control-wrap { display: block; }
.callBlock-form input[type="text"],
.callBlock-form input[type="tel"],
.callBlock-form input[type="email"] { width: 100%; box-sizing: border-box; font-size: 17px; font-weight: 500; padding: 12px; border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 6px; }
.callBlock-form input:focus { border-color: var(--fontColor1); }
.callBlock-form .wpcf7-not-valid { border-color: var(--fontColor3); }
.callBlock-form .wpcf7-not-valid-tip { display: block; font-size: 13px; font-weight: 500; color: var(--fontColor3); padding: 6px 0 0 0; }
.callBlock-form .wpcf7-response-output { font-size: 14px; line-height: 1.4; margin: 12px 0 0 0; padding: 12px; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; }
.callBlock-form .wpcf7-mail-sent-ok { border-color: var(--bgColor4); background: rgba(190, 240, 10, 0.15); }
.callBlock-form .wpcf7-validation-errors,
.callBlock-form .wpcf7-mail-sent-ng,
.callBlock-form .wpcf7-spam-blocked { border-color: var(--fontColor3); color: var(--fontColor3); }
.callBlock-form .wpcf7-spinner { display: block; margin: 12px 0 0 0; }
.ge-form-missing { font-size: 14px; color: var(--fontColor4); }

/* Пастка для ботів: прибрана з потоку, але не display:none — деякі боти це читають.
   CF7 загортає поле у власний span, і той лишався звичайним flex-елементом форми:
   нульової висоти, зате з повноцінним проміжком 18 px. Виносимо з потоку й обгортку. */
.ge-hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.callBlock-form .wpcf7-form-control-wrap[data-name="ge-website"] { position: absolute; }

/* --- Зменшена анімація ---------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.partners-track { animation: none !important; }
	.offcanvas, .modal.fade .modal-dialog, .modal-backdrop { transition: none !important; }
	.blockHeader-btn img, .callBlock-form-btn img, .heroBlock-quick-links > * img { transition: none !important; }
}

/* Редакторський текст приходить у `<p>`, а у верстці на його місці — голий текст.
   Крайні абзаци не мають додавати блоку зовнішніх відступів. */
.faqsBlock-answer > p:first-child,
.txtPageBlock-content > p:first-child { margin-top: 0; }
.faqsBlock-answer > p:last-child,
.txtPageBlock-content > p:last-child { margin-bottom: 0; }
