/* ==========================================================================
   Legal pages: privacy.html, terms.html, credits.html.
   One sheet for all three: same ruled column, same notice, same meta line.
   No new colours, no radius, no shadows.
   ========================================================================== */

/* Counsel notice under the page hero. Mint hairline, mono text. */
.notice{display:block;margin-top:32px;padding-left:16px;border-left:2px solid var(--accent);
  max-width:64ch;font-family:var(--mono);font-size:13px;line-height:1.6;
  letter-spacing:.01em;color:var(--dim)}

/* Intro paragraph above a ruled list. */
.legal-intro{color:var(--dim);font-size:17px;line-height:1.65;max-width:70ch;margin-bottom:48px}

/* Body copy inside the right column of a .rows list. */
.legal-body{max-width:68ch}
.legal-body p{color:var(--dim);line-height:1.7}
.legal-body p+p,.legal-body .bullets,.legal-body .tags{margin-top:16px}
.legal-body .bullets+p{margin-top:16px}
.legal-body strong{color:var(--text);font-weight:500}
.legal-body a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule)}
.legal-body a:hover{color:var(--accent);text-decoration-color:currentColor}

/* Longer rows than the default .rows rhythm: this is reading copy. */
.legal-rows>li{padding:36px 0;align-items:start}
.legal-rows h3{max-width:22ch}

/* A line the client must complete before launch. */
.blank{color:var(--accent);border-bottom:1px dashed currentColor;padding-bottom:1px;
  font-family:var(--mono);font-size:14px;letter-spacing:.02em}

/* Trailing notes and the dated last-updated line. */
.legal-notes{margin-top:40px;max-width:70ch}
.legal-notes p{color:var(--dim);font-size:15px;line-height:1.7}
.legal-notes p+p{margin-top:14px}
.legal-notes strong{color:var(--text);font-weight:500}
.meta{display:block;margin-top:40px;color:var(--dim)}
.meta a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule)}
.meta a:hover{color:var(--accent);text-decoration-color:currentColor}

/* --------------------------------------------------------------------------
   Credits: ruled definition list, file left, credit right.
   -------------------------------------------------------------------------- */
.group{font-size:var(--h-item);letter-spacing:-.02em;margin:56px 0 20px;display:flex;
  align-items:baseline;gap:14px;flex-wrap:wrap}
.group:first-of-type{margin-top:0}
.group .mono{font-weight:400;letter-spacing:.02em}

.credits{border-top:1px solid var(--rule)}
.credits>div{display:grid;grid-template-columns:5fr 7fr;gap:32px;padding:20px 0;
  border-bottom:1px solid var(--rule)}
.credits .file{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.02em;
  color:var(--dim);margin-bottom:6px}
.credits .subject{display:block;max-width:40ch;line-height:1.4}
.credits .by{display:block;line-height:1.4}
.credits .lic,.credits .mods{display:block;margin-top:6px;font-family:var(--mono);font-size:12px;
  letter-spacing:.02em;color:var(--dim);line-height:1.5}
.credits a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule)}
.credits a:hover{color:var(--accent);text-decoration-color:currentColor}

/* --------------------------------------------------------------------------
   Phones
   -------------------------------------------------------------------------- */
@media (max-width:880px){
  .credits>div{grid-template-columns:1fr;gap:10px}
}
@media (max-width:720px){
  .legal-rows>li{padding:28px 0}
  .legal-intro{margin-bottom:36px;font-size:16px}
  .notice{font-size:12px}
  .group{margin:40px 0 16px}
}

/* Inline code references (file and host names) inside legal copy. */
.legal-body code{font-family:var(--mono);font-size:.9em;letter-spacing:.01em;color:var(--text)}