/* ov-enterprise — /enterprise overlap pass (2026-09-30). Page-scoped (front matter `css: … ov-enterprise`, last).
   Composed, corporate compositions on top of d29 + d29-enterprise; copy untouched; the airport email, the six
   scenes and the held card are kept as they are and restyled around.
   Moments: hero photo running off the right edge with the sent email laid over its foot · the claim letter as a
   card crossing onto the lawyers' photo, which sits in an offset rule frame · the six-scenes heading as a card
   over the desk photograph · "today" as a card over a photo running off the right edge · the held card over a
   late-evening photo · the three ways stepping down · the dashboard on a sand slab, running off the right edge ·
   the rollout as a card rising over the full-bleed photo, its four steps climbing · a dark, split close card. */

.ov-en{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-bleed:calc((100vw - min(100vw, var(--max) + 2 * var(--gutter))) / 2 + var(--gutter))}
.ov-en picture{display:block}
.ov-en picture img{width:100%;height:auto}

/* ---------- hero: photo off the right edge, the sent email laid over its foot ---------- */
.ov-en .ov-hero{position:relative;align-self:end}
.ov-en .ov-hero-p{margin-right:calc(-1 * var(--ov-bleed))}
.ov-en .ov-hero-p img{aspect-ratio:1100/768;object-fit:cover;object-position:20% 50%;border-radius:var(--radius-img) 0 0 var(--radius-img);filter:saturate(.85)}
.ov-en .hero-media .ov-hero-p + .en-panel-card{flex:none;min-height:0;padding:0;background:none;position:relative;z-index:2;margin:-5.5rem 0 0 auto;width:min(30rem,86%);display:block}
.ov-en .hero-media .ov-hero-p + .en-panel-card .en-card{max-width:none;box-shadow:var(--ov-shadow)}
.ov-en .ov-hero figcaption{text-align:right}
@media (prefers-reduced-motion:no-preference){
  .ov-en .hero-media .ov-hero-p + .en-panel-card{animation:ov-en-rise .9s var(--ease) .35s both}
  @keyframes ov-en-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}

/* ---------- #cost: offset rule frame behind the photo; the claim letter crosses onto it ---------- */
.ov-en .ov-cost{position:relative;isolation:isolate}
.ov-en .ov-cost::before{content:"";position:absolute;z-index:-1;inset:1.75rem -1.75rem -1.75rem 1.75rem;border:1px solid var(--accent);border-radius:var(--radius-img);opacity:.45}
@media (min-width:961px){
  .ov-en #cost .split{align-items:end}
  .ov-en #cost .en-claim{position:relative;z-index:2;max-width:none;margin-right:-36%;margin-bottom:2rem;padding:1.75rem 2.25rem;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 var(--radius) var(--radius) 0;box-shadow:var(--ov-shadow)}
}

/* ---------- #pattern: the heading as a card over the desk photograph ---------- */
.ov-en .ov-pat-ph + #pattern{padding-top:0}
.ov-en #pattern .en-head{position:relative;z-index:1;margin:-7rem 8% var(--stack-l) 0;padding:clamp(1.75rem,1rem + 2.5vw,3rem) clamp(1.5rem,1rem + 2.5vw,3rem);background:var(--surface);border-radius:calc(var(--radius) + 4px);box-shadow:var(--ov-shadow)}

/* ---------- #today: photo runs off the left edge, the words on a card over its right side ---------- */
@media (min-width:961px){
  .ov-en #today .ov-today{align-items:center}
  .ov-en #today .split-text{grid-column:7/-1;grid-row:1;position:relative;z-index:2;background:var(--surface);border-radius:calc(var(--radius) + 4px);padding:clamp(2rem,1rem + 2.5vw,3.25rem);box-shadow:var(--ov-shadow)}
  .ov-en #today .split-media{grid-column:1/span 7;grid-row:1;margin-left:calc(-1 * var(--ov-bleed))}
  .ov-en #today .en-photo-tall{aspect-ratio:5/4;object-position:50% 72%;border-radius:0 var(--radius-img) var(--radius-img) 0}
}

/* ---------- #turn: the held card over a late-evening photo ---------- */
.ov-en .ov-turn{position:relative}
.ov-en .ov-turn-p{width:80%;margin:0 calc(-1 * var(--ov-bleed)) 0 auto}
.ov-en .ov-turn-p img{aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-img) 0 0 var(--radius-img)}
.ov-en .ov-turn .ov-turn-p + .en-panel-card{position:relative;z-index:2;background:none;padding:0;margin:-12rem 0 0;display:block}
.ov-en .ov-turn .en-hold{max-width:34rem;box-shadow:var(--ov-shadow)}

/* ---------- #how: three steps as cards, stepping down ---------- */
.ov-en #how .en-steps{align-items:start}
.ov-en #how .en-steps>li{border-top:0;background:var(--tint);border-radius:var(--radius);padding:1.75rem 1.75rem 2rem}
.ov-en #how .en-step-n{color:var(--accent)}
@media (min-width:961px){
  .ov-en #how .en-steps>li:nth-child(2){margin-top:2.5rem}
  .ov-en #how .en-steps>li:nth-child(3){margin-top:5rem}
}

/* ---------- #offer: the dashboard on a sand slab, running off the right edge ---------- */
.ov-en .ov-dash{position:relative;isolation:isolate;margin:0 calc(-1 * var(--ov-bleed)) var(--stack-l) 16%}
.ov-en .ov-dash::before{content:"";position:absolute;z-index:-1;left:-2rem;top:-2rem;width:46%;height:70%;border-radius:var(--radius-img);background:var(--ov-sand)}
.ov-en .ov-dash img{border-radius:12px 0 0 12px;box-shadow:var(--ov-shadow)}

/* ---------- #rollout: a card rising over the full-bleed photo; the four steps climb ---------- */
.ov-en .ov-roll-ph + #rollout{padding-top:0}
.ov-en .ov-roll{position:relative;z-index:1;margin-top:-10rem;background:var(--surface);border-radius:calc(var(--radius) + 6px);padding:clamp(2rem,1rem + 3vw,4rem);box-shadow:var(--ov-shadow)}
.ov-en .en-roll{align-items:start}
.ov-en .en-roll>li{border-top-color:transparent;position:relative}
.ov-en .en-roll>li::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--rule)}
.ov-en .en-roll>li:last-child::before{background:var(--accent)}
@media (min-width:1081px){
  .ov-en .en-roll>li:nth-child(1){margin-top:4.5rem}
  .ov-en .en-roll>li:nth-child(2){margin-top:3rem}
  .ov-en .en-roll>li:nth-child(3){margin-top:1.5rem}
}

/* ---------- close: dark split card on an offset sand slab ---------- */
.ov-en .close .d29-wrap{position:relative;isolation:isolate}
.ov-en .ov-close{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(2rem,1rem + 4vw,6rem);align-items:end;text-align:left;background:#141414;color:#F2EDE3;padding:clamp(3rem,2rem + 4vw,6rem) clamp(1.75rem,1rem + 4vw,5.5rem)}
.ov-en .ov-close::before{content:"";position:absolute;z-index:-1;inset:2rem -1.5rem -1.5rem 2rem;border-radius:inherit;background:var(--ov-sand)}
.ov-en .ov-close .h2{grid-column:1;grid-row:1/span 2;margin:0;color:#fff;max-width:12ch}
.ov-en .ov-close .h2 em.hl{color:#F4C77A}
.ov-en .ov-close p{grid-column:2;margin:0 0 var(--stack-m);max-width:none;color:rgba(242,237,227,.86)}
.ov-en .ov-close .d29-cta-row{grid-column:2;justify-content:flex-start}
.ov-en .ov-close .d29-btn-primary{background:#F2EDE3;color:#141414}
.ov-en .ov-close .d29-btn-primary:hover{background:#fff}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .ov-en .hero-media .ov-hero-p + .en-panel-card{margin:-4rem .75rem 0 auto;width:auto;max-width:30rem}
  .ov-en .ov-cost::before{inset:1rem -.75rem -.75rem 1rem}
  .ov-en #cost .split{row-gap:calc(var(--stack-l) + .5rem)}
  .ov-en #pattern .en-head{margin:-4rem .5rem var(--stack-l)}
  .ov-en #today .split-media{margin:0 10% 0 calc(-1 * var(--ov-bleed))}
  .ov-en #today .en-photo-tall{border-radius:0 var(--radius-img) var(--radius-img) 0}
  .ov-en .ov-turn-p{width:88%}
  .ov-en .ov-turn .ov-turn-p + .en-panel-card{margin-top:-8rem}
  .ov-en .ov-dash{margin-left:6%}
  .ov-en .ov-roll{margin-top:-5rem}
  .ov-en .ov-close{grid-template-columns:1fr}
  .ov-en .ov-close .h2{grid-row:auto;margin-bottom:var(--stack-m)}
  .ov-en .ov-close p,.ov-en .ov-close .d29-cta-row{grid-column:1}
}
@media (max-width:700px){
  .ov-en .ov-hero-p img{aspect-ratio:5/4;object-position:15% 50%}
  .ov-en .hero-media .ov-hero-p + .en-panel-card{margin:-3rem 0 0 1rem}
  .ov-en .ov-turn-p{width:92%}
  .ov-en .ov-turn-p img{aspect-ratio:1}
  .ov-en .ov-turn .ov-turn-p + .en-panel-card{margin-top:-6rem}
  .ov-en #pattern .en-head{margin-inline:0}
  .ov-en .ov-roll{padding:1.5rem 1.25rem}
  .ov-en .ov-close::before{inset:1rem -.75rem -.75rem 1rem}
}
@media (prefers-reduced-motion:reduce){.ov-en .hero-media .ov-hero-p + .en-panel-card{animation:none}}
@media (max-width:700px){
  .ov-en .ov-dash{margin-left:0}
  .ov-en .ov-dash::before{left:-1rem;top:-1rem;width:60%;height:85%}
}
