/* ============ ELEMNT Legal Pages (Terms / Privacy / Contact) ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#050B17;
  --bg-2:#0A1226;
  --surface:#0E1A2B;
  --line:rgba(148,163,184,0.14);
  --line-soft:rgba(148,163,184,0.08);
  --text:#F8FAFC;
  --text-2:#CBD5E1;
  --text-3:#94A3B8;
  --text-4:#64748B;
  --blue:#3B82F6;
  --blue-2:#60A5FA;
  --orange:#FF6A00;
}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bg);
  color:var(--text-2);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
a{color:var(--blue-2);text-decoration:none;transition:color .18s ease}
a:hover{color:var(--blue)}
a:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:2px}
img{max-width:100%;height:auto;display:block}

/* ----- Nav ----- */
.legal-nav{
  position:sticky;top:0;z-index:50;
  background:rgba(5,11,23,0.88);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
}
.legal-nav-inner{
  max-width:880px;margin:0 auto;
  padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.legal-logo{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--text);font-weight:900;font-size:15px;letter-spacing:0.05em;
}
.legal-logo svg{width:22px;height:17px;color:var(--blue);display:block;flex-shrink:0}
.legal-logo:hover{color:var(--text)}
.legal-nav-links{display:flex;gap:22px;align-items:center}
.legal-nav-link{
  font-size:13px;font-weight:500;color:var(--text-3);
  letter-spacing:0.01em;transition:color .18s ease;
}
.legal-nav-link:hover{color:var(--text)}
.legal-nav-link.active{color:var(--text);font-weight:600}

/* ----- Main doc ----- */
.legal{flex:1;padding:56px 24px 80px}
.legal-doc{max-width:780px;margin:0 auto}
.legal-doc h1{
  font-size:clamp(34px,4.6vw,46px);
  font-weight:900;line-height:1.1;letter-spacing:-0.03em;
  color:var(--text);margin-bottom:8px;
}
.legal-updated{
  font-size:13px;color:var(--text-4);
  margin-bottom:36px;letter-spacing:0.02em;
}
.legal-doc h2{
  font-size:20px;font-weight:800;letter-spacing:-0.015em;
  color:var(--text);
  margin:36px 0 14px;
  line-height:1.3;
}
.legal-doc p{
  font-size:15px;color:var(--text-2);
  margin:0 0 14px;line-height:1.7;
}
.legal-doc ul{
  list-style:none;padding:0;margin:0 0 18px;
}
.legal-doc ul li{
  position:relative;
  padding-left:18px;
  font-size:15px;color:var(--text-2);
  line-height:1.7;margin-bottom:4px;
}
.legal-doc ul li::before{
  content:"";
  position:absolute;left:2px;top:0.78em;
  width:5px;height:5px;border-radius:50%;
  background:var(--blue);opacity:0.7;
}
.legal-doc hr{
  border:none;
  height:1px;
  background:var(--line);
  margin:36px 0;
}
.legal-doc strong{color:var(--text);font-weight:700}
.legal-doc em{color:var(--text-3);font-style:italic}

.legal-support-email{
  display:inline-block;
  font-size:17px;font-weight:600;letter-spacing:-0.005em;
  color:var(--blue-2);
  padding:2px 0;
  border-bottom:1px solid rgba(59,130,246,0.30);
}
.legal-support-email:hover{
  color:var(--blue);
  border-bottom-color:var(--blue);
}

/* ----- Footer ----- */
.legal-foot{
  border-top:1px solid var(--line);
  background:var(--bg);
  padding:32px 24px 40px;
}
.legal-foot-inner{
  max-width:780px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
}
.legal-foot-links{display:flex;gap:22px;flex-wrap:wrap}
.legal-foot-links a{
  font-size:13px;color:var(--text-3);font-weight:500;
  transition:color .18s ease;
}
.legal-foot-links a:hover{color:var(--text)}
.legal-foot-meta{
  font-size:12px;color:var(--text-4);
  letter-spacing:0.02em;
}

/* ----- Responsive ----- */
@media(max-width:680px){
  .legal-nav-inner{padding:12px 18px;gap:14px}
  .legal-nav-links{gap:16px}
  .legal-nav-link{font-size:12px}
  .legal{padding:40px 18px 60px}
  .legal-doc h1{font-size:32px}
  .legal-doc h2{font-size:18px;margin-top:32px}
  .legal-doc p,.legal-doc ul li{font-size:14.5px}
  .legal-doc hr{margin:28px 0}
  .legal-foot{padding:28px 18px 36px}
  .legal-foot-inner{flex-direction:column;align-items:flex-start;gap:12px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  html{scroll-behavior:auto}
}
