/* ov-legal-room — /legal-room overlap pass (2026-09-30). Page-scoped, loaded last.
   Composition: "the archive". A thin frame behind the hero photo · the vault screenshot
   rises out of a full-bleed archive band · the Ask screenshot sits over a reader photo that runs
   off the right edge · a bundle photo peeks from behind the review-table panel · the four status
   keys become top-aligned, equal-height cards that sink into the pen photograph, and the sharing panel lifts over
   its foot · a fan of three overlapping photos above the uses · a square photo on the closing
   card's corner. Copy unchanged. */

.d29{--ov-shadow:0 0 0 1px rgba(0,0,0,.05),0 30px 60px -24px rgba(30,22,10,.35),0 12px 24px -12px rgba(30,22,10,.18);--ov-sand:#E9DFCC;
  --ov-bleed:max(var(--gutter),calc((100vw - var(--max)) / 2));--ov-filter:sepia(.14) saturate(.8) contrast(.96) brightness(1.04)}
.d29 :is(.ovr-band,.ovr-stage-p,.ovr-peek,.ovr-fan,.ovr-close-p) img{filter:var(--ov-filter)}

/* ---------- hero: a thin accent frame offset behind ---------- */
.d29 .ovr-hero{position:relative;isolation:isolate}
.d29 .ovr-hero::before{content:"";position:absolute;z-index:-1;top:-1.5rem;right:-1.5rem;bottom:1.5rem;left:1.5rem;border:1px solid var(--accent);opacity:.45;border-radius:calc(var(--radius-img) + 4px)}

/* ---------- vault: the screenshot rises out of a full-bleed archive band ---------- */
.d29 .ovr-vault{position:relative;isolation:isolate;padding-top:clamp(4rem,2rem + 6vw,9rem)!important}
.d29 .ovr-band{position:absolute;z-index:-1;inset:0 0 auto 0;height:68%;display:block}
.d29 .ovr-band img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.d29 .ovr-vault .panel{background:none;padding:0;max-width:72rem;margin-inline:auto}
.d29 .ovr-vault .panel .d29-shot{box-shadow:0 0 0 1px rgba(0,0,0,.06),0 40px 80px -30px rgba(20,14,6,.55),0 14px 30px -14px rgba(20,14,6,.3);border-radius:12px}

/* ---------- #search: the Ask screenshot over a reader photo that runs off the right edge ---------- */
.d29 .ovr-stage{position:relative;isolation:isolate;padding-block:clamp(3rem,2rem + 3vw,5rem)}
.d29 .ovr-stage-p{position:absolute;z-index:-1;top:0;bottom:0;left:58%;right:calc(-1 * var(--ov-bleed))}
.d29 .ovr-stage-p img{width:100%;height:100%;object-fit:cover;object-position:40% 40%;border-radius:var(--radius-img) 0 0 var(--radius-img)}
.d29 .ovr-stage .panel{width:84%;background:none;padding:0}
.d29 .ovr-stage .panel .d29-shot{box-shadow:var(--ov-shadow)}

/* ---------- #extract: a photo of tied bundles peeks from behind the panel ---------- */
.d29 #extract .split{isolation:isolate}
.d29 .ovr-extract{position:relative;overflow:visible}
.d29 .ovr-peek{position:absolute;z-index:-1;top:-3.5rem;right:-2.5rem;width:46%;display:block}
.d29 .ovr-peek img{width:100%;border-radius:var(--radius-img);box-shadow:var(--ov-shadow)}

/* ---------- #record: the status keys as staggered cards sinking into the pen photograph ---------- */
.d29 .ovr-record{padding-bottom:0}
.d29 .ovr-record .status{position:relative;z-index:2}
.d29 .ovr-record .d29-key{background:var(--surface);border-top:0;border-radius:var(--radius);padding:1.5rem 1.5rem 1.75rem;box-shadow:var(--ov-shadow)}
.d29 .ovr-bleed{margin-top:-7rem;z-index:1}

/* ---------- #access: the sharing panel lifts over the photograph's foot ---------- */
.d29 .ovr-access{border-top:0!important;padding-top:var(--stack-l)}
@media (min-width:961px){
  .d29 .ovr-access .split{align-items:start}
  .d29 .ovr-access .split-text{padding-top:3rem}
  .d29 .ovr-access .split-media{position:relative;z-index:2;margin-top:-11rem;box-shadow:var(--ov-shadow);background:linear-gradient(200deg,var(--tint) 0%,var(--tint) 55%,var(--ov-sand) 100%)}
}

/* ---------- #uses: a fan of three overlapping photographs ---------- */
.d29 .ovr-fan{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap);margin-top:var(--stack-m);padding-bottom:var(--stack-m)}
.d29 .ovr-fan picture{display:block}
.d29 .ovr-fan :is(.ovr-fan-a,.ovr-fan-b,.ovr-fan-c){grid-row:1}
.d29 .ovr-fan img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-img);border:6px solid var(--bg);box-shadow:var(--ov-shadow)}
.d29 .ovr-fan-a{grid-column:1/span 5;margin-top:3rem}
.d29 .ovr-fan-b{grid-column:5/span 4;z-index:1;margin-top:0}
.d29 .ovr-fan-c{grid-column:8/span 5;margin-top:5rem}
.d29 .ovr-fan-b img{aspect-ratio:4/5;object-position:45% 50%}
.d29.d29-anim .ovr-fan-b{transition-delay:120ms}
.d29.d29-anim .ovr-fan-c{transition-delay:240ms}

/* ---------- close: a square photograph on the card's top-right corner ---------- */
.d29 .ovr-close{position:relative;overflow:visible}
.d29 .ovr-close-p{position:absolute;top:-3rem;right:clamp(1.5rem,1rem + 3vw,4rem);width:clamp(9rem,6rem + 8vw,15rem);display:block}
.d29 .ovr-close-p img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius);border:6px solid var(--bg);box-shadow:var(--ov-shadow)}
.d29 .close:has(.ovr-close){padding-top:calc(var(--section) + 2rem)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .d29 .ovr-hero::before{top:-.75rem;right:-.5rem;left:.75rem;bottom:.75rem}
  .d29 .ovr-stage-p{left:40%}
  .d29 .ovr-stage .panel{width:92%}
  .d29 .ovr-peek{right:-.5rem;top:-2.5rem;width:40%}
  .d29 .ovr-bleed{margin-top:-4rem}
  .d29 .ovr-close-p{width:8.5rem;top:-2.5rem}
  .d29 .ovr-close{padding-top:6.5rem}
}
@media (max-width:700px){
  .d29 .ovr-vault{padding-top:3rem!important}
  .d29 .ovr-band{height:55%}
  .d29 .ovr-stage{padding-block:2rem 0}
  .d29 .ovr-stage-p{left:22%;bottom:auto;height:70%}
  .d29 .ovr-stage .panel{width:100%;padding-top:7rem}
  .d29 .ovr-peek{display:none}
  .d29 .ovr-record .d29-keys{row-gap:1rem}
  .d29 .ovr-bleed{margin-top:-3rem}
  .d29 .ovr-fan{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:.75rem}
  .d29 .ovr-fan-a{grid-column:1/span 4;margin-top:0}
  .d29 .ovr-fan-b{grid-column:4/span 3;margin-top:2.5rem}
  .d29 .ovr-fan .ovr-fan-c{grid-column:2/span 4;grid-row:2;margin-top:-2.5rem;z-index:2}
  .d29 .ovr-fan img{border-width:4px}
  .d29 .ovr-close-p{width:7rem;right:1rem}
}
@media (prefers-reduced-motion:reduce){.d29.d29-anim .ovr-fan-b,.d29.d29-anim .ovr-fan-c{transition-delay:0s}}