/* ============================================================
   EDGEBOUND LABS — Legal / compliance document layout
   Reuses tokens & components from styles.css (dark premium).
   ============================================================ */

/* page sits on a darker radial like 404, nav stays dark-over-dark */
.legal-page{background:radial-gradient(125% 80% at 50% -8%,#191922 0%,var(--bg) 58%)}

/* ---------- document header ---------- */
.lg-hero{padding:148px 0 50px;position:relative}
.lg-hero .eyebrow{margin-bottom:18px}
.lg-hero h1{font-size:clamp(36px,5.4vw,62px);font-weight:800;letter-spacing:-.04em;line-height:1.04;max-width:18ch;margin-bottom:20px}
.lg-hero .lead{margin-top:0;max-width:64ch}
.lg-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.lg-meta .m{display:flex;flex-direction:column;gap:3px;padding:13px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.lg-meta .m .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.lg-meta .m .v{font-size:13.5px;font-weight:600;color:var(--t1)}

/* ---------- two-column doc body ---------- */
.lg-wrap{display:grid;grid-template-columns:248px 1fr;gap:56px;padding-bottom:110px;align-items:start}

/* sticky table of contents */
.lg-toc{position:sticky;top:92px}
.lg-toc .toc-lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--t3);margin-bottom:16px}
.lg-toc ol{list-style:none;counter-reset:toc;display:flex;flex-direction:column;gap:1px}
.lg-toc a{display:flex;gap:11px;align-items:baseline;padding:8px 11px;border-radius:9px;font-size:13px;line-height:1.4;color:var(--t2);transition:.2s var(--ease);border-left:2px solid transparent}
.lg-toc a .n{font-family:var(--mono);font-size:11px;color:var(--t3);flex-shrink:0;min-width:22px}
.lg-toc a:hover{background:var(--surface);color:var(--t1)}
.lg-toc a.active{color:var(--t1);background:var(--blue-soft);border-left-color:var(--blue-bright)}
.lg-toc a.active .n{color:var(--blue-bright)}

/* article / prose */
.lg-doc{max-width:760px;min-width:0}
.lg-sec{padding:30px 0 4px;border-top:1px solid var(--line)}
.lg-sec:first-child{border-top:none;padding-top:4px}
.lg-sec .sec-no{font-family:var(--mono);font-size:12px;color:var(--blue-bright);margin-bottom:10px}
.lg-sec h2{font-size:clamp(20px,2.6vw,27px);font-weight:800;letter-spacing:-.03em;line-height:1.2;margin-bottom:18px;scroll-margin-top:92px}
.lg-sec h3{font-size:16px;font-weight:700;letter-spacing:-.02em;margin:26px 0 12px;color:var(--t1)}
.lg-doc p{font-size:15px;line-height:1.78;color:var(--t2);margin-bottom:16px;text-wrap:pretty}
.lg-doc p strong,.lg-doc li strong{color:var(--t1);font-weight:700}
.lg-doc a:not(.btn){color:var(--blue-bright);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--line-2);transition:.2s}
.lg-doc a:not(.btn):hover{text-decoration-color:var(--blue-bright)}

/* lists */
.lg-doc ul.dot{list-style:none;display:flex;flex-direction:column;gap:11px;margin:4px 0 20px}
.lg-doc ul.dot > li{position:relative;padding-left:22px;font-size:15px;line-height:1.72;color:var(--t2)}
.lg-doc ul.dot > li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--blue-bright)}

/* definition list — ARCO & glossary */
.lg-defs{display:flex;flex-direction:column;gap:1px;margin:6px 0 22px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
.lg-def{padding:18px 20px;border-top:1px solid var(--line)}
.lg-def:first-child{border-top:none}
.lg-def dt{font-size:14.5px;font-weight:700;color:var(--t1);letter-spacing:-.01em;margin-bottom:6px;display:flex;align-items:center;gap:10px}
.lg-def dt .pill{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.04em;color:var(--blue-bright);border:1px solid var(--blue-soft);background:var(--blue-soft);padding:2px 8px;border-radius:6px}
.lg-def dd{font-size:14px;line-height:1.7;color:var(--t2)}

/* callout / note */
.lg-note{display:flex;gap:14px;padding:18px 20px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface);margin:6px 0 22px}
.lg-note svg{width:20px;height:20px;stroke:var(--blue-bright);fill:none;stroke-width:1.7;flex-shrink:0;margin-top:1px}
.lg-note p{margin:0;font-size:14px;color:var(--t2)}

/* contact / ARCO action card */
.lg-contact{margin:8px 0 8px;border:1px solid var(--line-2);border-radius:18px;background:linear-gradient(180deg,var(--surface),var(--bg-2));padding:28px 28px 26px}
.lg-contact .ct-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue-bright);margin-bottom:12px}
.lg-contact h3{margin:0 0 8px;font-size:19px}
.lg-contact p{margin-bottom:18px}
.lg-contact .ct-rows{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
.lg-contact .ct-rows .r{padding:14px 16px;border:1px solid var(--line);border-radius:11px;background:var(--bg)}
.lg-contact .ct-rows .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-bottom:5px}
.lg-contact .ct-rows .v{font-size:14px;font-weight:600;color:var(--t1);word-break:break-word}
.lg-contact .ct-rows .v a{color:var(--blue-bright)}

/* opt-out fines secundarios mini-form */
.lg-optout{display:flex;flex-direction:column;gap:9px;margin:4px 0 20px}
.lg-optout .opt{display:flex;align-items:flex-start;gap:13px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);font-size:14px;color:var(--t2);line-height:1.55}
.lg-optout .opt .bx{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--line-2);flex-shrink:0;margin-top:1px}

/* back-to-top / footer note inside doc */
.lg-updated{font-family:var(--mono);font-size:12px;color:var(--t3);margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}

/* data table — transfers / destinatarios */
.lg-table{width:100%;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:6px 0 22px;background:var(--surface);border-collapse:separate;border-spacing:0}
.lg-table th,.lg-table td{text-align:left;padding:14px 16px;font-size:13.5px;line-height:1.55;vertical-align:top;border-top:1px solid var(--line)}
.lg-table thead th{border-top:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);font-weight:500;background:var(--bg-2)}
.lg-table td{color:var(--t2)}
.lg-table td:first-child{color:var(--t1);font-weight:600}
.lg-table .geo{font-family:var(--mono);font-size:12px;color:var(--blue-bright);white-space:nowrap}
.lg-table-wrap{overflow-x:auto}

/* commitments / checklist list */
.lg-doc ul.check{list-style:none;display:flex;flex-direction:column;gap:11px;margin:4px 0 20px}
.lg-doc ul.check > li{position:relative;padding-left:30px;font-size:15px;line-height:1.72;color:var(--t2)}
.lg-doc ul.check > li::before{content:"";position:absolute;left:2px;top:4px;width:17px;height:17px;border-radius:5px;border:1.5px solid var(--blue-soft);background:var(--blue-soft);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A7CFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");background-size:12px;background-position:center;background-repeat:no-repeat}

@media(max-width:920px){
  .lg-wrap{grid-template-columns:1fr;gap:0}
  .lg-toc{position:static;margin-bottom:38px;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
  .lg-toc ol{display:grid;grid-template-columns:1fr 1fr;gap:1px}
}
@media(max-width:560px){
  .lg-hero{padding:120px 0 36px}
  .lg-toc ol{grid-template-columns:1fr}
  .lg-contact .ct-rows{grid-template-columns:1fr}
}