*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{

 
scroll-behavior:smooth;
 

}

body{

 
background:#fafafa;

color:#111827;

font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    sans-serif;

line-height:1.8;
 

}

.legal-container{

 
max-width:840px;

margin:0 auto;

padding:64px 24px 80px;
 

}

.legal-header{

 
margin-bottom:48px;
 

}

.legal-logo{

 
display:inline-block;

text-decoration:none;

color:#111827;

font-size:1.5rem;

font-weight:700;

letter-spacing:-0.03em;
 

}

.legal-brand{

 
margin-top:6px;

color:#6b7280;

font-size:.95rem;
 

}

.legal-page h1{

 
font-size:clamp(
    2.2rem,
    5vw,
    3.5rem
);

line-height:1.1;

letter-spacing:-0.04em;

margin-bottom:12px;
 

}

.legal-date{

 
color:#6b7280;

margin-bottom:40px;

font-size:.95rem;
 

}

.legal-page h2{

 
margin-top:42px;

margin-bottom:12px;

font-size:1.25rem;

font-weight:600;
 

}

.legal-page p{

 
margin-bottom:18px;

color:#374151;
 

}

.legal-page ul{

 
margin-bottom:18px;

padding-left:22px;
 

}

.legal-page li{

 
margin-bottom:8px;

color:#374151;
 

}

.legal-grid{

 
display:grid;

gap:16px;

margin-top:40px;
 

}

.legal-card{

 
display:flex;

align-items:center;

justify-content:space-between;

gap:24px;

padding:22px 24px;

border:1px solid #e5e7eb;

border-radius:18px;

background:#fff;

text-decoration:none;

color:inherit;

transition:
    transform .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
 

}

.legal-card:hover{

 
transform:translateY(-1px);

border-color:#d1d5db;

box-shadow:
    0 8px 24px
    rgba(0,0,0,.04);
 

}

.legal-card h2{

 
margin:0;

font-size:1rem;

font-weight:600;
 

}

.legal-card span{

 
color:#6b7280;

font-size:.9rem;

white-space:nowrap;
 

}

.legal-footer{

margin: 40px;

margin-top:64px;

padding-top:40px 60px;

border-top:1px solid #e5e7eb;

display:flex;


}

.legal-footer a{

 
color:#6b7280;

text-decoration:none;

font-size:.95rem;
 

}

.legal-footer a:hover{

 
color:#111827;
 

}

@media(
max-width:640px
){

 
.legal-container{

    padding:40px 20px 60px;

}

.legal-card{

    flex-direction:column;

    align-items:flex-start;

}

.legal-card span{

    white-space:normal;

}
 

}

.legal-back{

    display:inline-block;

    margin-top:12px;

    color:#6b7280;

    text-decoration:none;

    font-size:.95rem;

}

.legal-back:hover{

    color:#111827;

}