/* ov-startups — /startups overlap pass (2026-09-30). Page-scoped (front matter `css: … ov-startups`, last).
   Warm, founder-y compositions on top of d29 + d29-startups; copy untouched.
   Moments: hero photo on a sand block with a real matter card pinned over its edge · #problem photo with a
   paper-stack square tucked over its corner, the three options stepping down · the #year statement as a card
   over the bundled-papers photograph · the Legal Room screenshot rising over a photo that runs off the left
   edge · plans stepping up like a staircase on a sand slab · a portrait under "Questions" · close card with a
   tilted photograph pinned over its corner. */

.ov-st{overflow-x:clip;--ov-sand:#E9DFCC;--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-st picture{display:block}

/* ---------- hero: sand block low-left behind the photo, matter card pinned across its left edge ---------- */
.ov-st .ov-hero{position:relative;isolation:isolate}
.ov-st .ov-hero::before{content:"";position:absolute;z-index:-1;left:-2rem;bottom:-2rem;width:62%;height:54%;border-radius:var(--radius-img);background:var(--ov-sand)}
.ov-st .ov-float{position:absolute;z-index:2;width:min(17rem,50%);left:-5rem;bottom:3rem;transform:rotate(-2deg)}
.ov-st .ov-card{width:100%;height:auto;border-radius:12px;background:#fff;box-shadow:var(--ov-shadow)}
@media (prefers-reduced-motion:no-preference){
  .ov-st .ov-float{animation:ov-st-pin .9s var(--ease) .35s both}
  @keyframes ov-st-pin{from{opacity:0;transform:translateY(18px) rotate(-2deg)}to{opacity:1;transform:rotate(-2deg)}}
}

/* ---------- #problem: a square of paper stack over the photo's lower-right corner; options top-aligned ---------- */
.ov-st .ov-prob{position:relative;padding:0 0 3rem}
.ov-st .ov-prob .st-prob-photo{width:88%}
.ov-st .ov-pile{position:absolute;right:0;bottom:0;width:36%;z-index:1}
.ov-st .ov-pile img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-img);border:6px solid var(--bg);box-shadow:var(--ov-shadow)}
.ov-st #problem .feat3>li{border-top-color:transparent;position:relative}
.ov-st #problem .feat3>li::before{content:"";position:absolute;left:0;top:-1px;width:3.25rem;height:1px;background:var(--accent)}

/* ---------- #year: the statement as a card rising over the bundled-papers photograph ---------- */
.ov-st .ov-yr-ph + #year{padding-top:0}
.ov-st #year .statement{position:relative;z-index:1;max-width:40rem;margin:-8rem 0 0 6%;padding:clamp(2rem,1.25rem + 2.5vw,3.25rem);background:var(--surface);border-radius:calc(var(--radius) + 4px);box-shadow:var(--ov-shadow);text-align:left}
.ov-st #year .statement .h2,.ov-st #year .statement .sub{margin-inline:0;text-align:left}
.ov-st .ov-yr-ph .photo-wide{object-position:50% 40%}

/* ---------- Legal Room: photo runs off the left edge, the screenshot rises over its bottom ---------- */
.ov-st .ov-lr-ph .photo-wide{width:calc(84% + (100vw - 100%) / 2);margin-left:calc((100% - 100vw) / 2);border-radius:0 var(--radius-img) var(--radius-img) 0;aspect-ratio:2.4/1}
.ov-st .ov-lr-ph + #legal-room{padding-top:0}
@media (min-width:961px){
  .ov-st #legal-room .split{align-items:start}
  .ov-st #legal-room .split-media.panel{position:relative;z-index:2;margin-top:-12rem;background:var(--ov-sand);box-shadow:var(--ov-shadow)}
  .ov-st #legal-room .split-text{padding-top:3.5rem}
}

/* ---------- #plans: four cards, top-aligned, on a sand slab ---------- */
.ov-st #plans .d29-plans{position:relative;isolation:isolate;align-items:start}
.ov-st #plans .d29-plans::before{content:"";position:absolute;z-index:-1;left:12%;right:-2rem;top:5.5rem;bottom:-2rem;border-radius:calc(var(--radius) + 6px);background:var(--ov-sand)}
@media (min-width:1100px){
  .ov-st #plans .d29-plans{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ov-st #plans .d29-plan{min-height:21rem}
}
.ov-st #plans .d29-plan{box-shadow:var(--ov-shadow)}
.ov-st #plans .st-plans-note{margin-top:calc(var(--stack-m) + 2rem)}

/* ---------- #questions: a portrait under the heading, on an offset sand block ---------- */
.ov-st .ov-q{position:relative;isolation:isolate;margin-top:var(--stack-l);max-width:24rem}
.ov-st .ov-q::before{content:"";position:absolute;z-index:-1;right:-1.5rem;top:2.5rem;width:70%;height:78%;border-radius:var(--radius-img);background:var(--ov-sand)}
.ov-st .ov-q img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-img);filter:saturate(.85)}

/* ---------- close: words left, a photograph pinned over the card's top-right corner ---------- */
.ov-st .ov-close{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:clamp(2rem,1rem + 3vw,4rem);text-align:left;overflow:visible;padding-block:clamp(3rem,2rem + 3vw,5rem)}
.ov-st .ov-close-t{grid-column:1;grid-row:1;padding-left:clamp(0rem,-1rem + 3vw,3rem)}
.ov-st .ov-close .h2{margin-inline:0;max-width:14ch}
.ov-st .ov-close .st-close-p{margin-inline:0}
.ov-st .ov-close .d29-cta-row{justify-content:flex-start}
.ov-st .ov-close-p{grid-column:2;grid-row:1;margin:-7rem -1.5rem -2rem 0;transform:rotate(2.5deg);background:#fff;padding:10px 10px 2.25rem;border-radius:6px;box-shadow:var(--ov-shadow);max-width:22rem;justify-self:end}
.ov-st .ov-close-p img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:3px}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .ov-st .ov-float{left:-2.5rem}
}
@media (max-width:960px){
  .ov-st .ov-hero::before{left:-.75rem;bottom:-1rem}
  .ov-st .ov-float{width:min(12.5rem,44%);left:auto;right:.75rem;bottom:-2.5rem}
  .ov-st .ov-hero{margin-bottom:2rem}
  .ov-st #year .statement{margin:-4rem .75rem 0;max-width:none}
  .ov-st .ov-lr-ph .photo-wide{width:calc(92% + (100vw - 100%) / 2);aspect-ratio:3/2}
  .ov-st #legal-room .split-media.panel{position:relative;z-index:2;margin:-5rem 0 0 6%;box-shadow:var(--ov-shadow);background:var(--ov-sand)}
  .ov-st #legal-room .split{row-gap:var(--stack-m)}
  .ov-st #legal-room .split-text{grid-row:2}
  .ov-st .ov-q{max-width:20rem;margin-bottom:1rem}
  .ov-st .ov-close{grid-template-columns:1fr;text-align:left;gap:var(--stack-m)}
  .ov-st .ov-close-p{grid-column:1;grid-row:1;margin:-5rem 0 0;justify-self:center;max-width:15rem}
  .ov-st .ov-close-t{grid-row:2;padding-left:0}
}
@media (max-width:700px){
  .ov-st .ov-pile{width:42%}
  .ov-st .ov-pile img{border-width:4px}
  .ov-st #plans .d29-plans::before{left:2rem;right:-1rem;top:3rem}
  .ov-st .ov-q{display:none}
}
@media (prefers-reduced-motion:reduce){.ov-st .ov-float{animation:none}}