/* toca.io's additions on every /legal page, loaded last. Each page's own toca.legal styles are in
   legal-home.css, legal-cost.css and legal-calc.css. */

/* toca.io: a text link inside the small print keeps the small print's size (site.css sets .tlink to the body size) */
.footnote .tlink{font-size:inherit}

/* ── toca.io: the section keeps toca.legal's chrome (Mat, 9 Nov 2026) ──
   The pages carry body.legal, not body.io, so the parent's layout layer stays off them.
   What the shared pieces (Ami, the BBS, back to top) still need from body.io is set here. */
body.legal { --bbs-black: #0e0d0c; }
/* toca.io's nav over the film: its dropdown panels are paper, so their links keep ink, not the film's white */
.nav--film .menu li a { color: var(--color-ink-2); }
.nav--film .menu li a:hover { color: var(--color-ink); }
/* the law-firm home: toca.io's strip and nav laid over the film, as toca.legal's nav was. The wrapper is the
   absolute layer now; the header inside it keeps .nav--film for its white type but sits in the flow under the strip */
.legal-top--film { position: absolute; inset: 0 0 auto 0; z-index: var(--z-sticky); }
.legal-top--film .nav--film { position: relative; inset: auto; }
.legal-top--film .family { color: rgba(253,251,255,.72); border-bottom-color: rgba(253,251,255,.22); }
.legal-top--film .family a:hover, .legal-top--film .family a[aria-current] { color: #fdfbff; }
.legal-top--film .family .nerd { color: rgba(253,251,255,.72); }
.legal-top--film .family .nerd:hover { color: #fdfbff; background: rgba(13,6,24,.5); }
/* the film fold already reserves the nav's height over it; it reserves the strip's too */
body.legal .film-fold { padding-top: calc(var(--space-lg) * 2 + 3rem + 2.2rem + env(safe-area-inset-top, 0px)); }
/* the mobile demo bar (js/legal-chrome.js): Ami and back to top step up above it while it shows */
@media (max-width: 760px) {
  body.legal .cx-launch { transition: bottom .28s ease; }
  body.legal .totop { transition: bottom .28s ease, opacity .25s ease, transform .25s ease, background-color .15s ease; }
  body.cta-bar-on .cx-launch, body.cta-bar-on .totop { bottom: calc(4.5rem + env(safe-area-inset-bottom)); }
  body.cta-bar-on .cx { bottom: calc(7.75rem + env(safe-area-inset-bottom)); }
  body.cta-bar-on .cx:not(.docked) { max-height: calc(100svh - 9rem - env(safe-area-inset-bottom)); }   /* stepped up, it still stops short of the top (css/io.css, 11 Nov 2026) */
}
@media (prefers-reduced-motion: reduce) { body.legal .cx-launch, body.legal .totop { transition: none; } }

/* the frame on the law-firm pages (see io.css): past 1920px the film's text and pause button, the logo strip and the
   footer centre with the nav; the film and every background still run to the screen edges */
body.legal .film-annotation { margin-left: max(0px, calc(50% - var(--frame) / 2)); }
body.legal .film-pause { right: var(--frame-pad); }
body.legal .proof-bar--logos { padding-left: var(--frame-pad); padding-right: var(--frame-pad); }