/* =========================================================
   base.css
   Базові стилі проекту (типографіка + легкий reset)
   Підключати ПЕРЕД header.css та іншими стилями
   ========================================================= */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

/* ---------- CSS-змінні (легко міняти кольори) ---------- */
:root {
    --header-bg:            #f8f9fa;          /* світло-сірий фон */
    --header-border:        #dee2e6;          /* сірі лінії зверху/знизу */
    /*--logo-color:           #2391fe;           синій колір логотипу (текст) */
    --logo-color:           #0171ed;          /* синій колір логотипу (текст) */
    --nav-link-color:       #343a40;          /* темно-сірий пунктів меню */
    --nav-link-hover:       #0d6efd;          /* синій при наведенні */
    --hamburger-color:      #343a40;          /* колір гамбургера */
    --header-height:        52px;             /* висота хедера на десктопі */
    --transition:           0.25s ease;       /* плавні анімації */
    
    /*--color8 : #f2f4f5;   Фон в модальних формах */
}

/* ---------- Reset / нормалізація ---------- */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif,
                 "Apple Color Emoji", "Segoe UI Emoji";
    font-size: 16px;
    line-height: 1.5;
    color: #212529;
    background-color: #ffffff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---------- Заголовки ---------- */
h1, h2, h3, h4, h5, h6 {
    margin: 0 0 0.5em;
    font-family: inherit;
    font-weight: 600;
    line-height: 1.25;
    color: #212529;
}

h1 { font-size: 2rem; }       /* 32px */
h2 { font-size: 1.75rem; }    /* 28px */
h3 { font-size: 1.5rem; }     /* 24px */
h4 { font-size: 1.25rem; }    /* 20px */
h5 { font-size: 1.125rem; }   /* 18px */
h6 { font-size: 1rem; }       /* 16px */

/* ---------- Текст ---------- */
p {
    margin: 0 0 1em;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.6;
    color: #212529;
}

small {
    font-size: 0.875rem;
}

strong, b {
    font-weight: 600;
}

em, i {
    font-style: italic;
}

/* ---------- Посилання ---------- */
a {
    color: #0d6efd;
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover,
a:focus-visible {
    color: #0a58ca;
    text-decoration: underline;
}

/* ---------- Списки ---------- */
ul, ol {
    margin: 0 0 1em;
    padding-left: 1.5em;
}

li {
    margin-bottom: 0.25em;
    line-height: 1.5;
}

/* ---------- Інше ---------- */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

button {
    font-family: inherit;
    cursor: pointer;
}

input,
textarea,
select {
    font-family: inherit;
    font-size: 1rem;
}

/* Прибрати стандартні відступи у списків навігації */
nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}