html {
    overflow-x: hidden;
}

body {
    background: linear-gradient(135deg, #ffffff 0%, #ffe0cc 100%);
    background-attachment: fixed;
    min-height: 100vh;
}

/* Scale down pages by 20% (except map.html and guide.html) */
body.scaled-page {
    zoom: 0.8;
    /* transform: scale(0.8); causes layout issues (scroll past bottom) */
    /* transform-origin: top left; */
    /* width: 125%; */
}

/* Firefox-specific hack to attempt scaling without breaking layout too much, 
   or just leave it unscaled to ensure usability. 
   For now, we prioritize layout integrity (no massive whitespace). 
   Firefox users will see 100% scale. */
@supports (-moz-appearance:none) {
    body.scaled-page {
        /* transform: scale(0.8); */
        /* transform-origin: top left; */
        /* width: 125%; */
        zoom: 1;
    }
}



.noselect {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}

@media screen and (max-width: 480px) {
    .review_text {
        font-size: 100%;
    }

    .product-item {
        max-width: 25%;
    }

    .owl-item {
        max-width: 10%;
    }

    .product-carousel {
        max-width: 100%;
    }
}

.product-item {
    max-width: 100%;
    vertical-align: middle;
    margin: auto;
    align-items: center;
    justify-content: center;
}

.review_text {
    font-style: italic;
}

.hidden {
    display: none;
}

.cookies-eu-banner {
    background-image: linear-gradient(to right, #024238, #032b36);
    color: #fff;
    padding: 12px;
    font-size: 13px;
    text-align: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10;
}

.cookies-eu-banner button {
    text-decoration: none;
    background: orangered;
    color: #fff;
    border: 1px solid #000;
    cursor: pointer;
    padding: 4px 7px;
    margin: 2px 0;
    font-size: 13px;
    font-weight: 700;
    transition: background 0.07s, color 0.07s, border-color 0.07s;
}

.cookies-eu-banner button:hover {
    background: #fff;
    color: #222;
}

/********** Template CSS **********/
:root {
    --primary: #fc4c02;
    --secondary: #FFD33C;
    --light: #F3F3F3;
    --dark: #212121;
}

[class^=flaticon-]:before,
[class*=" flaticon-"]:before,
[class^=flaticon-]:after,
[class*=" flaticon-"]:after {
    font-size: inherit;
    margin-left: 0;
}

.btn {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    transition: .5s;
}

.btn-primary {
    color: #FFFFFF;
}

.btn-square {
    width: 36px;
    height: 36px;
}

.btn-sm-square {
    width: 28px;
    height: 28px;
}

.btn-lg-square {
    width: 46px;
    height: 46px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
}

.back-to-top {
    position: fixed;
    display: none;
    right: 30px;
    bottom: 0;
    border-radius: 0;
    z-index: 99;
}

.navbar-light .navbar-nav .nav-link {
    font-family: 'Roboto', sans-serif;
    position: relative;
    margin-left: 30px;
    padding: 30px 0;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--dark);
    outline: none;
    transition: .5s;
}

.sticky-top.navbar-light .navbar-nav .nav-link {
    padding: 20px 0;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: var(--primary);
}

@media (min-width: 992px) {
    .navbar-light .navbar-nav .nav-link::before {
        position: absolute;
        content: "";
        width: 0;
        height: 7px;
        top: -4px;
        left: 50%;
        background: var(--primary);
        transition: .5s;
    }

    .navbar-light .navbar-nav .nav-link:hover::before,
    .navbar-light .navbar-nav .nav-link.active::before {
        width: 100%;
        left: 0;
    }

    .navbar-light .navbar-nav .nav-link.nav-contact::before {
        width: 100%;
        height: 1px;
        top: -1px;
        left: 0;
    }
}

@media (max-width: 991.98px) {
    .navbar-light .navbar-nav .nav-link {
        margin-left: 0;
        padding: 10px 0;
    }
}

.map-div {
    width: 100%;
    height: 50%;
    min-width: 960px;
    max-width: 960px;
}

.btn-play {
    position: relative;
    display: block;
    box-sizing: content-box;
    width: 16px;
    height: 26px;
    border-radius: 100%;
    border: none;
    outline: none !important;
    padding: 18px 20px 20px 28px;
    background: #FFFFFF;
}

.btn-play:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 60px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 100%;
    animation: pulse-border 1500ms ease-out infinite;
}

.btn-play:after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 60px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 100%;
    transition: all 200ms;
}

.btn-play span {
    display: block;
    position: relative;
    z-index: 3;
    width: 0;
    height: 0;
    left: -1px;
    border-left: 16px solid var(--primary);
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
}

@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(2);
        opacity: 0;
    }
}

#videoModal .modal-dialog {
    position: relative;
    max-width: 800px;
    margin: 60px auto 0 auto;
}

#videoModal .modal-body {
    position: relative;
    padding: 0px;
}

#videoModal .close {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0px;
    top: -30px;
    z-index: 999;
    font-size: 30px;
    font-weight: normal;
    color: #FFFFFF;
    background: #000000;
    opacity: 1;
}

.service-item a i {
    position: relative;
    padding-left: 20px;
    transition: .3s;
}

.service-item a:hover i {
    padding-left: 50px;
}

.service-item a i::after {
    position: absolute;
    content: "";
    width: 20px;
    height: 2px;
    top: 50%;
    left: 10px;
    margin-top: -1px;
    background: var(--primary);
    transition: .3s;
}

.service-item a:hover i::after {
    width: 50px;
}

.product-item {
    padding: 0px;
}

.product-item .btn-action {
    position: absolute;
    width: 100%;
    bottom: 0px;
    left: 0;
    opacity: 0;
    transition: .5s;
}

.product-item:hover .btn-action {
    bottom: -20px;
    opacity: 1;
}

.product-carousel .owl-nav {
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
}

.product-carousel .owl-nav .owl-prev,
.product-carousel .owl-nav .owl-next {
    position: relative;
    margin: 0 5px;
    width: 55px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    font-size: 22px;
    transition: .5s;
}

.product-carousel .owl-nav .owl-prev:hover,
.product-carousel .owl-nav .owl-next:hover {
    color: var(--dark);
}

.bg-offer {
    background: url(../img/offer.webp) top right no-repeat;
    background-size: cover;
}

.price-carousel::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 50%;
    bottom: 0;
    left: 0;
    background: var(--primary);
    border-radius: 8px 8px 50% 50%;
    z-index: -1;
}

.price-carousel .owl-nav {
    margin-top: 35px;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
}

.price-carousel .owl-nav .owl-prev,
.price-carousel .owl-nav .owl-next {
    position: relative;
    margin: 0 5px;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    background: #FFFFFF;
    font-size: 22px;
    border-radius: 45px;
    transition: .5s;
}

.price-carousel .owl-nav .owl-prev:hover,
.price-carousel .owl-nav .owl-next:hover {
    color: var(--dark);
}

.team-carousel .owl-nav {
    position: absolute;
    width: 50px;
    height: 160px;
    top: calc(50% - 80px);
    right: 0;
    z-index: 1;
}

.team-carousel .owl-nav .owl-prev,
.team-carousel .owl-nav .owl-next {
    position: relative;
    width: 50px;
    height: 50px;
    margin: 15px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    font-size: 22px;
    transition: .5s;
}

.team-carousel .owl-nav .owl-prev:hover,
.team-carousel .owl-nav .owl-next:hover {
    color: var(--dark);
}

.team-item img {
    transition: .5s;
}

.team-item:hover img {
    transform: scale(1.2);
}

.team-item .team-overlay {
    position: absolute;
    top: 45px;
    right: 45px;
    bottom: 45px;
    left: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(122, 183, 48, .8);
    transition: .5s;
    opacity: 0;
}

.team-item:hover .team-overlay {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 1;
}

.bg-testimonial {
    background: url(../img/testimonial.jpg) top left no-repeat;
    background-size: cover;
}

.testimonial-carousel .owl-nav {
    position: absolute;
    width: 100%;
    height: 46px;
    top: calc(50% - 23px);
    left: 0;
    display: flex;
    justify-content: space-between;
    z-index: 1;
}

.testimonial-carousel .owl-nav .owl-prev,
.testimonial-carousel .owl-nav .owl-next {
    position: relative;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: var(--primary);
    font-size: 22px;
    transition: .5s;
}

.testimonial-carousel .owl-nav .owl-prev:hover,
.testimonial-carousel .owl-nav .owl-next:hover {
    color: var(--dark);
}

.testimonial-carousel .owl-item img {
    width: 100px;
    height: 100px;
}

@media (min-width: 576px) {
    .blog-item .row {
        height: 300px;
    }
}

.blog-item a i {
    position: relative;
    padding-left: 20px;
    transition: .3s;
}

.blog-item a:hover i {
    padding-left: 50px;
}

.blog-item a i::after {
    position: absolute;
    content: "";
    width: 20px;
    height: 2px;
    top: 50%;
    left: 10px;
    margin-top: -1px;
    background: var(--primary);
    transition: .3s;
}

.blog-item a:hover i::after {
    width: 50px;
}

/* Dropdown Button */
.dropbtn {
    background-color: var(--primary);
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
    background-color: #ddd;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #ce6e00;
}


/* Style the button that is used to open and close the collapsible content */
.collapsible {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    border: #000000;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsible:hover {
    background-color: #ccc;
}

.active {
    background-color: #fff;
}

.active-content {
    background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
    padding: 18px;
    overflow: hidden;
    background-color: #f1f1f1;
    border-style: dotted;
}

/* Popup container */
.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
    visibility: hidden;
    width: 160px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.prevent-select {
    -webkit-user-select: none;
    /* Safari */
    -ms-user-select: none;
    /* IE 10 and IE 11 */
    user-select: none;
    /* Standard syntax */
}

.leaflet-control-container {
    position: absolute;
    bottom: 40;
    right: 55;
}

.checked {
    color: var(--primary);
}

.switch {
    display: inline-block;
    height: 25px;
    position: relative;
    width: 45px;
}

.switch input {
    display: none;
}

.slider {
    background-color: #ccc;
    bottom: 0;
    cursor: pointer;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: .4s;
}

.slider:before {
    background-color: #fff;
    bottom: 2px;
    content: "";
    height: 21px;
    left: 2px;
    position: absolute;
    transition: .4s;
    width: 21px;
}

input:checked+.slider {
    background-color: var(--primary);
}

input:checked+.slider:before {
    transform: translateX(20px);
}

.slider.round {
    border-radius: 25px;
}

.slider.round:before {
    border-radius: 50%;
}

/* slider button */
.ios13-segmented-control {
    --background: rgba(239, 239, 240, 1);
    background: var(--background);
    border-radius: 9px;
    margin: 0;
    padding: 2px;
    border: none;
    outline: none;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ios13-segmented-control .option {
    position: relative;
    cursor: pointer;
}

.ios13-segmented-control .option:hover input:not(:checked)+label span,
.ios13-segmented-control .option:active input:not(:checked)+label span,
.ios13-segmented-control .option:focus input:not(:checked)+label span {
    opacity: .2;
}

.ios13-segmented-control .option:active input:not(:checked)+label span {
    transform: scale(.95);
}

.ios13-segmented-control .option label {
    position: relative;
    display: block;
    text-align: center;
    width: 0;
    padding: 3px 4vmin;
    background: rgba(255, 255, 255, 0);
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    font-size: 14px;
}

.ios13-segmented-control .option label::before,
.ios13-segmented-control .option label::after {
    content: '';
    width: 1px;
    background: rgba(142, 142, 147, .15);
    position: absolute;
    top: 14%;
    bottom: 14%;
    border-radius: 10px;
    will-change: background;
    -webkit-transition: background .2s ease;
    transition: background .2s ease;
}

.ios13-segmented-control .option label::before {
    left: 0;
    transform: translateX(-.5px);
}

.ios13-segmented-control .option label::after {
    right: 0;
    transform: translateX(.5px);
}

.ios13-segmented-control .option:first-of-type {
    grid-column: 1;
    grid-row: 1;
    box-shadow: none;
}

.ios13-segmented-control .option:first-of-type label::before {
    opacity: 0;
}

.ios13-segmented-control .option:last-of-type label::after {
    opacity: 0;
}

.ios13-segmented-control .option input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border: none;
    opacity: 0;
}

.ios13-segmented-control .selection {
    background: rgba(255, 255, 255, 1);
    border: .5px solid rgba(0, 0, 0, 0.04);
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12), 0 3px 1px 0 rgba(0, 0, 0, 0.04);
    border-radius: 7px;
    grid-column: 1;
    grid-row: 1;
    z-index: 2;
    will-change: transform;
    -webkit-transition: transform .2s ease;
    transition: transform .2s ease;
}

.ios13-segmented-control .option label span {
    display: block;
    position: relative;
    width: 0;
    z-index: 2;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    will-change: transform;
}

.ios13-segmented-control .option input:checked+label::before,
.ios13-segmented-control .option input:checked+label::after {
    background: var(--background);
    z-index: 1;
}

.ios13-segmented-control .option input:checked+label {
    cursor: default;
}

/* slider button */
.ios13-segmented-control2 {
    --background: rgba(239, 239, 240, 1);
    background: var(--background);
    border-radius: 9px;
    margin: 0;
    padding: 2px;
    border: none;
    outline: none;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ios13-segmented-control2 .option {
    position: relative;
    cursor: pointer;
}

.ios13-segmented-control2 .option:hover input:not(:checked)+label span,
.ios13-segmented-control .option:active input:not(:checked)+label span,
.ios13-segmented-control .option:focus input:not(:checked)+label span {
    opacity: .2;
}

.ios13-segmented-control2 .option:active input:not(:checked)+label span {
    transform: scale(.95);
}

.ios13-segmented-control2 .option label {
    position: relative;
    display: block;
    text-align: center;
    width: 0;
    padding: 3px 4vmin;
    background: rgba(255, 255, 255, 0);
    font-weight: 500;
    color: rgba(0, 0, 0, 1);
    font-size: 14px;
}

.ios13-segmented-control2 .option label::before,
.ios13-segmented-control .option label::after {
    content: '';
    width: 1px;
    background: rgba(142, 142, 147, .15);
    position: absolute;
    top: 14%;
    bottom: 14%;
    border-radius: 10px;
    will-change: background;
    -webkit-transition: background .2s ease;
    transition: background .2s ease;
}

.ios13-segmented-control2 .option label::before {
    left: 0;
    transform: translateX(-.5px);
}

.ios13-segmented-control2 .option label::after {
    right: 0;
    transform: translateX(.5px);
}

.ios13-segmented-control2 .option:first-of-type {
    grid-column: 1;
    grid-row: 1;
    box-shadow: none;
}

.ios13-segmented-control2 .option:first-of-type label::before {
    opacity: 0;
}

.ios13-segmented-control2 .option:last-of-type label::after {
    opacity: 0;
}

.ios13-segmented-control2 .option input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border: none;
    opacity: 0;
}

.ios13-segmented-control2 .selection {
    background: rgba(255, 255, 255, 1);
    border: .5px solid rgba(0, 0, 0, 0.04);
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12), 0 3px 1px 0 rgba(0, 0, 0, 0.04);
    border-radius: 7px;
    grid-column: 1;
    grid-row: 1;
    z-index: 2;
    will-change: transform;
    -webkit-transition: transform .2s ease;
    transition: transform .2s ease;
}

.ios13-segmented-control2 .option label span {
    display: block;
    position: relative;
    width: 0;
    z-index: 2;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    will-change: transform;
}

.ios13-segmented-control2 .option input:checked+label::before,
.ios13-segmented-control .option input:checked+label::after {
    background: var(--background);
    z-index: 1;
}

.ios13-segmented-control2 .option input:checked+label {
    cursor: default;
}

#step-tabs .nav-link.active {
    background-color: var(--primary);
    color: white;
    font-weight: bold;
    border-color: var(--primary);
}


#prev-next-buttons {
    align-items: center;
    /* Vertically center the items */
}

#step-tabs {
    flex-grow: 1;
    justify-content: center;
    border-bottom: none;
    /* remove the default border from nav-tabs */
}

#step-tabs .nav-item {
    margin: 0 2px;
    /* Add some space between tabs */
}

#step-tabs .nav-link {
    padding: 0.5rem 0.6rem;
    /* Adjust padding */
    font-size: 0.8rem;
    /* Smaller font size */
    font-weight: bold;
    /* Make text bold */
    white-space: nowrap;
    /* Prevent wrapping */
    line-height: 1.5;
    /* Ensure line height is consistent */
    border-radius: 0.25rem;
    /* Add some rounded corners */
    transition: all 0.2s ease-in-out;
}

#step-tabs .nav-link:not(.active):hover {
    background-color: #f8f9fa;
    /* A light background on hover for non-active tabs */
}

/* Ensure the container for the tabs doesnt shrink */
#prev-next-buttons>div:nth-child(2) {
    flex-shrink: 0;
}

/* Mobile responsive styles for step tabs */
@media screen and (max-width: 768px) {
    #step-tabs {
        flex-wrap: wrap;
        /* Allow tabs to wrap to next line */
    }

    #step-tabs .nav-item {
        margin: 2px 1px;
        /* Reduce horizontal margin on mobile */
    }

    #step-tabs .nav-link {
        padding: 0.4rem 0.5rem;
        /* Reduce padding */
        font-size: 0.7rem;
        /* Smaller font size */
        white-space: normal;
        /* Allow text to wrap if needed */
    }
}

/* Extra small screens (phones in portrait) */
@media screen and (max-width: 480px) {
    #step-tabs .nav-link {
        padding: 0.3rem 0.4rem;
        /* Even smaller padding */
        font-size: 0.65rem;
        /* Even smaller font */
    }

    #step-tabs .nav-item {
        margin: 1px;
        /* Minimal margin */
    }
}

/* Fix for sticky navbar overlap on anchor links */
#about,
#product {
    scroll-margin-top: 120px;
}

@media (max-width: 991.98px) {

    #about,
    #product {
        scroll-margin-top: 100px;
    }
}

@media (max-width: 576px) {
    /* 1. Override the large font size (fs-1) on mobile */
    .navbar-brand .fs-1 {
        font-size: 1.0rem !important; /* Reduces text from ~40px to ~18px */
        display: flex;
        align-items: center; /* Vertically centers text with logo */
    }

    /* 2. Shrink the logo image on mobile */
    .navbar-brand img {
        height: 35px !important; /* Override inline height */
        width: 35px !important;  /* Override inline width */
    }

    /* 3. Reduce margin between logo and text */
    .navbar-brand .me-3 {
        margin-right: 0.5rem !important;
    }
    
    /* 4. Ensure text never wraps to a second line */
    .navbar-brand {
        white-space: nowrap;
    }
}