/* VYVO Intelligence — the reference pages (/privacy, /terms, /data-deletion, /government-requests).
   Only the look lives here: the site's own tokens (index.html :root), its type (Inter, Arial) and its spacing.
   The pages' structure and wording are the owner's and are not changed by this file. Nothing is loaded from a third party. */
:root{
  --void:#020512;
  --ink:#061226;
  --gold:#E7BB63;
  --gold-soft:#F1C97A;
  --ice:#AFCBFA;
  --white:#F8F9FA;
  --text:rgba(225,235,249,.86);
  --muted:rgba(202,219,243,.66);
  --muted-2:rgba(202,219,243,.5);
  --line:rgba(138,180,255,.16);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:radial-gradient(60% 40% at 50% 0%,rgba(47,107,255,.10) 0%,rgba(2,5,18,0) 70%),var(--void);color:var(--white);font-family:Inter,Arial,Helvetica,sans-serif;font-size:16px;line-height:1.72;-webkit-font-smoothing:antialiased}
a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(231,187,99,.38)}
a:hover{color:var(--gold-soft);border-bottom-color:var(--gold-soft)}
a:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.wrap{width:min(760px,100% - 32px);margin-left:auto;margin-right:auto}

/* header: the site's lockup, VYVO then INTELLIGENCE */
header{border-bottom:1px solid var(--line);padding:26px 0 20px}
.brand{display:inline-flex;align-items:baseline;gap:2px;color:var(--white);border-bottom:none;font-size:clamp(20px,2.2vw,26px);font-weight:500;letter-spacing:.26em;line-height:1}
.brand:hover{color:var(--white)}
.brand span{font-size:10px;font-weight:400;letter-spacing:.34em;color:rgba(255,255,255,.62)}

main{padding:52px 0 0}
.eyebrow{margin:0 0 18px;color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase}
h1{margin:0 0 16px;font-size:clamp(32px,4.4vw,48px);font-weight:600;line-height:1.08;letter-spacing:-.02em;color:var(--white)}
.lede{margin:0 0 12px;max-width:62ch;color:var(--text);font-size:18px;line-height:1.65}
.updated{margin:0 0 44px;color:var(--muted-2);font-size:14px}
h2{margin:48px 0 14px;padding-top:22px;border-top:1px solid var(--line);font-size:clamp(20px,2.2vw,24px);font-weight:600;line-height:1.25;letter-spacing:-.01em;color:var(--white)}
h2:first-of-type{border-top:none;padding-top:0}
h3{margin:26px 0 8px;font-size:17px;font-weight:600;color:var(--white)}
p{margin:0 0 16px;color:var(--text)}
p.sub{color:var(--text)}
strong{color:var(--white);font-weight:600}
ul.plain{margin:0 0 18px;padding-left:22px;color:var(--text)}
ul.plain li{margin:0 0 8px}

/* tables: the site's gold labels, quiet rules; stacked on a phone */
table{width:100%;border-collapse:collapse;margin:8px 0 22px;font-size:15px;line-height:1.55}
th,td{padding:11px 14px 11px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;color:var(--text)}
th{color:var(--gold);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
td:first-child{color:var(--white);font-weight:600;white-space:nowrap}
@media(max-width:560px){td:first-child{white-space:normal}}

/* the callout: the site's gold rule, not a new colour */
.callout{margin:22px 0 26px;padding:16px 20px;border-left:2px solid var(--gold);background:rgba(231,187,99,.06);border-radius:0 12px 12px 0}
.callout p{margin:0;color:var(--text);font-size:15.5px}

footer{margin-top:72px;border-top:1px solid var(--line);padding:24px 0 44px;color:var(--muted-2);font-size:12px;letter-spacing:.06em}
footer a{color:rgba(225,235,249,.72);border-bottom:none}
footer a:hover{color:var(--gold)}
footer .links{display:flex;flex-wrap:wrap;gap:6px 22px;margin-bottom:12px}
footer .links a{margin-right:0;padding:4px 0}
