/* CHOOSE.COM.UA — бренд-оформлення сторінок юридичних документів.
   Підключається ПІСЛЯ вбудованого <style> кожної сторінки і перекриває його:
   Open Sans замість Times, фірмові акценти, лого-шапка (.doc-chrome) і футер (.doc-foot). */

body {
  font-family: 'Open Sans', 'Noto Sans', 'Arimo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  color: #111;
  padding: 36px 16px 70px;
}

.doc { max-width: 860px; padding: 0 24px; }

h1 {
  font-size: clamp(21px, 4vw, 26px);
  letter-spacing: .02em;
  line-height: 1.35;
}

h2 { font-size: 16.5px; letter-spacing: .02em; }
h3 { font-size: 15.5px; letter-spacing: .02em; }

p, ul li, ol li { text-align: left; hyphens: none; -webkit-hyphens: none; }

a { color: #f4242e; text-decoration: underline; }
a:hover { color: #d81f28; }

.alert {
  background: #fff7f7;
  border-left: 3px solid #f4242e;
  border-radius: 0 6px 6px 0;
}

/* Шапка з лого і хлібними крихтами (вставляється перед .doc) */
.doc-chrome { max-width: 860px; margin: 0 auto 30px; text-align: center; }
.doc-chrome img { height: clamp(38px, 8vw, 46px); width: auto; }
.doc-chrome a { text-decoration: none; }
.doc-chrome nav { margin-top: 14px; font-size: 13.5px; color: #999; }
.doc-chrome nav a { color: #777; text-decoration: none; }
.doc-chrome nav a:hover { color: #f4242e; text-decoration: underline; }
.doc-chrome .sep { color: #ccc; margin: 0 7px; }

/* Футер (вставляється після .doc): навігація → бренд-рядок → дрібний підпис */
.doc-foot { max-width: 860px; margin: 48px auto 0; border-top: 1px solid #f0f0f0; padding-top: 26px; text-align: center; }
.doc-foot nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin-bottom: 16px; }
.doc-foot nav a { color: #555; font-size: 14px; text-decoration: none; }
.doc-foot nav a:hover { color: #f4242e; text-decoration: underline; }
.doc-foot .f-brand { font-size: 13px; font-weight: 600; color: #8a8a8a; margin: 0 auto 4px; text-align: center; }
.doc-foot .f-sub { font-size: 12.5px; color: #b8b8b8; line-height: 1.6; max-width: 640px; margin: 0 auto; text-align: center; }

/* Кнопка «вгору» — та сама, що на головній (створюється скриптом перед </body>) */
.scroll-to-top { position: fixed; bottom: 32px; right: 32px; width: 56px; height: 56px; background: #f4242e;
  color: #fff; border: none; border-radius: 50%; cursor: pointer; display: flex; align-items: center;
  justify-content: center; z-index: 999; opacity: 0; visibility: hidden; transform: translateY(100px);
  transition: all .4s cubic-bezier(.68, -.55, .265, 1.55); }
.scroll-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.scroll-to-top:hover { background: #d91e26; }
.scroll-to-top:focus { outline: none; }
.scroll-to-top svg { width: 24px; height: 24px; }

@media (max-width: 560px) {
  body { padding: 20px 12px 56px; font-size: 15.5px; }
  .doc { padding: 0 8px; }
  h1 { font-size: 20px; }
  .doc-foot nav { gap: 10px 16px; }
  .scroll-to-top { width: 46px; height: 46px; bottom: 20px; right: 20px; }
  .scroll-to-top svg { width: 20px; height: 20px; }
}
