/* ═══ THE CASE DOSSIER — the four stage pages: one lamp, moved ═══
   Stage 1 Analyse — warm lamp, ink-heavy notes
   Stage 2 Evidence — lamp pulled back cool, tags and labels
   Stage 3 Document — brightest lamp, paper dominates
   Stage 4 Hearing — lamp lowered, red returns */

.stage-hero{padding:clamp(3.6rem,8vw,6.5rem) 0 clamp(2.6rem,5vw,4rem)}
.crumbs{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;margin-bottom:2.2rem;
  font:700 .66rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--bone)}
.crumbs .here{color:var(--lamp)}
.stage-hero .typehead{font-size:clamp(1rem,2vw,1.25rem);margin-bottom:1.4rem}
.stage-hero h1{max-width:22ch;margin-bottom:1.2rem}
.stage-hero .lede{font-size:1.1rem}

/* the stage progress strip — the folder index, current one stamped.
   ⚠ these chips sit on light paper, so they wear ink, not muted grey. */
.progress{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:2.4rem}
.progress a{
  position:relative;display:grid;place-items:center;width:52px;height:44px;text-decoration:none;
  font:700 .8rem/1 var(--mono);color:var(--ink);
  background:linear-gradient(177deg,#F3ECDA,#DCD2BC);
  border-radius:3px;box-shadow:0 6px 14px rgba(0,0,0,.4);transition:transform .18s ease}
.progress a:hover{transform:translateY(-3px)}
.progress a.here{color:var(--stamp-ink);background:linear-gradient(177deg,var(--bone),var(--bone-2));
  outline:2px solid var(--stamp);outline-offset:-2px;transform:rotate(-3deg)}
.progress a i{position:absolute;inset-inline:0;bottom:5px;font:400 .5rem/1 var(--mono);
  font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

/* the two-column working desk: notes left, verdict right */
.desk{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:2.6rem;align-items:start;margin-top:1rem}
@media (max-width:900px){.desk{grid-template-columns:1fr}}
.desk .sheet ul{margin:1.2rem 0 0 1.1rem;display:grid;gap:.7rem;color:var(--ink-soft)}
.desk .sheet ul li::marker{color:var(--stamp-ink)}
.desk .sheet b{color:var(--ink)}

/* the verdict card — the stage's outcome, stamped */
.verdict-card{position:relative;background:linear-gradient(176deg,var(--manila),var(--manila-2));
  color:var(--ink);border-radius:3px;padding:1.9rem 1.6rem;
  box-shadow:0 14px 32px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.3) inset}
.verdict-card h3{font-family:var(--serif);color:var(--ink);margin-bottom:.6rem}
.verdict-card p{font-size:.94rem;color:var(--ink-soft)}
.verdict-card .stamp{position:absolute;top:-14px;right:12px;background:var(--desk)}
.verdict-card .btn{margin-top:1.4rem}

/* evidence tags (stage 2) */
.tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.tags span{font:700 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);background:linear-gradient(178deg,#F3ECDA,#E7DDC6);border-radius:2px;
  padding:.5rem .7rem .5rem 1.5rem;position:relative;box-shadow:0 4px 10px rgba(0,0,0,.35)}
.tags span::before{content:"";position:absolute;left:6px;top:50%;width:7px;height:7px;border-radius:50%;
  background:var(--desk);transform:translateY(-50%);box-shadow:0 0 0 1.5px var(--graphite)}
.tags span.ok{color:#1F4D33}
.tags span.warn{color:#7E5A14}
.tags span.miss{color:var(--stamp-ink)}

/* redaction bar (stage 2 atmosphere) */
.redact{display:inline-block;background:var(--ink);color:transparent;border-radius:1px;
  user-select:none;vertical-align:middle}

/* document sheet (stage 3) — the page itself becomes the deliverable */
.docsheet{max-width:760px;margin:2.6rem auto 0;transform:rotate(-.5deg)}
.docsheet .dochead{text-align:center;border-bottom:2px solid var(--ink);padding-bottom:1.2rem;margin-bottom:1.6rem}
.docsheet .dochead b{display:block;font:700 1.05rem/1.4 var(--serif);color:var(--ink);letter-spacing:.04em}
.docsheet .dochead span{font:400 .7rem/1.8 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--graphite)}
.docsheet p{margin-bottom:1rem}
.docsheet .fill{display:inline-block;min-width:120px;border-bottom:1px dotted var(--graphite);
  color:var(--graphite);font:400 .85rem/1 var(--mono);padding:0 .3rem .2rem;text-align:center}

/* summons card (stage 4) */
.summons{position:relative;border:2px solid var(--stamp-ink);border-radius:3px;padding:2rem 1.8rem;
  background:linear-gradient(178deg,var(--bone),var(--bone-2));color:var(--ink);
  box-shadow:0 14px 32px rgba(0,0,0,.5)}
.summons::before{content:"TRIBUNAL PREPARATION PACK";position:absolute;top:-11px;left:50%;transform:translateX(-50%) rotate(-2deg);
  background:var(--stamp-btn);color:#F6EFE2;font:700 .6rem/1 var(--mono);letter-spacing:.2em;
  padding:.45rem .8rem;border-radius:2px}
.summons ul{margin:1.1rem 0 0 1.1rem;display:grid;gap:.6rem;color:var(--ink-soft)}

/* next-stage link, styled as the next folder tab waiting on the desk */
.nextstage{margin-top:3.4rem;display:flex;justify-content:flex-end}
.nextstage a{
  position:relative;display:inline-block;text-decoration:none;color:var(--ink);
  background:linear-gradient(177deg,var(--manila),var(--manila-2));border-radius:0 0 5px 5px;
  padding:1.2rem 2rem 1.4rem;box-shadow:0 12px 26px rgba(0,0,0,.45);
  font:700 .78rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  transition:transform .2s ease}
.nextstage a::before{content:"NEXT →";display:block;font-size:.6rem;color:var(--stamp-ink);margin-bottom:.35rem}
.nextstage a:hover{transform:translateY(5px)}

/* ── reduced motion (2026-09-10) ─────────────────────────────────────────────────
   P6 has required this since 2026-08-28; this file shipped without it because
   nothing could fail. scripts/check-reduced-motion.mjs now refuses any animating
   stylesheet that carries no guard. Vestibular need, not a preference. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}