/************************************************
NAVBAR
************************************************/

.navbar{

position:sticky;

top:0;

z-index:999;

background:#fff;

box-shadow:0 4px 18px rgba(0,0,0,.06);

}

.nav-container{

max-width:1400px;

margin:auto;

padding:16px 24px;

display:flex;

justify-content:space-between;

align-items:center;

}

.brand{

    display:flex;

    align-items:center;

    gap:14px;

}

.brand img{

    width:54px;

    height:54px;

    object-fit:contain;

}

.brand-text{

    display:flex;

    flex-direction:column;

}

.brand-title{

    margin:0;

    font-size:24px;

    font-weight:700;

    line-height:1.1;

    letter-spacing:.3px;

}

.brand-one{

    color:#7A1F3D;

    font-weight:700;

}

.brand-name{

    color:#6b7280;

    font-weight:700;

}

.brand-subtitle{

    margin-top:2px;

    font-size:13px;

    color:#9ca3af;

    font-weight:500;

}

/* Mobile */

@media (max-width:768px){

    .brand-title{

        font-size:18px;

        white-space:nowrap;

    }

}

nav{

display:flex;

gap:28px;

}

nav a{

text-decoration:none;

font-weight:600;

color:#334155;

}

.portal-btn{

background:var(--blue);

color:#fff;

border:none;

padding:14px 22px;

border-radius:12px;

cursor:pointer;

font-weight:bold;

}

/************************************************
NAVBAR
************************************************/

.brand{

    display:flex;
    align-items:center;
    gap:14px;

    text-decoration:none;
    color:inherit;

    -webkit-tap-highlight-color:transparent;

    transition:opacity .2s ease;

}

/* Remove default link styling */
.brand:link,
.brand:visited,
.brand:hover,
.brand:active{

    text-decoration:none;
    color:inherit;

}

.brand:hover{

    opacity:.9;

}

.brand img{

    transition:transform .2s ease;

}

.brand:hover img{

    transform:scale(1.03);

}

/* Keep keyboard accessibility */
.brand:focus{

    outline:none;

}

.brand:focus-visible{

    outline:2px solid #2563eb;
    outline-offset:4px;
    border-radius:10px;

}