/*==========================================================
ENTITY ENTERPRISES
Base
==========================================================*/

*,
*::before,
*::after{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:var(--font-body);

    background:var(--clr-background);

    color:var(--clr-text);

    overflow-x:hidden;

    text-rendering:optimizeLegibility;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;
    

}


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

Typography

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

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--font-heading);

    font-weight:700;

    color:var(--clr-heading);

    letter-spacing:-.03em;

}

p{

    color:#666;

    line-height:1.9;

}

a{

    text-decoration:none;

    color:inherit;

}

a:focus-visible,
button:focus-visible,
.filter-btn:focus-visible {
    outline: 2px solid var(--accent-color, #0D3B8C);
    outline-offset: 4px;
}

img{

    display:block;

    max-width:100%;

}

button{

    font:inherit;

    background:none;

    border:none;

    cursor:pointer;

}

ul{

    list-style:none;

}


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

Selection

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


::-webkit-scrollbar{

width:10px;

}

::-webkit-scrollbar-track{

background:#F4F4F4;

}

::-webkit-scrollbar-thumb{

background:#0D2346;

border-radius:50px;

}

::-webkit-scrollbar-thumb:hover{

background:#184C84;

}


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

Cursor

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

#cursor{

    position:fixed;

    width:18px;

    height:18px;

    border-radius:50%;

    border:1px solid rgba(13,35,70,.25);

    pointer-events:none;

    transform:translate(-50%,-50%);

    z-index:999999;

    transition:

        width .3s,

        height .3s,

        background .3s,

        border-color .3s;

}


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

Background Paper

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

.paper{

    position:fixed;

    inset:0;

    background:

    linear-gradient(
        rgba(248, 250, 252, 0.95),
        rgba(248, 250, 252, 0.98)
    ),
    linear-gradient(rgba(13, 59, 140, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13, 59, 140, 0.02) 1px, transparent 1px);

    background-size: 100% 100%, 60px 60px, 60px 60px;

    z-index:-20;

}


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

Noise Layer

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

.noise{

    position:fixed;

    inset:0;

    opacity:.025;

    pointer-events:none;

    z-index:-19;

    background-image:

    radial-gradient(circle,#000 1px,transparent 1px);

    background-size:10px 10px;

}


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

Utilities

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

.mt-2{

    margin-top:20px;

}

.mt-3{

    margin-top:30px;

}

.mt-4{

    margin-top:40px;

}

.mt-5{

    margin-top:50px;

}

.mt-6{

    margin-top:60px;

}

.mt-7{

    margin-top:70px;

}

.mt-8{

    margin-top:80px;

}

.mb-2{

    margin-bottom:20px;

}

.mb-4{

    margin-bottom:40px;

}

.text-center{

    text-align:center;

}

.w-100{

    width:100%;

}

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

Accessibility & Navigation Utilities

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

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


.breadcrumbs {
    font-family: var(--font-body);
    font-size: 0.82rem;
    padding: 10px 0 20px;
    color: #94A3B8;
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.breadcrumbs a {
    color: #60A5FA;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s ease;
}

.breadcrumbs a:hover {
    color: white;
}

.breadcrumbs span {
    color: #475569;
}
/*==========================================================

Images

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

img{

    user-select:none;

    -webkit-user-drag:none;

}


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

Transitions

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

a,
button,
img{

    transition:.4s cubic-bezier(.16,1,.3,1);

}


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

Loading

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

body{

    opacity:0;

    transition:opacity .7s ease;

}

body.loaded{

    opacity:1;

}
/*==========================================================

LOADER

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

#loader{

position:fixed;

inset:0;

background:#F8F8F6;

display:flex;

justify-content:center;

align-items:center;

z-index:999999;

transition:1s cubic-bezier(.16,1,.3,1);

}

#loader.hide{

opacity:0;

visibility:hidden;

pointer-events:none;

}

.loader-content{

width:420px;

display:flex;

flex-direction:column;

align-items:center;

gap:28px;

}

.loader-logo{

font-family:var(--font-heading);

font-size:3rem;

letter-spacing:.45em;

color:var(--clr-primary);

}

.loader-line{

width:100%;

height:1px;

background:rgba(0,0,0,.08);

overflow:hidden;

}

.loader-line span{

display:block;

height:100%;

width:0;

background:var(--clr-primary);

}

.loader-status{

font-size:.82rem;

letter-spacing:.28em;

text-transform:uppercase;

color:#666;

}

.loader-progress{

width:100%;

height:4px;

background:#ececec;

overflow:hidden;

border-radius:999px;

}

.loader-progress-bar{

width:0;

height:100%;

background:linear-gradient(

90deg,

#0D2346,

#214A82

);

}