/* legal.css: owned by P6 (privacy, terms, 404, add). Page-only CSS on top of /site.css tokens. */

/* ---------- Legal pages (privacy, terms) ---------- */
.lg-hero{padding-bottom:var(--s-10)}
.lg-hero .eyebrow{margin-bottom:12px}
.lg-hero h1{max-width:14ch}
.lg-hero .updated{margin-top:16px;font-size:var(--t-small);font-weight:500;color:var(--text-2)}
.lg-note{margin-top:var(--s-9);padding:32px;border-radius:var(--r-lg);background:var(--beige)}
.lg-note p{font-size:var(--t-lead);line-height:1.5;letter-spacing:-.01em;color:var(--text);max-width:60ch}
.lg-note .eyebrow{display:flex;margin-bottom:12px}
.lg-note .eyebrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.lg{display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s-12);align-items:start;padding-bottom:var(--sec)}
.lg__aside{position:sticky;top:calc(var(--nav-h) + 32px);max-height:calc(100vh - var(--nav-h) - 64px);overflow:auto;padding-block:4px}
.lg__aside h2,.lg-toc summary{font-size:var(--t-small);font-weight:600;letter-spacing:0;color:var(--text-2)}
.lg__aside h2{margin-bottom:8px}
.lg-toc__list{list-style:none;margin:0;padding:0}
.lg-toc__list a{position:relative;display:flex;align-items:center;min-height:44px;padding:6px 0 6px 16px;font-size:15px;font-weight:500;line-height:1.3;color:var(--text-2);border-left:2px solid var(--hair);transition:color var(--d-fast) var(--ease),border-color var(--d-fast) var(--ease)}
.lg-toc__list a:hover{color:var(--text)}
.lg-toc__list a.is-on{color:var(--text);border-left-color:var(--accent-ink);font-weight:600}
.lg-toc{display:none}

.lg__body{max-width:680px;min-width:0}
.lg__body h2{font-size:var(--t-h3);line-height:1.15;letter-spacing:-.012em;margin:var(--s-10) 0 var(--s-4);scroll-margin-top:calc(var(--nav-h) + 24px)}
.lg__body h2:first-child{margin-top:0}
.lg__body p,.lg__body li{font-size:var(--t-body);line-height:1.6;color:var(--text)}
.lg__body p+p,.lg__body ul+p,.lg__body table+p,.lg__body p+ul{margin-top:1em}
.lg__body ul{padding-left:1.25em;margin:0}
.lg__body li+li{margin-top:.6em}
.lg__body li::marker{color:var(--accent-ink)}
.lg__body a{color:var(--accent-ink);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.lg__body a:hover{text-decoration-thickness:2px}
.lg__body strong{font-weight:600}

/* Data table: a rounded card on desktop, stacked cards on phones. */
.lg-table{width:100%;border-collapse:separate;border-spacing:0;margin:var(--s-6) 0;background:var(--bg-alt);border-radius:var(--r-md);overflow:hidden}
.lg-table th{text-align:left;font-size:var(--t-small);font-weight:600;color:var(--text-2);padding:16px 20px;border-bottom:1px solid var(--hair)}
.lg-table td{vertical-align:top;padding:18px 20px;font-size:15px;line-height:1.5;color:var(--text)}
.lg-table td+td{color:var(--text-2)}
.lg-table tr+tr td{border-top:1px solid var(--hair)}
.lg-table td:first-child{width:58%}

/* End card */
.lg-end{margin-top:var(--s-11);padding:32px;border-radius:var(--r-lg);background:var(--bg-alt)}
.lg-end h2{margin:0;font-size:var(--t-h3)}
.lg-end p{margin-top:8px;color:var(--text-2)}
.lg-end .ctas{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:20px}
.lg__body .lg-end a{text-decoration:none}
.lg__body .lg-end .btn{color:var(--pill-ink)}
.lg__body .lg-end .more:hover{text-decoration:underline}

@media (max-width:1068px){
  .lg{grid-template-columns:minmax(0,1fr);gap:0}
  .lg__aside{display:none}
  .lg-toc{display:block;margin-bottom:var(--s-9);border-radius:var(--r-md);background:var(--bg-alt)}
  .lg-toc summary{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 20px;font-size:17px;color:var(--text);cursor:pointer;list-style:none}
  .lg-toc summary::-webkit-details-marker{display:none}
  .lg-toc summary::after{content:"+";font-size:26px;font-weight:400;line-height:1;color:var(--text-2);transition:transform var(--d-ui) var(--ease)}
  .lg-toc[open] summary::after{transform:rotate(45deg)}
  .lg-toc .lg-toc__list{padding:0 20px 12px}
  .lg__body{max-width:none}
}
@media (max-width:734px){
  .lg-note,.lg-end{padding:24px}
  .lg-table,.lg-table tbody,.lg-table tr,.lg-table td{display:block;width:100%!important}
  .lg-table{background:none;border-radius:0;overflow:visible}
  .lg-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .lg-table tr{background:var(--bg-alt);border-radius:var(--r-md);padding:4px 0}
  .lg-table tr+tr{margin-top:12px}
  .lg-table tr+tr td{border-top:0}
  .lg-table td{padding:14px 20px}
  .lg-table td+td{padding-top:0}
  .lg-table td+td::before{content:"Why: ";font-weight:600;color:var(--text)}
}
@media print{.lg{display:block}.lg__aside,.lg-toc,.lg-end{display:none}}

/* ---------- 404 ---------- */
.nf{text-align:center}
.nf__chat{display:flex;flex-direction:column;align-items:flex-end;gap:10px;width:min(320px,100%);margin:0 auto var(--s-9);padding:24px;border-radius:var(--r-lg);background:var(--beige)}
.nf__chat .msg{max-width:85%;font-size:15px;text-align:left}
.nf__typing{align-self:flex-start;display:inline-flex;gap:5px;padding:14px 16px;border-radius:18px;border-bottom-left-radius:6px;background:var(--bubble-in)}
.nf__typing i{width:7px;height:7px;border-radius:50%;background:var(--text-2);opacity:.35}
@media (prefers-reduced-motion:no-preference){
  .nf__typing i{animation:nf-dot 1.4s var(--ease) infinite}
  .nf__typing i:nth-child(2){animation-delay:.2s}.nf__typing i:nth-child(3){animation-delay:.4s}
}
@keyframes nf-dot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.nf h1{max-width:12ch;margin-inline:auto}
.nf .lead{margin:12px auto 0}
.nf .ctas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px;margin-top:32px}
.nf-pop .head{margin-bottom:var(--s-9)}
.nf-pop .link-card{min-height:88px;padding:20px 24px;border-radius:var(--r-lg)}
.nf-pop .link-card .chip{width:44px;height:44px;border-radius:12px}
.nf-pop .link-card .chip .ico{width:24px;height:24px}
.nf-pop .link-card .chip svg.ln-ico{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nf-pop .link-card>span:nth-child(2){flex:1;min-width:0}
.nf-pop .link-card::after{content:"\203A";font-size:24px;line-height:1;color:var(--text-2);transition:transform var(--d-fast) var(--ease)}
.nf-pop .link-card:hover::after{transform:translateX(3px)}
.nf-pop .link-card:hover b{text-decoration:underline;text-underline-offset:.18em}

/* ---------- /add ---------- */
.add{display:grid;place-items:center;min-height:calc(100svh - var(--nav-h) - 72px);padding-block:var(--s-12);background:var(--bg-alt)}
.add__card{width:min(440px,100% - 2*var(--gutter));padding:40px 32px 32px;border-radius:var(--r-lg);background:var(--card-on-alt);text-align:center}
.add__badge{position:relative;width:96px;height:96px;margin:0 auto}
.add__av{display:grid;place-items:center;width:96px;height:96px;border-radius:50%;background:var(--accent-ink);color:var(--bg);font-size:40px;font-weight:700;line-height:1;text-transform:uppercase}
.add__logo{position:absolute;right:-6px;bottom:-6px;width:40px;height:40px;border-radius:12px;border:3px solid var(--card-on-alt);box-sizing:content-box}
.add__card .eyebrow{display:flex;justify-content:center;margin-top:24px}
.add__card h1{font-size:clamp(32px,5vw,40px);line-height:1.1;letter-spacing:-.025em;margin-top:8px}
.add__handle{margin-top:8px;font-size:19px;font-weight:600;color:var(--text-2);overflow-wrap:anywhere}
.add__card .ctas{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:28px}
.add__card .btn{width:100%}
.add__note{margin-top:16px}
.add__steps{list-style:none;margin:28px 0 0;padding:24px 0 0;border-top:1px solid var(--hair);display:grid;gap:14px;text-align:left;counter-reset:st}
.add__steps li{display:flex;align-items:center;gap:14px;font-size:15px;line-height:1.4;color:var(--text)}
.add__steps li::before{counter-increment:st;content:counter(st);display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);font-size:14px;font-weight:700}
.add--missing [data-needs-name]{display:none}
@media (max-width:734px){.add{padding-block:var(--s-9)}.add__card{padding:32px 24px 24px}}
.nf__chat .msg small{opacity:1;font-weight:600}
body.page-add{background:var(--bg-alt)}