:root {
    --primary-color: #29434e;  /* Dark blue from the logo's background */
    --secondary-color: #ffffff;  /* White color for text for contrast */
    --accent-color: #455a64;  /* Slightly lighter shade of blue for buttons or highlights */
}

body, html {
    margin: 0;
    padding: 0;
    font-family: 'Arial', sans-serif; /* Clean and modern font */
    background-color: var(--secondary-color);
    color: var(--primary-color);
}

.navbar {
    background-color: var(--primary-color);
    color: var(--secondary-color);
}

.nav-link, .navbar-brand {
    color: var(--secondary-color);
    font-size: 1.1em; /* Slightly larger font size for better readability */
}

/* Button styles */
.btn {
    background-color: var(--accent-color);
    color: var(--secondary-color);
    border: none;
    border-radius: 5px; /* Rounded edges */
    padding: 8px 16px;
    text-transform: uppercase; /* Styling similar to the logo's text */
    transition: background-color 0.3s ease;
}

.btn:hover {
    background-color: darken(var(--accent-color), 10%);
}

/* Form input styles */
input[type="text"], input[type="search"] {
    border: 2px solid var(--primary-color);
    padding: 8px;
    width: 100%;
}

/* Footer styles if needed */
.footer {
    background-color: var
}

.navbar-brand {
    display: flex;
    align-items: center; /* Ensures vertical alignment */
    white-space: nowrap; /* Prevents the text from wrapping */
}

.navbar-brand img {
    margin-right: 10px; /* Space between logo and text */
    height: 60px; /* Increased height from previous example */
    width: auto; /* Maintains aspect ratio */
}

/* Adjust navbar height if necessary */
.navbar {
    padding: 10px 0; /* Adjust top and bottom padding to fit the larger logo */
}

/* Optional: Adjust navbar link styles to better match the larger logo */
.nav-link {
    padding: 0 15px; /* More padding to give space around the links */
    line-height: 60px; /* Adjust line height to vertically center align with the logo */
}