/* 2026-10-19 THE LEGAL PAGES (James: "we need it for aedonyx"). Privacy and Terms in the Services page's language: a small
   title and a big statement on top, a dashed rule, then the sections as numbered rows. A short contents list on the left
   on desktop. Loaded by privacy/ and terms/ after the four shared sheets; landing and discuss load it for their links only. */
.legal{border-top:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 clamp(20px,2.4vw,40px);align-content:start;
  padding-block:clamp(22px,3vh,40px) clamp(56px,8vh,104px)}
.legal .sec-head{grid-column:1/5;grid-row:1;padding-top:.25em}
.legal .sec-head h1{margin-top:0;font-family:var(--sans);font-weight:600;font-size:clamp(20px,1.5vw,24px);line-height:1.15;letter-spacing:-.018em;color:var(--plate)}
.legal-switch{display:flex;gap:4px 20px;margin:10px 0 0;padding:0;list-style:none;font:500 14px/1.4 var(--sans)}
.legal-switch a{display:inline-block;padding:6px 0;color:var(--muted);text-decoration:none;border-bottom:1px solid transparent}
.legal-switch a:hover{color:var(--film)}
.legal-switch a[aria-current="page"]{color:var(--film);border-bottom-color:var(--film)}
.legal-lead{grid-column:5/13;grid-row:1;margin:0;max-width:30ch;color:var(--film);font:500 clamp(24px,2.3vw,34px)/1.22 var(--sans);letter-spacing:-.016em;text-wrap:balance}
.legal-date{grid-column:5/13;grid-row:2;margin:14px 0 0;color:var(--muted);font:400 13px/1.5 var(--sans)}
.legal::before{content:"";grid-column:1/-1;grid-row:3;align-self:start;height:0;margin-top:clamp(20px,2.6vh,32px);border-top:1px dashed var(--dash)}

.legal-toc{grid-column:1/4;grid-row:4;align-self:start;position:sticky;top:88px;margin-top:clamp(20px,2.6vh,32px)}
.legal-toc ol{margin:0;padding:0;list-style:none;font:400 13.5px/1.4 var(--sans)}
.legal-toc li{margin:0}
.legal-toc a{display:block;padding:5px 0;color:var(--muted);text-decoration:none}
.legal-toc a:hover{color:var(--film)}
.legal-toc .toc-part{margin-top:14px;color:var(--plate);font-weight:600}
.legal-toc .toc-part:first-child{margin-top:0}

.legal-body{grid-column:5/13;grid-row:4;margin-top:clamp(8px,1.2vh,16px);max-width:68ch}
.legal-part{margin:40px 0 4px;padding-top:0;font:600 clamp(18px,1.3vw,20px)/1.25 var(--sans);letter-spacing:-.012em;color:var(--plate)}
.legal-part:first-child{margin-top:12px}
.legal-part-intro{margin:0 0 6px;color:var(--muted);font-size:15px;line-height:1.6}
.legal-sec{display:grid;grid-template-columns:44px minmax(0,1fr);padding:16px 0 18px;border-top:1px dashed var(--dash);scroll-margin-top:84px}
.legal-sec:last-child{border-bottom:1px dashed var(--dash)}
.legal-body>.legal-sec:first-child{border-top:0;padding-top:4px}  /* the page's dashed rule is already above it */
.legal-n{grid-row:1/3;margin-top:3px;font:500 12px/1.6 var(--sans);letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--dim)}
.legal-sec h2,.legal-sec h3{margin:0 0 6px;font:600 17px/1.3 var(--sans);letter-spacing:-.012em;color:var(--film)}
.legal-sec p,.legal-sec li{color:var(--plate);font-size:15.5px;line-height:1.62}
.legal-sec p{margin:0 0 10px}
.legal-sec p:last-child{margin-bottom:0}
.legal-sec ul{margin:0 0 10px;padding:0;list-style:none}
.legal-sec ul:last-child{margin-bottom:0}
.legal-sec li{position:relative;margin:0 0 8px;padding-left:20px}
.legal-sec li::before{content:"";position:absolute;left:0;top:.8em;width:9px;border-top:1px solid var(--dim)}
.legal-sec b{color:var(--film);font-weight:600}
.legal-sec a{color:inherit;text-decoration-color:var(--hair);text-underline-offset:3px}
.legal-sec a:hover{text-decoration-color:var(--film)}
.legal-addr{margin:8px 0 12px;padding:12px 14px;border:1px solid var(--rule);border-radius:8px;background:var(--paper-hi);color:var(--film);font-size:15px;line-height:1.6}

@media (max-width:900px){
  .legal{padding-block:36px 64px}
  .legal .sec-head{grid-column:1/-1;grid-row:1;padding-top:0}
  .legal .sec-head h1{font-size:20px;line-height:1.2;color:var(--muted);letter-spacing:-.01em}
  .legal-lead{grid-column:1/-1;grid-row:2;margin-top:10px;font-size:26px;line-height:1.28;letter-spacing:-.018em;max-width:22ch}
  .legal-date{grid-column:1/-1;grid-row:3}
  .legal::before{grid-row:4;margin-top:22px}
  .legal-toc{display:none}
  .legal-body{grid-column:1/-1;grid-row:5;margin-top:10px}
  .legal-sec{grid-template-columns:36px minmax(0,1fr)}
  .legal-sec p,.legal-sec li{font-size:15px}
}

/* links into the legal pages from the pages that have no footer list of their own */
.hero-legal{display:flex;gap:18px;margin:0;font:400 12.5px/1.4 var(--sans)}
.hero-legal a{display:inline-block;padding:6px 0;color:var(--muted);text-decoration:none}
.hero-legal a:hover{color:var(--film)}
@media (min-width:901px){
  .hero.hero-two{position:relative}
  .hero-two .hero-legal{position:absolute;right:max(var(--gutter),calc((100% - 1320px)/2));bottom:clamp(14px,1.6vw,24px);z-index:2}
}
@media (max-width:900px){.hero-two .hero-legal{width:min(1320px,calc(100% - var(--gutter)*2));margin:4px auto 20px}}
.door-legal{margin:14px 0 0;color:var(--muted);font:400 13px/1.5 var(--sans)}
.door-legal a{color:inherit;text-decoration-color:var(--hair);text-underline-offset:3px}
.door-legal a:hover{color:var(--film)}

/* 2026-10-19 review: Services and Discuss titles are the page H1 now (were H2). The same look as the H2 rules in
   site/firm/services.css, measured before the swap (1440: 21.6px plate / 40.32px film; 390: 20px muted / 28px). */
.sec-head h1,.door h1{font-family:var(--sans);font-weight:600;letter-spacing:-.022em;text-wrap:balance}
.door h1{margin-top:14px;color:var(--film);font-size:clamp(28px,2.8vw,44px);line-height:1.08}
.services .sec-head h1{margin-top:0;font-size:clamp(20px,1.5vw,24px);line-height:1.15;letter-spacing:-.018em;color:var(--plate)}
@media (max-width:900px){.services .sec-head h1{font-size:20px;line-height:1.2;color:var(--muted);letter-spacing:-.01em}}
