/* Legal pages (privacy.html, terms.html): page layout on top of the design system.
   Reads role tokens only; components come from components.css. */
.legal-page{min-height:100vh;min-height:100dvh}
.legal-page .appbar{padding-right:var(--gutter)}
.legal__langs{display:flex;gap:var(--s2)}
.legal__langs a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s3);border:var(--line) solid var(--rule-2);border-radius:var(--r1);
  font-family:var(--f-type);font-weight:700;font-size:var(--t-label);letter-spacing:var(--tr-label);text-transform:uppercase;text-decoration:none;color:var(--fg)}
.legal__langs a:hover{border-color:var(--fg)}

.legal{max-width:44rem;margin:0 auto}
.legal .mast .display{margin-top:var(--s2)}
.legal .postit{max-width:34rem}
.legal .keypoints{margin-top:var(--s3)}
.legal .keypoints .ic{color:var(--fg)}
.legal .sec{scroll-margin-top:calc(var(--appbar-h) + var(--sat) + var(--s4))}
.legal .sec-h+.prose{margin-top:var(--s5)}
.legal .prose a{color:var(--fg);text-decoration-thickness:1.5px;text-underline-offset:3px}
.legal .prose ul{margin-top:.8em}
.legal .prose li{position:relative;padding-left:1.1em}
.legal .prose li+li{margin-top:.5em}
.legal .prose li::before{content:"";position:absolute;left:0;top:.72em;width:.42em;height:.42em;background:var(--fg-3);border-radius:1px}
.legal .prose ul+p,.legal .prose p+ul{margin-top:1.05em}
.legal__ph{padding:0 .25em;border-radius:var(--r1);background:var(--signal-soft);color:var(--fg)}

/* Data inventory: one block per kind of data, stacked so it reads at 320 px. */
.legal__rows{margin-top:var(--s2)}
.legal__row{padding:var(--s4) 0 var(--s5);border-bottom:var(--hair) solid var(--rule)}
.legal__row h3{font-weight:var(--w-heavy);font-size:18px;line-height:1.3;color:var(--fg);overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
.legal__row dl{display:grid;grid-template-columns:minmax(6.5em,max-content) minmax(0,1fr);gap:var(--s2) var(--s4);margin-top:var(--s3)}
.legal__row dt{font-family:var(--f-type);font-weight:700;font-size:var(--t-label);line-height:1.6;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.legal__row dd{font-size:16px;line-height:1.5;color:var(--read-fg);overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
@media (max-width:359px){
  .legal__row dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .legal__row dd+dt{margin-top:var(--s2)}
}

.legal .help{margin-top:var(--s5)}
/* Rule between the Finnish and English versions, inset to the gutter like section rules. */
.legal__switch{margin-top:var(--s10);background:linear-gradient(var(--rule-strong),var(--rule-strong)) var(--gutter) 0/calc(100% - 2 * var(--gutter)) var(--bold) no-repeat}
.legal__foot{max-width:44rem;margin:var(--s8) auto 0;padding:0 var(--gutter) calc(var(--sab) + var(--s8))}
.legal__foot .signoff{border-top:var(--hair) solid var(--rule)}
.legal__links{display:flex;flex-wrap:wrap;gap:0 var(--s5)}