body{
    margin:0;
    font-family:Inter,system-ui,sans-serif;
    background:var(--bg);
    color:var(--text);
    line-height:1.7;
}

.legal{
    max-width:900px;
    margin:60px auto;
    padding:0 20px;
}

.legal-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    padding:40px;
    box-shadow:0 8px 30px var(--shadow);
}

.legal-logo{
    text-align:center;
    margin-bottom:28px;
}

.legal-logo img{
    width:90px;
}

.legal h1{
    font-size:38px;
    margin:0 0 10px;
    font-weight:900;
    text-align:center;
}

.legal-sub{
    text-align:center;
    color:var(--muted);
    margin-bottom:40px;
    font-size:15px;
}

.legal h2{
    margin-top:35px;
    margin-bottom:12px;
    color:var(--primary);
    font-size:22px;
}

.legal p,
.legal li{
    color:var(--text);
    font-size:15px;
}

.legal ul{
    padding-left:20px;
}

.legal a{
    color:var(--primary);
    text-decoration:none;
    font-weight:700;
}

.legal a:hover{
    text-decoration:underline;
}

.back{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:25px;
    color:var(--primary);
    font-weight:800;
    text-decoration:none;
}

.footer{
    margin-top:50px;
    padding-top:20px;
    border-top:1px solid var(--border);
    text-align:center;
    color:var(--muted);
    font-size:13px;
}

@media(max-width:700px){

    .legal-card{
        padding:24px;
    }

    .legal h1{
        font-size:28px;
    }

    .legal h2{
        font-size:19px;
    }

}

.agree{
    margin:18px 0;
}

.agree-label{
    display:flex;
    align-items:flex-start;
    gap:10px;
    cursor:pointer;
    line-height:1.5;
}

.agree-label input{
    width:18px;
    height:18px;
    margin-top:2px;
    flex-shrink:0;
}

.agree-label a{
    color:var(--primary);
    font-weight:700;
    text-decoration:none;
}

.agree-label a:hover{
    text-decoration:underline;
}