body {
    background-color: #dad9ab;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* --- ДИЗАЙН ШАПКИ --- */
.custom-header {
    background-color: #8b9a4c;
    border-radius: 20px;
    height: 100px; /* Зробили хедер вищим (було 85px) */
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
/* Стиль для текстових посилань у шапці */
.nav-text-link {
    color: #363927;
    font-size: 1.2rem;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-decoration: none;
    transition: 0.3s;
    white-space: nowrap; /* Забороняємо розривати слова */
}
.nav-text-link:hover {
    color: #f0f4e4;

}

.custom-nav-links a, .custom-contacts a {
    color: #363927;
    font-size: 1.2rem;
    font-family: Comic Sans MS, Comic Sans, cursive;
    text-decoration: none;
    transition: 0.3s;
}

.custom-nav-links a:hover, .custom-contacts a:hover {
    color: #f0f4e4;
}
/* Стиль для іконки Instagram */
.insta-link {
    font-size: 24px; /* Розмір іконки */
    color: #363927;  /* Твій фірмовий темний колір */
    opacity: 0.7;    /* Робимо її трохи прозорою */
    transition: 0.3s;
    text-decoration: none;
    display: flex;
    align-items: center;
}

.insta-link:hover {
    opacity: 1;      /* При наведенні стає чіткою */
    color: #f0f4e4;  /* Або будь-який інший колір при наведенні */
    transform: scale(1.1); /* Легке збільшення */
}
.custom-burger-btn {
    background-color: transparent;
    color: #363927;
    font-size: 30px;        /* Трохи збільшили розмір */
    font-weight: 900;       /* Максимальна жирність для тексту */
    border: none;
    padding: 0;
    line-height: 1;

    /* МАГІЯ ТУТ: додаємо "контур", щоб рисочки стали товстішими */
    -webkit-text-stroke: 1.5px #363927;
}

.custom-burger-btn:focus {
    box-shadow: none;
    outline: none;
}

/* --- БІЧНЕ МЕНЮ (OFFCANVAS) --- */
.custom-offcanvas {
    background-color: #a9ba68;
    width: 280px !important;
}

.custom-side-menu .nav-link {
    color: #4a3c2c;
    font-size: 19px;
    padding: 12px 15px;
    transition: 0.3s;
}

.custom-side-menu .nav-link:hover {
    color: #f0f4e4;
    background-color: rgba(255,255,255,0.5);
    border-radius: 10px;
}

/* Випадаюче меню всередині бічного */
.submenu-links a {
    color: #4a3c2c;
    text-decoration: none;
    font-size: 16px;
    display: block;
    padding: 8px 10px;
}

.submenu-links a:hover {
    background-color: #758144;
    color: white;
    border-radius: 8px;
}

/* --- ДИЗАЙН ФУТЕРА --- */
.site-footer {
    background-color: #909d5f;
    border-top: 1px solid #dad9ab;
    color: #4a3c2c;
}

.footer-links a, .footer-map-link, .footer-tel {
    color: #4a3c2c;
    transition: 0.3s;
}

.footer-links a:hover, .footer-map-link:hover, .footer-tel:hover {
    color: #f0f4e4;
    padding-left: 5px;
}

#scrollTopBtn {
    display: none; /* З'являється через JS */
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 999;

    /* РОЗМІРИ КРУГА */
    width: 55px;
    height: 55px;
    border-radius: 50%;

    /* ОБНУЛЕННЯ */
    padding: 0 !important;
    margin: 0;
    border: none;
    outline: none;
    background-color: #DAA520;
    color: white;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);

    /* МАГІЯ ПОЗИЦІОНУВАННЯ */
    position: fixed; /* Повертаємо, якщо збилося */
}

/* Створюємо окремий шар для самої стрілки всередині кнопки */
#scrollTopBtn::after {
    content: "↑";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%); /* Зсуваємо рівно в центр */
    font-size: 28px;
    line-height: 1;
    font-family: Arial, sans-serif; /* Стандартний шрифт для передбачуваності */
}

#scrollTopBtn:hover {
    background-color: #887c1b;
    transform: translateY(-5px);
}

/* Невеликий медіа-запит для кнопки Нагору на мобільних */
@media (max-width: 768px) {
    #scrollTopBtn {
        bottom: 70px;
        right: 20px;
        width: 45px;
        height: 45px;
    }
}