/* Smart Sifty - standalone documents: the legal pages (privacy-policy.html, terms-of-service.html)
   and the 404 page. Loaded after site.css and consent.css; tokens and site components only. */

@layer pages {
  a.skip-link { text-decoration: none; }
  .doc-main { display: block; min-height: 60vh; outline: none; }

  /* Legal documents: one readable prose column */
  .legal { padding-block: clamp(40px, 6vw, 80px) var(--section-pad); }
  .legal-doc { max-width: 48rem; margin-inline: auto; color: var(--ink-2); }
  .legal-doc__head {
    display: grid;
    gap: var(--space-4);
    padding-bottom: var(--space-6);
    margin-bottom: var(--space-6);
    border-bottom: 1px solid var(--line);
  }
  .legal-doc__meta { font-size: var(--step--1); color: var(--ink-3); }
  .legal-doc__intro { font-size: var(--step-1); line-height: 1.6; }
  .legal-doc__scope {
    margin-top: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border-left: 3px solid var(--accent);
    border-radius: 0 var(--r-sm) var(--r-sm) 0;
    background: var(--accent-soft);
  }
  .legal-doc section { margin-top: var(--space-7); }
  .legal-doc section > * + * { margin-top: var(--space-4); }
  .legal-doc h2 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--step-2);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    scroll-margin-top: calc(var(--header-h) + 24px);
  }
  .legal-doc__num {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--r-sm);
    background: var(--accent-soft);
    color: var(--accent-text);
    font: 600 0.85rem/1 var(--font-mono);
    letter-spacing: 0;
  }
  .legal-doc ul { display: grid; gap: var(--space-2); padding-left: 1.4em; }
  .legal-doc li::marker { color: var(--accent-text); }
  .legal-doc code { font-family: var(--font-mono); font-size: 0.88em; color: var(--accent-text); overflow-wrap: anywhere; }
  .legal-doc a { overflow-wrap: anywhere; }
  .legal-doc__card {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-5);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface);
    box-shadow: var(--shadow-1);
  }

  /* 404 */
  .nf { padding-block: clamp(64px, 10vw, 140px); }
  .nf__inner { display: grid; gap: var(--space-5); max-width: 42rem; }
}