/* ==========================================================================
   Veridex – Legal page (Terms of Use & Privacy Policy)
   Self-contained, brand-matched, high-contrast.
   ========================================================================== */
:root{
  --navy:#050226;
  --ink:#0F1530;
  --body:#2F3953;       /* strong-contrast body text */
  --muted:#5A6585;
  --blue:#0B71D9;
  --purple:#7F54F9;
  --line:#E6EAF2;
  --bg:#F6F8FC;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:"Manrope",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--body);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.7;
}

/* ---- header ---- */
.lg-header{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:16px 28px;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid var(--line);
}
.lg-header img{ height:42px; width:auto; display:block; }
.lg-header a.lg-home{
  font-weight:700; font-size:15px; text-decoration:none; color:var(--blue);
  padding:9px 18px; border:1.5px solid var(--blue); border-radius:999px;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.lg-header a.lg-home:hover{ background:var(--blue); color:#fff; transform:translateY(-1px); }

/* ---- hero band ---- */
.lg-hero{
  background:
     radial-gradient(900px 360px at 12% -20%, rgba(127,84,249,.35), transparent 60%),
     radial-gradient(800px 360px at 100% 0%, rgba(11,113,217,.35), transparent 55%),
     var(--navy);
  color:#fff; padding:64px 28px 56px; text-align:center;
}
.lg-hero h1{
  margin:0 0 10px; font-weight:800; letter-spacing:-.6px;
  font-size:clamp(28px,4.4vw,46px); line-height:1.12; color:#fff;
}
.lg-hero p{ margin:0 auto; max-width:60ch; color:#C9CFE6; font-size:16px; }

/* ---- content ---- */
.lg-wrap{ max-width:880px; margin:-28px auto 0; padding:0 24px 80px; }
.lg-card{
  background:#fff; border:1px solid var(--line); border-radius:20px;
  box-shadow:0 18px 50px rgba(15,21,48,.10);
  padding:clamp(26px,4vw,56px);
}
.lg-intro{ font-size:17px; color:var(--body); margin:0 0 8px; }

.lg-card h2{
  display:flex; align-items:center; gap:14px;
  margin:46px 0 14px; font-size:clamp(21px,2.6vw,28px); font-weight:800;
  color:var(--ink); letter-spacing:-.3px; line-height:1.25;
  padding-top:26px; border-top:1px solid var(--line);
}
.lg-card h2:first-of-type{ border-top:none; padding-top:0; margin-top:30px; }
.lg-card h2 .num{
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 10px; border-radius:11px;
  background:linear-gradient(135deg,var(--purple),var(--blue));
  color:#fff; font-size:16px; font-weight:800;
}
.lg-card h3{
  margin:28px 0 8px; font-size:18px; font-weight:700; color:var(--ink);
  letter-spacing:-.2px;
}
.lg-card h3 .sub{ color:var(--blue); font-weight:800; margin-right:8px; }
.lg-card p{ margin:0 0 14px; color:var(--body); }
.lg-card ul{ margin:0 0 16px; padding:0; list-style:none; }
.lg-card li{
  position:relative; padding:8px 0 8px 30px; color:var(--body);
  border-bottom:1px dashed #EDF0F7;
}
.lg-card li:last-child{ border-bottom:none; }
.lg-card li::before{
  content:""; position:absolute; left:6px; top:16px;
  width:9px; height:9px; border-radius:50%;
  background:linear-gradient(135deg,var(--purple),var(--blue));
}
.lg-card li strong{ color:var(--ink); }
.lg-card a{ color:var(--blue); font-weight:600; }

.lg-updated{
  display:inline-block; margin-top:6px; font-size:13px; font-weight:700;
  letter-spacing:.4px; text-transform:uppercase; color:var(--blue);
  background:rgba(11,113,217,.10); padding:7px 14px; border-radius:999px;
}

/* ---- footer ---- */
.lg-footer{
  background:var(--navy); color:#AEB6D4; text-align:center;
  padding:34px 24px; font-size:14px;
}
.lg-footer a{ color:#fff; text-decoration:none; font-weight:600; }
.lg-footer a:hover{ text-decoration:underline; }

@media (max-width:600px){
  .lg-header{ padding:12px 16px; }
  .lg-header img{ height:34px; }
  .lg-wrap{ padding:0 14px 56px; }
}
