:root{
--blue:#00ADEF;
--dark:#002664;
--text:#0D1220;
--border:rgba(0,0,0,.08);
}
*,
*::before,
*::after{
margin:0;
padding:0;
box-sizing:border-box;
}
html{
scroll-behavior:smooth;
}
body{
font-family:"Montserrat",Arial,sans-serif;
color:var(--text);
background:#fff;
}
img{
display:block;
max-width:100%;
}
a{
text-decoration:none;
color:inherit;
}
button,
input,
textarea{
font-family:inherit;
}
/* CONTAINER */
.container{
width:100%;
max-width:1440px;
margin:0 auto;
padding-left:40px;
padding-right:40px;
}
/* BUTTONS */
.btn{
height:42px;
display:inline-flex;
align-items:center;
justify-content:center;
padding:0 24px;
border-radius:8px;
font-size:12px;
font-weight:600;
text-transform:uppercase;
letter-spacing:.5px;
transition:.25s;
}
.btn-blue{
background:var(--blue);
color:#fff;
}
.btn-blue:hover{
background:#008dcc;
}
.btn-outline{
border:1px solid rgba(255,255,255,.5);
color:#fff;
}
.btn-outline-blue{
border:1px solid var(--blue);
color:var(--blue);
}
.btn-dark{
background:var(--dark);
color:#fff;
}
/* HEADER */
.header{
height:64px;
background:#fff;
}
.header-inner{
height:100%;
display:flex;
align-items:center;
justify-content:space-between;
}
.logo img{
width:180px;
}
.nav{
display:flex;
gap:28px;
}
.nav a{
font-size:13px;
transition:.2s;
}
.nav a:hover{
color:var(--blue);
}
.header-actions{
display:flex;
align-items:center;
gap:16px;
}
.header-actions .btn{
height:34px;
padding:0 18px;
font-size:11px;
}
.language{
font-size:12px;
color:rgba(0,0,0,.5);
}
/* HERO */
.hero{
height:720px;
position:relative;
overflow:hidden;
}
.hero-image{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
}
.hero-overlay{
position:absolute;
inset:0;
background:linear-gradient(
90deg,
rgba(0,38,100,.4),
rgba(0,38,100,.05)
);
}
.hero-container{
position:relative;
height:100%;
}
.hero-content{
padding-top:60px;
max-width:600px;
color:#fff;
}
.hero-content h1{
font-size:60px;
line-height:.98;
letter-spacing:-1.5px;
margin-bottom:20px;
}
.hero-content p{
font-size:16px;
line-height:25px;
max-width:520px;
margin-bottom:28px;
font-weight:300;
}
.hero-buttons{
display:flex;
gap:10px;
}