:root{
  --bg:#f5f7fb;
  --surface:#ffffff;
  --ink:#101722;
  --muted:#5f6a77;
  --line:rgba(16,23,34,.13);
  --orange:#ff5a16;
  --blue:#147fd1;
  --shadow:0 18px 50px rgba(16,23,34,.10);
  --radius:18px;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    linear-gradient(115deg, rgba(20,127,209,.10), transparent 34%),
    linear-gradient(245deg, rgba(255,90,22,.07), transparent 30%),
    var(--bg);
  color:var(--ink);
  line-height:1.65;
}

a{color:inherit}

.legal-shell{
  width:min(920px, calc(100% - 32px));
  margin:0 auto;
  padding:28px 0 64px;
}

.legal-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 0 28px;
}

.brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:inherit;
  font-size:20px;
  font-weight:950;
  text-decoration:none;
}

.brand-mark{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,var(--orange),#ff8a22);
  box-shadow:0 12px 26px rgba(255,90,22,.28);
}

.back-link{
  display:inline-flex;
  min-height:40px;
  align-items:center;
  justify-content:center;
  padding:9px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--muted);
  font-weight:850;
  text-decoration:none;
}

.legal-card{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:28px;
  background:rgba(255,255,255,.92);
  box-shadow:var(--shadow);
}

.legal-hero{
  padding:clamp(28px, 6vw, 54px);
  border-bottom:1px solid var(--line);
  background:linear-gradient(135deg, rgba(20,127,209,.10), rgba(255,90,22,.10));
}

.eyebrow{
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:#fff;
  color:var(--orange);
  font-size:13px;
  font-weight:950;
}

h1{
  margin:16px 0 0;
  font-size:clamp(2rem, 7vw, 3.4rem);
  line-height:1;
  letter-spacing:-.04em;
}

.legal-date{
  margin:14px 0 0;
  color:var(--muted);
}

.legal-content{
  padding:clamp(24px, 5vw, 46px);
}

.legal-index{
  display:grid;
  gap:8px;
  margin:0 0 32px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
}

.legal-index strong{font-size:.95rem}

.legal-index a{
  color:var(--blue);
  font-weight:800;
  text-decoration:none;
}

section + section{margin-top:28px}

h2{
  margin:0 0 10px;
  font-size:1.25rem;
  line-height:1.25;
}

p{margin:0 0 12px}

ul{margin:0 0 12px; padding-left:1.25rem}

li + li{margin-top:6px}

strong{font-weight:900}

.legal-note{
  margin-top:28px;
  padding:16px 18px;
  border-radius:18px;
  background:#fff7ed;
  color:#7c2d12;
  font-weight:750;
}

.legal-footer{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:22px;
  color:var(--muted);
  font-size:.9rem;
}

.legal-footer a{text-decoration:none}
.legal-footer a:hover{text-decoration:underline}

@media (max-width:640px){
  .legal-top{align-items:flex-start;flex-direction:column}
  .back-link{width:100%}
}