﻿/* =====================================================
   HEADER
=====================================================*/

.main-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 10px 0;
    background: linear-gradient(to right, #000000, #152331);
}

.header-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: white;
}


.header-title {
    padding-left:13px;
}
.header-title span {
    /*display: block;*/
    font-weight: 700;
    font-size: 1.3rem;
}
    .header-title small {
        display: block;
    }

.header-title small {
    opacity: .85;
}

.header-nav {
    display: flex;
    gap: 35px;
}

    .header-nav a {
        color: white;
        text-decoration: none;
        font-weight: 600;
        transition: .3s;
    }

        .header-nav a:hover {
            color: #FFB000;
        }

.header-actions {
    display: flex;
    gap: 12px;
}

.btn-phone,
.btn-whatsapp {
    padding: 7px 15px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 700;
    transition: .3s;
    width: 155px;
    text-align: center;
}

.btn-phone {
    background: #D7261E;
    color: white;
}

    .btn-phone:hover {
        background: #b91c1c;
    }

.btn-whatsapp {
    border: 2px solid #25D366;
    color: white;
}

    .btn-whatsapp:hover {
        background: #25D366;
    }







/* =====================================================
   STICKY HEADER
=====================================================*/

.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: linear-gradient(to right, #859398, #283048);
    box-shadow: 0 6px 20px rgba(0,0,0,.08);
    transform: translateY(-100%);
    opacity: 0;
    transition: .35s;
}

    .sticky-header.show {
        transform: translateY(0);
        opacity: 1;
    }

.towtruck {
    color: #d50707;
}
.sticky-wrapper {
    height: 76px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sticky-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: white;
    font-weight: 700;
}

    .sticky-logo img {
        height: 46px;
        margin-right: 12px;
    }

.sticky-actions {
    display: flex;
    gap: 12px;
}

    .sticky-actions .btn-phone {
        color: white;
    }

    .sticky-actions .btn-whatsapp {
        color: #25D366;
    }

        .sticky-actions .btn-whatsapp:hover {
            color: white;
        }

@media(max-width:992px) {

    .header-nav {
        display: none;
    }
}

@media(max-width:768px) {

    .main-header > .container, .sticky-header > .container {
        display: flex;
        justify-content: space-evenly;
    }

    .header-logo, .sticky-logo {
        display: none;
    }

    .header-png {
        display: block;
    }
    /*.header-logo{
        margin-right:13px;
    }*/

    /*.btn-phone {
        padding: 5px 13px;
    }

    .btn-whatsapp {
        padding: 5px 15px;
    }*/
}
