/*=========================================================
44 Web Design Framework
-----------------------------------------------------------
Project      : 433
Client       : Vehicle Safety Solutions Ltd

File         : header.css
Version      : 1.0.0

Author       : Ian Latus
Company      : 44 Web Design

Purpose
-------
Provides the site header, navigation and logo layout.

Contents
--------
1. Header
2. Header Wrapper
3. Logo
4. Navigation
5. Navigation Links

=========================================================*/


/*=========================================================
Dependencies

variables.css
base.css
layout.css
buttons.css

=========================================================*/


/*=========================================================
1. Header
=========================================================*/

.site-header {

    background: var(--colour-white);

    border-bottom: 1px solid var(--colour-light);

}


/*=========================================================
2. Header Wrapper
=========================================================*/

.header-wrapper {

    display: flex;

    justify-content: space-between;
    align-items: center;

    min-height: var(--header-height);

}


/*=========================================================
3. Logo
=========================================================*/

.logo img {

    display: block;

    max-height: var(--logo-height);
    width: auto;

}


/*=========================================================
4. Navigation
=========================================================*/

.main-nav ul {

    display: flex;

    gap: var(--space-lg);

    align-items: center;

}


/*=========================================================
5. Navigation Links
=========================================================*/

.main-nav a {

    color: var(--colour-dark);

    font-weight: 600;

    transition: color var(--transition-normal);

}

.main-nav a:hover {

    color: var(--colour-primary);

}