/* /var/www/varentio/css/privacy.css
   Public legal pages. Self-contained — no dependency on landing_page.css.
   Tokens are copied from landing_page.css; see note in the deploy summary
   about extracting them to a shared base.css later. */

:root{
    --bg:#07111f;
    --panel-light:rgba(255,255,255,0.04);
    --text:#ecf3ff;
    --muted:#9fb0c9;
    --line:rgba(255,255,255,0.08);
    --primary:#5ea2ff;
    --secondary:#8d7dff;
    --radius-md:16px;
    --radius-sm:12px;
    --transition:220ms ease;
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

@media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ transition:none !important; }
}

body.legal-page{
    margin:0;
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:linear-gradient(180deg, #07111f 0%, #081321 100%);
    color:var(--text);
    min-height:100vh;
    -webkit-font-smoothing:antialiased;
}

a{ color:var(--primary); text-decoration:none; }
a:hover{ text-decoration:underline; }

a:focus-visible,
.legal-brand:focus-visible{
    outline:2px solid var(--primary);
    outline-offset:3px;
    border-radius:4px;
}

.legal-container{
    width:min(calc(100% - 40px), 1140px);
    margin:0 auto;
}

/* ---------- Topbar ---------- */

.legal-topbar{
    border-bottom:1px solid var(--line);
    background:rgba(7,17,31,0.72);
    backdrop-filter:blur(16px);
    position:sticky;
    top:0;
    z-index:10;
}

.legal-topbar-inner{
    min-height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.legal-brand{
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:var(--text);
    font-weight:700;
}

.legal-brand:hover{ text-decoration:none; }

.legal-brand-mark{
    width:34px;
    height:34px;
    border-radius:12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, var(--primary), var(--secondary));
    color:#fff;
    font-size:0.95rem;
    flex-shrink:0;
}

.legal-signin{
    color:var(--muted);
    font-size:0.95rem;
}

.legal-signin:hover{ color:var(--text); text-decoration:none; }

/* ---------- Layout ---------- */

.legal-layout{
    display:grid;
    grid-template-columns:230px minmax(0, 1fr);
    gap:56px;
    padding:56px 0 80px;
    align-items:start;
}

/* ---------- Table of contents ---------- */

.legal-toc{
    position:sticky;
    top:104px;
    font-size:0.9rem;
}

.legal-toc-heading{
    margin:0 0 14px;
    color:var(--text);
    font-weight:600;
}

.legal-toc ol{
    list-style:none;
    margin:0;
    padding:0;
    counter-reset:toc;
    border-left:1px solid var(--line);
}

.legal-toc li{
    counter-increment:toc;
    position:relative;
}

.legal-toc a{
    display:block;
    padding:7px 0 7px 16px;
    color:var(--muted);
    line-height:1.4;
    border-left:2px solid transparent;
    margin-left:-1px;
    transition:color var(--transition), border-color var(--transition);
}

.legal-toc a::before{
    content:counter(toc) ".";
    margin-right:7px;
    opacity:0.55;
}

.legal-toc a:hover{
    color:var(--text);
    border-left-color:var(--primary);
    text-decoration:none;
}

/* ---------- Body copy ---------- */

.legal-body{
    max-width:68ch;
}

.legal-body h1{
    margin:0 0 10px;
    font-size:clamp(2.1rem, 4vw, 2.9rem);
    line-height:1.1;
    letter-spacing:-0.03em;
}

.legal-meta{
    margin:0 0 8px;
    color:var(--muted);
    font-size:0.92rem;
}

.legal-body section{
    padding-top:44px;
    scroll-margin-top:100px;
}

.legal-body h2{
    display:flex;
    align-items:baseline;
    gap:14px;
    margin:0 0 18px;
    font-size:1.45rem;
    line-height:1.25;
    letter-spacing:-0.02em;
}

.legal-num{
    color:var(--primary);
    font-variant-numeric:tabular-nums;
    font-size:0.95rem;
    font-weight:700;
    flex-shrink:0;
    min-width:1.6em;
}

.legal-body h3{
    margin:30px 0 10px;
    font-size:1.05rem;
    color:#dbe7ff;
}

.legal-body p{
    margin:0 0 16px;
    color:var(--muted);
    line-height:1.75;
}

.legal-body strong{ color:var(--text); font-weight:600; }

.legal-body ul{
    margin:0 0 16px;
    padding-left:20px;
    color:var(--muted);
    line-height:1.75;
}

.legal-body li{ margin-bottom:9px; }

.legal-body code{
    font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size:0.88em;
    background:var(--panel-light);
    border:1px solid var(--line);
    border-radius:6px;
    padding:2px 6px;
    color:var(--text);
}

.legal-aside{
    border-left:2px solid var(--line);
    padding-left:16px;
    font-style:italic;
}

.legal-address{
    color:var(--muted);
    line-height:1.9;
}

/* ---------- Company facts ---------- */

.legal-facts{
    margin:0 0 20px;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:2px 22px;
    align-items:baseline;
}

.legal-facts dt{
    color:var(--muted);
    font-size:0.92rem;
    padding:7px 0;
}

.legal-facts dd{
    margin:0;
    padding:7px 0;
    color:var(--text);
}

/* ---------- Tables ---------- */

.legal-table-wrap{
    margin:0 0 18px;
    overflow-x:auto;
    border:1px solid var(--line);
    border-radius:var(--radius-md);
}

.legal-table{
    width:100%;
    border-collapse:collapse;
    font-size:0.94rem;
}

.legal-table th{
    text-align:left;
    padding:13px 16px;
    color:#d7e4fb;
    font-weight:600;
    border-bottom:1px solid var(--line);
    background:rgba(255,255,255,0.02);
    white-space:nowrap;
}

.legal-table td{
    padding:13px 16px;
    color:var(--muted);
    border-bottom:1px solid rgba(255,255,255,0.05);
    vertical-align:top;
}

.legal-table tbody tr:last-child td{ border-bottom:none; }

/* ---------- Footer ---------- */

.legal-footer{
    border-top:1px solid var(--line);
    padding:24px 0 40px;
}

.legal-footer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    color:var(--muted);
    font-size:0.9rem;
    padding-top:20px;
}

.legal-footer-links{
    display:flex;
    gap:20px;
}

.legal-footer-links a{ color:var(--muted); }
.legal-footer-links a:hover{ color:var(--text); }

/* ---------- Responsive ---------- */

@media (max-width: 900px){
    .legal-layout{
        grid-template-columns:1fr;
        gap:32px;
        padding:36px 0 60px;
    }

    .legal-toc{
        position:static;
        border:1px solid var(--line);
        border-radius:var(--radius-md);
        padding:18px 20px;
    }

    .legal-toc ol{
        border-left:none;
        columns:2;
        column-gap:24px;
    }

    .legal-toc a{
        padding:5px 0;
        border-left:none;
        margin-left:0;
    }

    .legal-toc a:hover{ border-left-color:transparent; }
}

@media (max-width: 560px){
    .legal-container{ width:min(calc(100% - 24px), 1140px); }

    .legal-toc ol{ columns:1; }

    .legal-facts{
        grid-template-columns:1fr;
        gap:0;
    }

    .legal-facts dt{ padding:10px 0 0; }
    .legal-facts dd{ padding:0 0 6px; }

    .legal-body h2{
        flex-direction:row;
        font-size:1.3rem;
        gap:10px;
    }
}

.legal-email{
    white-space:nowrap;
}