/* ============================================================
   Nova FX · readfx.css — reading pack (decluttered)
   Applied on post-*.html / verify.html / updates.html.
   Targets the .lx-doc body built by legalfx.

   Kept:   drop cap · h2 underline draw · soft paragraph
           reveal · pull-box accent bars (no glow) ·
           "min left" chip · finish mark · gradient hr.
   Removed: prose-link underline draw, inline-code glow,
           table-row hover transforms, accent-bar glow
           shadows, pulsing chip dot.
   ============================================================ */

/* ---- drop cap on the first body paragraph ---- */
.lx-body>p:first-of-type::first-letter{
  font-size:3.4em;font-weight:800;line-height:.82;float:left;
  padding:6px 10px 0 0;color:#bcd8ff;letter-spacing:-.04em;
  background:linear-gradient(180deg,#e6f1ff,#7fb0ff);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 4px 18px rgba(56,140,255,.35))}

/* ---- section header underline draw ----
   .lx-sec IS the <h2> (legalfx adds the class to the heading
   itself), so the selector must be h2.lx-sec, not .lx-sec h2. */
h2.lx-sec{position:relative;padding-bottom:10px}
h2.lx-sec::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:64px;
  border-radius:2px;background:linear-gradient(90deg,#3884ff,#38bdf8 60%,transparent);
  transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.2,.8,.2,1) .15s;
  box-shadow:0 0 14px rgba(56,140,255,.55)}
h2.lx-sec.rv-in::after,h2.lx-sec.in::after{transform:scaleX(1)}

/* ---- paragraph reveal (soft rise, staggered) ----
   Prose blocks only; component boxes (.pt-*) are divs and
   stay untouched. JS skips blocks another system claimed. */
.lx-body>p,.lx-body>ul,.lx-body>ol,.lx-body>blockquote{
  opacity:0;transform:translateY(6px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.lx-body>.rd-in{opacity:1;transform:none}

/* ---- pull boxes: static accent bar (no glow) ---- */
.pt-warn,.pt-note,.pt-quote{position:relative;overflow:hidden}
.pt-warn::before,.pt-note::before,.pt-quote::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,#f59e0b,#f97316)}
.pt-note::before{background:linear-gradient(180deg,#3884ff,#38bdf8)}
.pt-quote::before{background:linear-gradient(180deg,#a78bfa,#38bdf8)}

/* ---- key-takeaways / stat cards: corner ticks + lift ---- */
.pt-keys li,.pt-stats>div{transition:transform .3s,box-shadow .3s,border-color .3s}
.pt-keys li:hover{transform:translateX(4px);border-color:rgba(127,176,255,.3)}
.pt-stats>div:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(2,8,25,.5);
  border-color:rgba(127,176,255,.3)}
/* table rows: colour shift only — no transforms
   (postfx's .pt-table tbody tr owns its own background hover) */
.lx-body table tr{transition:border-color .3s}

/* ---- "time left" floating chip — slim, static dot ---- */
.rd-left{position:fixed;right:22px;bottom:22px;z-index:60;
  display:flex;align-items:center;gap:6px;padding:6px 12px;
  background:rgba(9,17,38,.88);border:1px solid rgba(127,176,255,.2);
  border-radius:99px;backdrop-filter:blur(10px);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;letter-spacing:.08em;color:#9db9e8;text-transform:uppercase;
  box-shadow:0 10px 34px rgba(2,8,25,.55);
  opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;
  pointer-events:none}
.rd-left.on{opacity:1;transform:none}
.rd-left b{color:#e8f2ff;font-weight:700}
.rd-left .rd-dot{width:5px;height:5px;border-radius:50%;background:#34d399;opacity:.45}
.rd-left.done .rd-dot{background:#38bdf8;opacity:.6}

/* ---- end-of-read finish mark ---- */
.rd-fin{display:flex;align-items:center;gap:12px;margin:44px 0 8px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;color:#7ee2b8}
.rd-fin::before,.rd-fin::after{content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,rgba(52,211,153,.4))}
.rd-fin::after{background:linear-gradient(90deg,rgba(52,211,153,.4),transparent)}
.rd-fin svg{width:14px;height:14px;flex:none}

/* ---- hr: single gradient rule (postfx doesn't style hr) ---- */
.lx-body hr{height:1px;border:0;margin:40px 0;
  background:linear-gradient(90deg,transparent,rgba(127,176,255,.25) 30%,rgba(56,189,248,.5) 50%,rgba(127,176,255,.25) 70%,transparent)}

@media (max-width:720px){
  .rd-left{right:12px;bottom:12px;padding:5px 10px;font-size:10px}
}
@media (prefers-reduced-motion:reduce){
  .lx-body>p,.lx-body>ul,.lx-body>ol,.lx-body>blockquote{opacity:1;transform:none;transition:none}
  h2.lx-sec::after{transition:none;transform:scaleX(1)}
  .rd-left{transition:opacity .2s}
}