/* ==== Доповнення для WordPress-версії ==== */

/* Перемикач мови тепер посилання, а не кнопки */
.lang a {
  display: inline-flex; align-items: center;
  padding: 6px 9px; border-radius: 999px;
  font-size: 11px; font-weight: 600; letter-spacing: .08em;
  color: var(--muted); text-decoration: none;
}
.lang a.on { background: var(--dark); color: #fff; }
.lang a:not(.on):hover { color: var(--ink); }

/* Мобільне меню — доступне і на внутрішніх сторінках */
.menu-btn { display: none; background: transparent; border: 0; cursor: pointer; padding: 6px; color: var(--ink); }
.menu-btn svg { width: 24px; height: 24px; stroke: currentColor; }
.mmenu { display: none; position: fixed; inset: 0; background: var(--cream); z-index: 999; padding: 90px 32px 32px; overflow-y: auto; }
.mmenu.open { display: block; }
.mmenu-close { position: absolute; top: 22px; right: 26px; background: transparent; border: 0; color: var(--ink); font-size: 34px; line-height: 1; cursor: pointer; }
.mmenu a { display: block; padding: 18px 0; border-bottom: 1px solid rgba(0,0,0,.1); font-family: Georgia, serif; font-size: 22px; color: var(--ink); }
.mmenu .mmenu-lang { border-bottom: 0; font-family: inherit; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--copper); font-weight: 700; }

@media (max-width: 760px) {
  .menu-btn { display: flex; }
  .lang { display: inline-flex !important; }
  .lang a { padding: 6px 7px; font-size: 10px; }
}

/* Меню WordPress рендериться посиланнями напряму — прибираємо списки */
.links ul, .nav ul, .mmenu ul, .footer ul { list-style: none; margin: 0; padding: 0; }
.links li, .nav li { display: inline-block; }

/* Картки блогу */
.grid .card { display: block; transition: transform .2s ease; }
.grid .card:hover { transform: translateY(-3px); }
.grid .card .eyebrow { margin-bottom: 6px; }

/* Пагінація */
.page-numbers { display: inline-block; padding: 9px 14px; margin: 0 4px; border-radius: 999px; background: #fff; font-size: 13px; font-weight: 600; }
.page-numbers.current { background: var(--dark); color: #fff; }

/* Контент із редактора Gutenberg */
.content h3 { font: 400 24px Georgia, serif; margin: 26px 0 10px; }
.content ul, .content ol { padding-left: 22px; }
.content li { margin-bottom: 8px; }
.content img, .content figure img { border-radius: 16px; height: auto; }
.content figure { margin: 24px 0; }
.content a { color: var(--copper); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.content blockquote { margin: 24px 0; padding: 18px 22px; background: #f7f4ec; border-left: 3px solid var(--copper); border-radius: 0 14px 14px 0; }
.content table { width: 100%; border-collapse: collapse; font-size: 15px; }
.content th, .content td { padding: 10px 12px; border-bottom: 1px solid rgba(0,0,0,.08); text-align: left; }
.alignwide, .alignfull { max-width: 100%; }
.aligncenter { margin-left: auto; margin-right: auto; }

/* Статус форми */
.form-status.error { color: #a1443a; }

/* Адмін-бар не має перекривати фіксовану шапку */
body.admin-bar .top { top: 32px; }
@media (max-width: 782px) { body.admin-bar .top { top: 46px; } }
body.admin-bar .mmenu { top: 32px; }

/* Поточна мова у перемикачі */
.lang .on { display: inline-flex; align-items: center; padding: 6px 9px; border-radius: 999px; background: var(--dark); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .08em; }
.links a.current, .nav a.current { color: var(--copper); }

/* Компактна шапка на телефоні: логотип + мова + кнопка + бургер в один рядок */
@media (max-width: 760px) {
  .top-actions { gap: 8px; }
  .wordmark-main, .wordmark { font-size: 16px !important; letter-spacing: -.04em; }
  .brand span:not(.wordmark-main) { display: none; }
  .brand b { display: none; }
  .top .topbtn, .top .cta { padding: 9px 12px; font-size: 10px; white-space: nowrap; line-height: 1; }
  .lang a, .lang .on { padding: 5px 6px; font-size: 10px; }
}
@media (max-width: 360px) {
  .top .topbtn, .top .cta { display: none; }
}

/* <picture> не має ламати розкладку кадру */
.chapter .media picture { display: contents; }

/* ==== МОБІЛЬНА АДАПТАЦІЯ ==== */

/* Логотип внутрішніх сторінок не має ховатися */
.brand span.wordmark { display: inline !important; }

/* Якорі не ховаються під шапкою */
:target, #contact, #services, #s1, #s2 { scroll-margin-top: 80px; }

@media (max-width: 760px) {
  /* Заголовки внутрішніх сторінок трохи менші — довгі назви не займають пів екрана */
  .hero h1 { font-size: clamp(34px, 10.5vw, 52px) !important; }

  /* Статистика: непарний останній блок на всю ширину */
  .stats { grid-template-columns: repeat(2, 1fr); gap: 18px 14px; }
  .stats .stat:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .stats .stat b { font-size: 34px; }
  .stats .stat span { font-size: 10px; line-height: 1.4; }

  /* Картки послуг компактніші */
  .cards .card p { font-size: 14px; }

  /* Форма: пальцем зручніше */
  .contact-form input, .contact-form textarea { padding: 15px 16px; }
  .contact-form button { min-height: 52px; }
  .contact-btns { gap: 10px; }
  .contact-btns .pill-alt { flex: 1; text-align: center; justify-content: center; }

  /* Місце під нижню панель */
  body.has-mobilebar { padding-bottom: 68px; }
}

/* ==== НИЖНЯ ПАНЕЛЬ ДЗВІНКА (тільки телефон) ==== */
.mobilebar { display: none; }
@media (max-width: 760px) {
  .mobilebar {
    display: flex; gap: 10px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: rgba(242,239,231,0.94);
    backdrop-filter: blur(14px);
    border-top: 1px solid rgba(0,0,0,.08);
  }
  .mobilebar a {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; border-radius: 999px;
    font-size: 13px; font-weight: 700; letter-spacing: .01em;
  }
  .mobilebar .mb-call { background: var(--dark); color: #fff; }
  .mobilebar .mb-msg { background: transparent; color: var(--ink); border: 1px solid rgba(0,0,0,.18); }
  .mobilebar svg { width: 17px; height: 17px; }
}

@media (max-width: 760px) {
  .mobilebar { transition: transform .3s ease, opacity .3s ease; }
  .mobilebar.is-hidden { transform: translateY(120%); opacity: 0; pointer-events: none; }
}

/* Текст кадру не має ховатися під нижньою панеллю */
@media (max-width: 760px) {
  body.has-mobilebar .chapter .copy { bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width: 400px) {
  body.has-mobilebar .chapter .copy { bottom: calc(80px + env(safe-area-inset-bottom)) !important; }
  .chapter h1, .chapter h2 { font-size: clamp(30px, 8.6vw, 40px) !important; }
}

@media (max-width: 380px) {
  .mobilebar { gap: 8px; padding-left: 10px; padding-right: 10px; }
  .mobilebar a { font-size: 12px; gap: 6px; padding: 0 6px; white-space: nowrap; }
  .mobilebar svg { width: 15px; height: 15px; }
}

/* ==== Кнопка дзвінка в шапці: тільки телефон ==== */
.call-cta { display: none; }
@media (max-width: 760px) {
  .desk-cta { display: none !important; }
  .call-cta {
    display: inline-flex !important; align-items: center; gap: 7px;
    padding: 10px 14px !important; font-size: 12px !important;
    white-space: nowrap; line-height: 1;
  }
  .call-cta svg { width: 14px; height: 14px; flex: none; }
}
@media (max-width: 380px) {
  .call-cta { padding: 9px 11px !important; font-size: 11px !important; gap: 5px; }
  .call-cta svg { width: 13px; height: 13px; }
  .wordmark-main, .wordmark { font-size: 15px !important; }
  .lang a, .lang .on { padding: 5px 5px; font-size: 10px; }
  .top-actions { gap: 6px; }
}
@media (max-width: 340px) {
  .call-cta span.call-label { display: none; }
}

/* ==== Плавність скролу на телефоні ==== */
@media (max-width: 900px) {
  /* backdrop-filter на фіксованій шапці — головна причина ривків у мобільних браузерах */
  .top { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(242,239,231,0.97) !important; }
  /* сталі відступи замість vh: висота вікна змінюється, коли ховається панель браузера */
  .chapter .copy { bottom: 34px !important; }
  body.has-mobilebar .chapter .copy { bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
  /* без анімації масштабу — менше перемальовувань під час скролу */
  .chapter .media img { transform: none !important; will-change: auto; }
}

@media (max-width: 900px) {
  /* анімація появи без blur — на телефонах саме він дає підгальмовування */
  .reveal { filter: none !important; transform: translateY(14px); transition: opacity .45s ease, transform .45s ease; }
  .reveal.in { transform: none; }
}

/* Дуже вузькі екрани (320–345 px): шапка стискається до іконок */
@media (max-width: 345px) {
  .call-cta .call-label { display: none; }
  .call-cta { padding: 9px 12px !important; gap: 0; }
  .call-cta svg { width: 15px; height: 15px; }
  .wordmark-main, .wordmark { font-size: 14px !important; }
  .top { padding: 0 10px !important; }
  .top-actions { gap: 5px; }
}

@media (max-width: 420px) {
  .top .brand { margin-right: 10px; min-width: 0; }
  .wordmark-main, .wordmark { font-size: 15px !important; }
}

/* Довгі слова у заголовках не ламають розкладку навіть до спрацювання скрипта */
.chapter h1, .chapter h2, .hero h1 { overflow-wrap: normal; word-break: normal; max-width: 100%; }
@media (max-width: 430px) {
  .chapter h1, .chapter h2 { font-size: clamp(28px, 7.8vw, 38px) !important; line-height: 1.02; }
  .hero h1 { font-size: clamp(30px, 8.6vw, 44px) !important; line-height: 1.04; }
}
