/* Saggar Studio legal pages. Extends ../work/case-study.css. */
.lg-title { margin-top: 20px; font-size: clamp(3rem, 8vw, 7rem); line-height: .9; }
.lg-hero .cs-hero__grid { align-items: start; }
.lg-draft { display: inline-flex; margin: 32px 0 0; padding: 8px 12px; border: 1px dashed var(--signal); border-radius: 3px; color: var(--ink); }
.lg-ph { background: color-mix(in oklch, var(--signal) 12%, transparent); color: var(--ink); border-bottom: 1.5px dashed var(--signal); border-radius: 2px; padding: 0 2px; }
.lg-body { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 64px; align-items: start; padding-bottom: 112px; }
.lg-toc { position: sticky; top: 96px; padding-top: 16px; border-top: 1px solid var(--line-strong); }
.lg-toc p { margin: 0; color: var(--ink-soft); }
.lg-toc ol { display: grid; margin: 12px 0 0; padding: 0; list-style: none; }
.lg-toc a { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 8px; padding: 6px 0; font-size: var(--type-sm); line-height: 1.4; color: var(--ink-soft); text-decoration: none; }
.lg-toc a span { font: 400 11px/1.9 var(--font-mono); letter-spacing: .08em; }
.lg-toc a:hover { color: var(--ink); }
.lg-doc { min-width: 0; }
.lg-summary { margin-bottom: 40px; padding: 28px 32px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--clay); }
.lg-summary h2 { margin: 12px 0 0; font-family: var(--font-display); font-weight: 200; font-variation-settings: var(--display-variation); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.02; }
.lg-summary ul { margin: 20px 0 0; padding-left: 1.2rem; }
.lg-summary li { font-size: var(--type-base); line-height: 1.6; }
.lg-summary li + li { margin-top: 8px; }
.lg-summary .cs-note { margin-top: 20px; }
.lg-sec { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: 24px; padding: 40px 0; border-top: 1px solid var(--line-strong); scroll-margin-top: 80px; }
.lg-sec__n { margin: 0; font-family: var(--font-display); font-weight: 200; font-variation-settings: var(--display-variation); font-size: 2rem; line-height: 1; color: var(--signal); }
.lg-sec h2 { margin: 0; font-family: var(--font-display); font-weight: 200; font-variation-settings: var(--display-variation); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.02; }
.lg-prose { max-width: 46rem; }
.lg-prose > * { margin: 0; }
.lg-prose > * + * { margin-top: 16px; }
.lg-prose > h2 + * { margin-top: 24px; }
.lg-prose p, .lg-prose li { font-size: var(--type-base); line-height: 1.65; text-wrap: pretty; }
.lg-prose h3 { margin-top: 32px !important; font: 600 var(--type-base)/1.4 var(--font-sans); }
.lg-prose ul { padding-left: 1.2rem; }
.lg-prose li + li { margin-top: 8px; }
.lg-prose li::marker { color: var(--ink-soft); }
.lg-prose a { text-decoration-color: var(--line-strong); }
.lg-prose a:hover { text-decoration-color: currentColor; }
.lg-c { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 12px; }
.lg-c__n { font: 400 12px/2.3 var(--font-mono); color: var(--ink-soft); }
.lg-scroll { overflow-x: auto; }
.lg-table { width: 100%; min-width: 36rem; border-collapse: collapse; border-top: 1px solid var(--line-strong); }
.lg-table th, .lg-table td { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-size: var(--type-sm); line-height: 1.55; }
.lg-table thead th { font: 400 11px/1.6 var(--font-mono); text-transform: uppercase; letter-spacing: .16em; color: var(--ink-soft); }
.lg-table tbody th { font-weight: 600; }
.lg-table code, .lg-prose code { font-family: var(--font-mono); font-size: .88em; }
.lg-list { margin: 32px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line-strong); }
.lg-list a { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) auto; gap: 32px; align-items: baseline; padding: 28px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.lg-list__t { font-family: var(--font-display); font-weight: 200; font-variation-settings: var(--display-variation); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.02; }
.lg-list__d { font-size: var(--type-base); line-height: 1.6; color: var(--ink-soft); }
.lg-list__a { font-size: 1.5rem; color: var(--signal); transition: transform var(--dur-fast) ease; }
.lg-list a:hover { color: var(--ink); }
.lg-list a:hover .lg-list__a { transform: translateX(4px); }
.lg-group + .lg-group { margin-top: 72px; }
.lg-foot { display: flex; flex-wrap: wrap; gap: 4px 24px; max-width: var(--container); margin: 32px auto 0; padding-top: 24px; border-top: 1px solid var(--line-on-night-soft); font-size: var(--type-sm); }
.lg-foot a { display: inline-flex; align-items: center; min-height: 44px; color: var(--on-night-muted); text-decoration: none; }
.lg-foot a:hover, .lg-foot a[aria-current] { color: var(--on-night); text-decoration: underline; }
@media (max-width: 1023px) {
  .lg-body { grid-template-columns: 1fr; gap: 40px; }
  .lg-toc { position: static; }
  .lg-toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }
  .lg-list a { grid-template-columns: minmax(0, 1fr) auto; }
  .lg-list__d { grid-column: 1; grid-row: 2; }
}
@media (max-width: 767px) {
  .lg-toc ol { grid-template-columns: 1fr; }
  .lg-sec { grid-template-columns: 1fr; gap: 12px; }
  .lg-summary { padding: 24px 20px; }
  .lg-c { grid-template-columns: 2.5rem minmax(0, 1fr); gap: 8px; }
}