body{
margin:0;
font-family:Arial,sans-serif;
background:#050b18;
color:white;
text-align:center;
}

header{
padding:30px;
}

header img{
vertical-align:middle;
}

nav a{
color:#9ccaff;
margin:15px;
text-decoration:none;
}

.hero{
padding:100px 20px;
}

h2{
font-size:50px;
}

.btn{
display:inline-block;
background:#1768f5;
color:white;
padding:15px 35px;
border-radius:30px;
text-decoration:none;
}

.cards{
display:flex;
justify-content:center;
gap:20px;
flex-wrap:wrap;
}

.cards div{
background:#101a30;
padding:30px;
border-radius:15px;
width:220px;
}

footer{
margin-top:80px;
padding:20px;
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

* {
    box-sizing: border-box;
}

body {
    font-family: 'Inter', Arial, sans-serif;
    background:
      radial-gradient(circle at top,#172554 0,#050b18 45%);
    color:#e5e7eb;
    line-height:1.8;
}

.policy-container {
    max-width:900px;
    margin:60px auto;
    padding:45px;
    background:rgba(15,23,42,.85);
    border:1px solid rgba(148,163,184,.15);
    border-radius:24px;
    backdrop-filter:blur(12px);
}

.policy-container h1 {
    font-size:42px;
    margin-bottom:15px;
    color:white;
}

.policy-container h2 {
    margin-top:45px;
    font-size:26px;
    color:#60a5fa;
}

.policy-container p,
.policy-container li {
    color:#cbd5e1;
    font-size:16px;
}

.policy-badge {
    display:inline-block;
    padding:8px 16px;
    background:#1d4ed8;
    border-radius:30px;
    font-size:14px;
    margin-bottom:20px;
}

.policy-list {
    padding-left:25px;
}

footer {
    color:#94a3b8;
}



.top {
display:flex;
justify-content:space-between;
align-items:center;
padding:25px 8%;
}


.brand {
display:flex;
align-items:center;
gap:12px;
font-size:26px;
font-weight:800;
}


.brand img {
width:55px;
}


.hero-main {

text-align:center;
padding:80px 20px;

max-width:900px;
margin:auto;

}


.hero-logo {

width:130px;

}


.hero-main h1 {

font-size:70px;
line-height:1.05;

background:linear-gradient(90deg,#60a5fa,#2563eb);

-webkit-background-clip:text;
color:transparent;

}



.hero-main p {

font-size:20px;
color:#cbd5e1;

max-width:650px;

margin:25px auto;

}



.play-button {

display:inline-block;

background:#2563eb;

padding:16px 35px;

border-radius:40px;

color:white;

text-decoration:none;

font-weight:700;

}



.features-home {

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:20px;

max-width:1100px;

margin:50px auto;

padding:20px;

}



.home-card {

background:#111c35;

border:1px solid #263452;

padding:30px;

border-radius:20px;

}



.home-card h3 {

color:#60a5fa;

}



.about {

max-width:800px;

margin:80px auto;

text-align:center;

padding:30px;

}



.about a {

color:#60a5fa;

}



footer {

text-align:center;

padding:40px;

border-top:1px solid #1e293b;

}


@media(max-width:700px){

.hero-main h1{
font-size:45px;
}

.top{
flex-direction:column;
gap:20px;
}

}



.navbar{

display:flex;
align-items:center;
justify-content:space-between;
padding:25px 8%;

}


.brand{

display:flex;
align-items:center;
gap:12px;
font-size:26px;
font-weight:800;

}


.brand img{

width:55px;

}


nav{

display:flex;
gap:25px;

}


nav a{

color:#cbd5e1;
text-decoration:none;
font-weight:600;

}


nav a:hover{

color:white;

}



.hero{

text-align:center;
max-width:900px;
margin:80px auto;
padding:20px;

}


.hero h1{

font-size:64px;
line-height:1.1;

}


.hero p{

font-size:20px;
color:#cbd5e1;
max-width:650px;
margin:30px auto;

}



.features{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:25px;
max-width:1100px;
margin:70px auto;
padding:20px;

}



.feature-card{

background:#111827;
border:1px solid #243047;
border-radius:20px;
padding:30px;

}



.feature-card h3{

color:#60a5fa;

}



.download-box{

text-align:center;
margin:80px auto;

}



.footer-brand{

display:flex;
justify-content:center;
align-items:center;
gap:10px;

}


.footer-brand img{

width:35px;

}


.footer-links{

margin:20px;

}


.footer-links a{

margin:10px;
color:#94a3b8;

}



@media(max-width:800px){

.navbar{

flex-direction:column;
gap:25px;

}


nav{

flex-wrap:wrap;
justify-content:center;

}


.hero h1{

font-size:42px;

}

}


@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

body {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
    letter-spacing: -0.015em;
}


h1 {
    font-weight:900;
    letter-spacing:-0.04em;
}


h2 {
    font-weight:800;
    letter-spacing:-0.03em;
}


p {
    font-weight:400;
    line-height:1.8;
}


.navbar {
    backdrop-filter: blur(12px);
}


nav a {
    font-size:15px;
    transition:.2s;
}


nav a:hover {
    color:#60a5fa;
}


.feature-card,
.policy-container,
.download-box {
    box-shadow:
    0 20px 50px rgba(0,0,0,.25);
}