/* ═════════════════════════════════════════════════════════════
   DHALMIA — Upcoming / Forthcoming project template  (dh-upcoming v1.3)
   Wrapper: <div class="dh-scope dh-upc" data-page="<slug>" data-template="upcoming">
   The "intent" register of the project system: slate editorial page,
   drawings on a paper stage. Same tokens as .dh-home3 / .dh-case.
   Reusable — every upcoming project uses this template + its own data.
═════════════════════════════════════════════════════════════ */
.dh-upc{
  --slate-950:#141617;--slate-900:#1A1C1D;--slate-850:#212121;--slate-800:#272A2B;--slate-750:#2E3132;
  --paper:#E4E5E5;--paper-deep:#D6D8D8;--paper-ink:#1A1C1D;--paper-muted:#5C6163;--paper-hair:rgba(26,28,29,.14);
  --ink-0:#F1F2F2;--ink-1:#BEC2C3;--muted:#8C9092;
  --copper:#C87E33;--copper-bright:#E29A55;--copper-deep:#8F5620;--copper-frame:rgba(200,126,51,.34);
  --copper-metal:linear-gradient(125deg,#E8A75E 0%,#C87E33 46%,#98601F 100%);
  --hair:rgba(241,242,242,.09);--hair-strong:rgba(241,242,242,.16);
  --serif:'Cormorant Garamond',Georgia,serif;--sans:'Manrope',system-ui,sans-serif;
  --t-display:clamp(2.2rem,1rem + 3.6vw,4.6rem);--t-h2:clamp(1.9rem,1.1rem + 2.6vw,3.4rem);--t-h3:clamp(1.25rem,1.05rem + .9vw,1.8rem);
  --t-lede:clamp(1.08rem,.95rem + .55vw,1.4rem);--t-body:clamp(.95rem,.9rem + .2vw,1.05rem);--t-sm:clamp(.82rem,.78rem + .15vw,.9rem);--t-xs:clamp(.68rem,.64rem + .15vw,.74rem);
  --s-1:clamp(.4rem,.3rem + .3vw,.6rem);--s-2:clamp(.85rem,.6rem + .6vw,1.15rem);--s-3:clamp(1.35rem,.9rem + 1.2vw,2rem);--s-4:clamp(2rem,1.2rem + 1.9vw,3.1rem);--s-5:clamp(2.75rem,1.4rem + 3.4vw,4.9rem);
  --sec-y:clamp(4rem,1.8rem + 6vw,8.5rem);--gap:clamp(1.25rem,.7rem + 2.2vw,3.5rem);--pad-x:clamp(1.15rem,.5rem + 4vw,5.5rem);--wrap:1560px;
  --nav-h:clamp(4.25rem,3.5rem + 2vw,5.5rem);--ease:cubic-bezier(.16,1,.3,1);
  background:var(--slate-850);color:var(--ink-1);font-family:var(--sans);font-size:var(--t-body);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;
}
.dh-upc *,.dh-upc *::before,.dh-upc *::after{margin:0;padding:0;box-sizing:border-box}
.dh-upc ::selection{background:var(--copper);color:var(--slate-950)}
.dh-upc img{display:block;max-width:100%;height:auto}
.dh-upc a{color:inherit;text-decoration:none}
.dh-upc button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.dh-upc h1,.dh-upc h2,.dh-upc h3{font-family:var(--serif);color:var(--ink-0);font-weight:300;line-height:1.08;letter-spacing:-.008em}
.dh-upc em{font-style:italic}
.dh-upc :focus-visible{outline:2px solid var(--copper);outline-offset:4px}
.dh-upc .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad-x)}
.dh-upc .ovl{display:inline-flex;align-items:center;gap:.9rem;font-size:var(--t-xs);letter-spacing:.32em;text-transform:uppercase;color:var(--copper-bright);font-weight:500}
.dh-upc .ovl::before{content:"";width:2.4rem;height:1px;background:var(--copper)}
.dh-upc .st{display:inline-flex;align-items:center;gap:.7rem;font-size:var(--t-xs);letter-spacing:.28em;text-transform:uppercase;font-weight:500;color:var(--ink-0)}
.dh-upc .st::before{content:"";width:.4rem;height:.4rem;border-radius:50%;border:1px solid var(--copper)}   /* outlined dot = forthcoming */
.dh-upc .btn{display:inline-flex;align-items:center;gap:.8rem;font-size:var(--t-xs);letter-spacing:.24em;text-transform:uppercase;font-weight:500;padding:1.05rem 2rem;border:1px solid var(--hair-strong);color:var(--ink-0);min-height:44px;transition:border-color .4s var(--ease),color .4s var(--ease),background-color .4s var(--ease)}
.dh-upc .btn .ar{transition:transform .45s var(--ease)}.dh-upc .btn:hover .ar{transform:translateX(5px)}
.dh-upc .btn--solid{background:var(--copper);border-color:var(--copper);color:var(--slate-950);font-weight:600}.dh-upc .btn--solid:hover{background:var(--copper-bright);border-color:var(--copper-bright)}
.dh-upc .btn--ghost:hover{border-color:var(--copper);color:var(--copper-bright)}
.dh-upc .rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.dh-upc .rv.in{opacity:1;transform:none}
.dh-upc .num{font-family:var(--serif);font-style:italic;font-weight:300;line-height:1;background:var(--copper-metal);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ── Hero: editorial split (contained image, never a stretched background) ── */
.dh-upc .hero{padding:calc(var(--nav-h) + var(--s-4)) 0 var(--sec-y);background:var(--slate-950);border-bottom:1px solid var(--hair)}
.dh-upc .crumb{font-size:var(--t-xs);letter-spacing:.26em;text-transform:uppercase;color:var(--muted);display:flex;gap:.9rem;flex-wrap:wrap;margin-bottom:var(--s-4)}
.dh-upc .crumb a:hover{color:var(--copper-bright)}.dh-upc .crumb b{color:var(--copper-bright);font-weight:500}
.dh-upc .hero__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:calc(var(--gap) * 1.4);align-items:center}
.dh-upc .hero h1{font-size:var(--t-display);margin:var(--s-2) 0 var(--s-3);max-width:20ch;text-wrap:balance}
.dh-upc .hero__sum{font-family:var(--serif);font-style:italic;font-size:var(--t-lede);color:var(--ink-1);line-height:1.45;max-width:44ch;margin-bottom:var(--s-4)}
.dh-upc .snap{border-top:1px solid var(--hair-strong);max-width:560px}
.dh-upc .snap div{display:grid;grid-template-columns:minmax(8rem,1fr) 2fr;gap:var(--s-2);padding:.75rem 0;border-bottom:1px solid var(--hair);font-size:var(--t-sm)}
.dh-upc .snap dt{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.dh-upc .snap dd{color:var(--ink-0)}
.dh-upc .hero__fig{position:relative;padding:clamp(.9rem,2vw,1.6rem);border:1px solid var(--copper-frame)}
.dh-upc .hero__fig img{width:100%;aspect-ratio:3/2;object-fit:cover;filter:saturate(.92)}
.dh-upc .hero__fig figcaption{margin-top:var(--s-2);font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* ── Overview (sticky side + prose, as the case template) ── */
.dh-upc .story{padding-block:var(--sec-y)}
.dh-upc .story .wrap{display:grid;grid-template-columns:minmax(0,3.5fr) minmax(0,8fr);gap:var(--gap);align-items:start}
.dh-upc .side{position:sticky;top:calc(var(--nav-h) + 1rem)}
.dh-upc .side h2{font-size:var(--t-h2);margin-top:var(--s-2);max-width:12ch}
.dh-upc .side__jump{margin-top:var(--s-4);display:flex;flex-direction:column;gap:.5rem}
.dh-upc .side__jump a{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:.7rem;min-height:32px;transition:color .3s}
.dh-upc .side__jump a::before{content:"";width:1rem;height:1px;background:var(--hair-strong);transition:width .4s var(--ease),background .3s}
.dh-upc .side__jump a:hover,.dh-upc .side__jump a.on{color:var(--copper-bright)}.dh-upc .side__jump a:hover::before,.dh-upc .side__jump a.on::before{width:1.8rem;background:var(--copper)}
.dh-upc .prose{max-width:clamp(38ch,60vw,68ch)}
.dh-upc .prose p:first-child{font-family:var(--serif);font-size:var(--t-lede);font-style:italic;color:var(--ink-0);line-height:1.5}
.dh-upc .prose p + p{margin-top:var(--s-3)}

/* ── Programme (scope) — numbered rows, no cards, no icons ── */
.dh-upc .prog{padding-block:var(--sec-y);background:var(--slate-900);border-block:1px solid var(--hair)}
.dh-upc .prog__head{margin-bottom:var(--s-5)}.dh-upc .prog__head h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .prog__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--gap);border-top:1px solid var(--hair-strong)}
.dh-upc .prog__item{padding:var(--s-3) 0;border-bottom:1px solid var(--hair);position:relative}
.dh-upc .prog__item::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:var(--copper);transition:width 1.2s var(--ease)}
.dh-upc .prog__item.in::before{width:100%}
.dh-upc .prog__item .num{font-size:1.5rem;display:block;margin-bottom:var(--s-2)}
.dh-upc .prog__item h3{font-size:var(--t-h3);margin-bottom:.5rem}
.dh-upc .prog__item p{font-size:var(--t-sm);color:var(--muted);max-width:36ch}

/* ── Approach — pull statement ── */
.dh-upc .appr{padding-block:var(--sec-y)}
.dh-upc .appr .wrap{display:grid;grid-template-columns:minmax(0,3.5fr) minmax(0,8fr);gap:var(--gap)}
.dh-upc .appr .pull{font-family:var(--serif);font-size:clamp(1.5rem,1rem + 1.8vw,2.5rem);font-style:italic;font-weight:300;color:var(--ink-0);line-height:1.35;max-width:36ch;padding-left:var(--s-3);border-left:1px solid var(--copper)}

/* ── Plans & design development — paper drawing stage ── */
.dh-upc .plans{background:var(--paper);color:var(--paper-ink);padding-block:var(--sec-y)}
.dh-upc .plans .ovl{color:var(--copper-deep)}
.dh-upc .plans h2{color:var(--paper-ink);font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .plans__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
.dh-upc .plans__n{font-family:var(--serif);font-style:italic;color:var(--paper-muted);white-space:nowrap}
.dh-upc .plans__n b{font-style:normal;font-weight:400;font-size:1.6rem;color:var(--copper-deep)}
.dh-upc .sheets{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.dh-upc .sheet{grid-column:span 6;display:block;color:var(--paper-ink)}
.dh-upc .sheet:first-child{grid-column:span 12}
.dh-upc .sheet__fig{position:relative;background:#F2F3F3;border:1px solid var(--paper-hair);padding:clamp(.9rem,2vw,1.8rem);cursor:zoom-in}
.dh-upc .sheet__fig::after{content:"";position:absolute;inset:0;border:1px solid transparent;pointer-events:none;transition:border-color .6s var(--ease),inset .6s var(--ease)}
.dh-upc .sheet:hover .sheet__fig::after,.dh-upc .sheet:focus-visible .sheet__fig::after{border-color:var(--copper);inset:.6rem}
.dh-upc .sheet__fig img{width:100%;height:auto;object-fit:contain;mix-blend-mode:multiply}   /* intrinsic ratio preserved */
.dh-upc .sheet:first-child .sheet__fig img{max-height:76vh;margin-inline:auto;width:auto;max-width:100%}
.dh-upc .tb{margin-top:var(--s-2);border-top:1px solid var(--paper-ink);padding-top:var(--s-2);display:flex;justify-content:space-between;gap:var(--s-2);align-items:baseline}
.dh-upc .tb h3{font-size:clamp(1.05rem,.95rem + .5vw,1.35rem);color:var(--paper-ink);font-family:var(--serif)}
.dh-upc .tb span{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--paper-muted);white-space:nowrap}
.dh-upc .plans__note{margin-top:var(--s-4);font-size:var(--t-sm);color:var(--paper-muted);max-width:60ch}

/* ── Status ── */
.dh-upc .status{padding-block:var(--sec-y);background:var(--slate-900);border-block:1px solid var(--hair)}
.dh-upc .status .wrap{display:grid;grid-template-columns:minmax(0,3.5fr) minmax(0,8fr);gap:var(--gap)}
.dh-upc .status h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .status p{max-width:60ch}
.dh-upc .status dl{margin-top:var(--s-3);border-top:1px solid var(--hair-strong);max-width:560px}
.dh-upc .status dl div{display:grid;grid-template-columns:minmax(9rem,1fr) 2fr;gap:var(--s-2);padding:.75rem 0;border-bottom:1px solid var(--hair);font-size:var(--t-sm)}
.dh-upc .status dt{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}.dh-upc .status dd{color:var(--ink-0)}

/* ── CTA + related ── */
.dh-upc .cta{position:relative;padding-block:clamp(6rem,12vw,10rem);background:var(--slate-950);text-align:center;overflow:hidden}
.dh-upc .cta__frame{position:absolute;inset:clamp(.9rem,2vw,1.6rem);border:1px solid var(--copper-frame);pointer-events:none}
.dh-upc .cta .wrap{position:relative;z-index:1}
.dh-upc .cta .ovl{justify-content:center}.dh-upc .cta .ovl::before{display:none}
.dh-upc .cta h2{font-size:clamp(2.2rem,1rem + 4vw,4.6rem);max-width:18ch;margin:var(--s-2) auto var(--s-3)}
.dh-upc .cta p{max-width:48ch;margin:0 auto var(--s-4)}
.dh-upc .cta__row{display:flex;gap:var(--s-2);justify-content:center;flex-wrap:wrap}
.dh-upc .rel{padding-block:var(--sec-y)}
.dh-upc .rel__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
.dh-upc .rel h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .rel__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.dh-upc .card{display:block}
.dh-upc .card__fig{position:relative;overflow:hidden;background:var(--slate-800)}
.dh-upc .card__fig::after{content:"";position:absolute;inset:0;border:1px solid transparent;transition:border-color .6s var(--ease),inset .6s var(--ease)}
.dh-upc .card:hover .card__fig::after{border-color:var(--copper-frame);inset:.7rem}
.dh-upc .card__fig img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s var(--ease)}
.dh-upc .card:hover img{transform:scale(1.04)}
.dh-upc .card__row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2);margin-top:var(--s-2);border-bottom:1px solid var(--hair);padding-bottom:var(--s-2)}
.dh-upc .card h3{font-size:1.3rem;transition:color .4s}.dh-upc .card:hover h3{color:var(--copper-bright)}
.dh-upc .card__loc{font-size:var(--t-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* ── Lightbox for drawings (mock; production uses dh-image-lightbox) ── */
.dh-upc .lb{position:fixed;inset:0;z-index:100;background:rgba(20,22,23,.96);display:none;align-items:center;justify-content:center;padding:var(--s-4)}
.dh-upc .lb[data-open="true"]{display:flex}
.dh-upc .lb__stage{background:#F2F3F3;padding:clamp(.9rem,2vw,1.6rem);max-width:min(1400px,94vw);max-height:90vh;overflow:auto}
.dh-upc .lb__stage img{max-width:100%;max-height:calc(90vh - 5rem);width:auto;height:auto;mix-blend-mode:multiply}
.dh-upc .lb__cap{position:absolute;left:var(--pad-x);bottom:var(--s-3);color:var(--ink-1);font-size:var(--t-sm)}
.dh-upc .lb__btn{position:absolute;top:var(--s-3);width:44px;height:44px;border:1px solid var(--hair-strong);color:var(--ink-0);display:grid;place-items:center}
.dh-upc .lb__btn:hover{border-color:var(--copper);color:var(--copper-bright)}
.dh-upc .lb__close{right:var(--pad-x)}.dh-upc .lb__prev{top:50%;left:var(--s-3);transform:translateY(-50%)}.dh-upc .lb__next{top:50%;right:var(--s-3);transform:translateY(-50%)}

@media (max-width:1100px){
  .dh-upc .story .wrap,.dh-upc .appr .wrap,.dh-upc .status .wrap{grid-template-columns:1fr;gap:var(--s-4)}
  .dh-upc .side{position:static}.dh-upc .side__jump{display:none}
  .dh-upc .prog__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
  .dh-upc .hero__grid{grid-template-columns:1fr;gap:var(--s-4)}
  .dh-upc .hero__fig{order:2}
}
@media (max-width:700px){
  .dh-upc .prog__grid{grid-template-columns:1fr}
  .dh-upc .sheet{grid-column:span 12}
  .dh-upc .plans__head,.dh-upc .rel__head{flex-direction:column;align-items:flex-start}
  .dh-upc .rel__grid{grid-template-columns:1fr}
  .dh-upc .snap div,.dh-upc .status dl div{grid-template-columns:1fr;gap:.2rem}
  .dh-upc .cta__row{flex-direction:column;align-items:stretch}.dh-upc .cta__row .btn{justify-content:center}
  .dh-upc .tb{flex-direction:column;align-items:flex-start;gap:.3rem}
}
@media (prefers-reduced-motion:reduce){
  .dh-upc .rv{opacity:1;transform:none;transition:none}
  .dh-upc .card__fig img,.dh-upc .prog__item::before{transition:none}.dh-upc .prog__item.in::before{width:100%}
}

/* ── additions: template generalised for Ongoing (on-site) projects ──
   .st--site   filled copper dot (on site)      .tag  "Design Development" label on renders
   .mat        material language                .dd   sketch + render pairs               */
.dh-upc .st--site::before{background:var(--copper);border:0}
.dh-upc .tag{position:absolute;left:0;bottom:0;z-index:2;font-family:var(--sans);font-size:var(--t-xs);letter-spacing:.24em;text-transform:uppercase;font-weight:500;color:var(--ink-0);background:rgba(20,22,23,.86);padding:.5rem .8rem;pointer-events:none}
.dh-upc .hero__fig .tag{left:clamp(.9rem,2vw,1.6rem);bottom:auto;top:clamp(.9rem,2vw,1.6rem)}
.dh-upc .mat{padding-block:var(--sec-y);background:var(--slate-900);border-block:1px solid var(--hair)}
.dh-upc .mat__head{margin-bottom:var(--s-5)}.dh-upc .mat__head h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .mat__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.dh-upc .mat__col h3{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:.3em;text-transform:uppercase;font-weight:500;color:var(--copper-bright);padding-bottom:var(--s-2);border-bottom:1px solid var(--hair-strong);margin-bottom:var(--s-2)}
.dh-upc .mat__col ul{list-style:none}
.dh-upc .mat__col li{font-family:var(--serif);font-size:clamp(1.15rem,1rem + .5vw,1.5rem);color:var(--ink-0);padding:.55rem 0;border-bottom:1px solid var(--hair);display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2)}
.dh-upc .mat__col li::after{content:"";width:.35rem;height:.35rem;border-radius:50%;background:var(--copper);opacity:.6;flex:none}
.dh-upc .dd{padding-block:var(--sec-y)}
.dh-upc .dd__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
.dh-upc .dd__head h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .dd__n{font-family:var(--serif);font-style:italic;color:var(--muted);white-space:nowrap}.dh-upc .dd__n b{font-style:normal;font-weight:400;font-size:1.6rem;color:var(--copper-bright)}
.dh-upc .pair{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:center}
.dh-upc .pair + .pair{margin-top:var(--s-5)}
.dh-upc .pair__sketch{grid-column:1/8}.dh-upc .pair__render{grid-column:8/13}
.dh-upc .pair--flip .pair__sketch{grid-column:6/13;order:2}.dh-upc .pair--flip .pair__render{grid-column:1/6;order:1}
.dh-upc .pair .sheet__fig{background:#F2F3F3;padding:clamp(.9rem,2vw,1.6rem)}
.dh-upc .render{display:block;position:relative;margin:0}
.dh-upc .render .fig{position:relative;overflow:hidden;background:var(--slate-800);border:1px solid var(--hair)}
.dh-upc .render img{width:100%;height:auto;object-fit:contain;filter:saturate(.95)}
.dh-upc .render .cap{margin-top:var(--s-2);display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2);border-top:1px solid var(--hair);padding-top:var(--s-2)}
.dh-upc .render .cap h3{font-size:clamp(1.05rem,.95rem + .5vw,1.35rem)}.dh-upc .render .cap span{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.dh-upc .strip{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);margin-top:var(--s-5)}
.dh-upc .strip .render{grid-column:span 4}.dh-upc .strip .render--w{grid-column:span 6}
.dh-upc .strip .render .fig{aspect-ratio:4/3;display:grid;place-items:center}.dh-upc .strip .render img{max-height:100%;width:auto;max-width:100%}
.dh-upc .dd__note{margin-top:var(--s-4);font-size:var(--t-sm);color:var(--muted);max-width:60ch}
@media (max-width:1100px){.dh-upc .mat__grid{grid-template-columns:1fr 1fr}}
@media (max-width:960px){.dh-upc .pair__sketch,.dh-upc .pair__render,.dh-upc .pair--flip .pair__sketch,.dh-upc .pair--flip .pair__render{grid-column:1/13;order:0}.dh-upc .strip .render,.dh-upc .strip .render--w{grid-column:span 6}}
@media (max-width:700px){.dh-upc .mat__grid{grid-template-columns:1fr}.dh-upc .strip .render,.dh-upc .strip .render--w{grid-column:span 12}.dh-upc .dd__head{flex-direction:column;align-items:flex-start}}
/* pairs live on slate, not paper: override sheet defaults */
.dh-upc .pair .sheet.pair__sketch,.dh-upc .pair .sheet.pair__sketch:first-child{grid-column:1/8}
.dh-upc .pair--flip .sheet.pair__sketch,.dh-upc .pair--flip .sheet.pair__sketch:first-child{grid-column:6/13;order:2}
.dh-upc .pair .sheet:first-child .sheet__fig img{max-height:none;width:100%}
.dh-upc .dd .tb{border-top-color:var(--hair-strong)}.dh-upc .dd .tb h3{color:var(--ink-0)}.dh-upc .dd .tb span{color:var(--muted)}
@media (max-width:960px){.dh-upc .pair .sheet.pair__sketch,.dh-upc .pair .sheet.pair__sketch:first-child,.dh-upc .pair--flip .sheet.pair__sketch,.dh-upc .pair--flip .sheet.pair__sketch:first-child{grid-column:1/13;order:0}}

/* ── Ongoing (On Site) variant of the same template ─────────────
   data-template="ongoing": solid copper status dot; hero image sits
   as a contained band ABOVE the headline (image first, then text);
   design-development set is deliberately partial while works progress. */
.dh-upc[data-template="ongoing"] .st::before{background:var(--copper);border:0}
.dh-upc .hero--band .hero__grid{grid-template-columns:1fr;gap:var(--s-4)}
.dh-upc .hero--band .hero__fig{order:-1;max-width:1100px;margin-inline:auto;width:100%}
.dh-upc .hero--band .hero__fig img{aspect-ratio:3/2;max-height:62vh;object-fit:cover}
.dh-upc .hero--band .hero__text{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gap);align-items:start}
.dh-upc .hero--band .snap{max-width:none;margin-top:var(--s-2)}
.dh-upc .dd-label{position:absolute;left:clamp(.9rem,2vw,1.6rem);top:clamp(.9rem,2vw,1.6rem);z-index:2;font-size:var(--t-xs);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-0);background:rgba(20,22,23,.82);padding:.45rem .8rem;border-left:1px solid var(--copper)}
.dh-upc .sheet--dd .sheet__fig{background:var(--slate-800);border-color:var(--hair)}
.dh-upc .plans--dark{background:var(--slate-900);color:var(--ink-1);border-block:1px solid var(--hair)}
.dh-upc .plans--dark .ovl{color:var(--copper-bright)}.dh-upc .plans--dark h2,.dh-upc .plans--dark .tb h3{color:var(--ink-0)}
.dh-upc .plans--dark .tb{border-top-color:var(--hair-strong)}.dh-upc .plans--dark .tb span,.dh-upc .plans--dark .plans__n,.dh-upc .plans--dark .plans__note{color:var(--muted)}
.dh-upc .plans--dark .sheet__fig{background:var(--slate-800);border:1px solid var(--hair);cursor:zoom-in}
.dh-upc .plans--dark .sheet__fig img{mix-blend-mode:normal}
.dh-upc .plans--dark .sheet{grid-column:span 6}.dh-upc .plans--dark .sheet:first-child{grid-column:span 6}
.dh-upc .plans--dark .sheet:first-child .sheet__fig img{max-height:none;width:100%}
.dh-upc .more{grid-column:span 12;border:1px dashed var(--hair-strong);padding:var(--s-4);text-align:center;font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--muted)}
.dh-upc .more b{display:block;font-family:var(--sans);font-style:normal;font-size:var(--t-xs);letter-spacing:.28em;text-transform:uppercase;color:var(--copper-bright);margin-bottom:.5rem;font-weight:500}
.dh-upc .lb__stage--dark{background:var(--slate-900)}.dh-upc .lb__stage--dark img{mix-blend-mode:normal}
@media (max-width:960px){.dh-upc .hero--band .hero__text{grid-template-columns:1fr}}
@media (max-width:700px){.dh-upc .plans--dark .sheet,.dh-upc .plans--dark .sheet:first-child{grid-column:span 12}}

/* Safety net: if the page module never runs (script blocked, older theme,
   preview quirks), everything reveals itself after 2.5s regardless. */
@keyframes dhForceIn{to{opacity:1;transform:none}}
.dh-upc .rv{animation:dhForceIn .8s var(--ease) 2.5s forwards}
.dh-upc .rv.in{animation:none}


/* ═════════════════════════════════════════════════════════════
  /1.3 additions — image-led register (Chryston / Barrhead; the standard for new project pages)
   Everything below is OPT-IN by markup; pages built for v1.0 render as before.
   .hero--full    full-viewport render, cinematic load sequence (curtains · settle · copper frame · type), copy bottom-left, snapshot panel bottom-right, scroll cue
   .ln > i        clipped headline lines
   .vis           pinned 100vh stage: heading + framed two-render wipe + note; frame sized to viewport by JS (--vis-w); --vis-ratio (number) per page
   .appr--img     full-bleed render + pull statement over scrim, soft parallax
   .prog--paper   programme rows on the paper stage
   .gal           asymmetric two-up of further renders
   Per-page custom props on the wrapper: --hero-focus, --vis-ratio, --vis-ratio-static, --appr-focus
   (v1.1's .hero--vis framed-panel hero is retired — re-paste any page that used it.)
═════════════════════════════════════════════════════════════ */

/* ── Hero v1.2: full-viewport render, cinematic load sequence ──
   0.00s  curtains part from centre; render settles 1.12→1 and lifts from dark
   0.55s  copper frame draws (top → right → bottom → left)
   0.90s  eyebrow tracks in · 1.05s headline lines rise · 1.45s summary · 1.55s snapshot rows · 2.1s caption/cue
   All CSS transitions gated by .is-loaded (set after the render decodes). Reduced-motion: static. */
.dh-upc .hero--full{position:relative;min-height:100svh;padding:0;display:flex;flex-direction:column;justify-content:space-between;background:var(--slate-950);border-bottom:1px solid var(--hair);overflow:hidden;isolation:isolate}
.dh-upc .hero__media{position:absolute;inset:0;z-index:0}
.dh-upc .hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--hero-focus,50% 40%);transform:scale(1.12);filter:saturate(.85) brightness(.55);transition:transform 3.2s var(--ease),filter 2.2s var(--ease);will-change:transform}
.dh-upc.is-loaded .hero__media img{transform:scale(1) translate3d(0,var(--hero-y,0),0);filter:saturate(.92) brightness(.92)}
.dh-upc .hero__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,23,.5) 0%,rgba(20,22,23,0) 26%,rgba(20,22,23,.2) 48%,rgba(20,22,23,.94) 100%),radial-gradient(ellipse 60% 70% at 18% 72%,rgba(20,22,23,.75) 0%,rgba(20,22,23,0) 70%),linear-gradient(90deg,rgba(20,22,23,.45) 0%,rgba(20,22,23,0) 45%)}
.dh-upc .hero__curtain{position:absolute;top:0;bottom:0;width:50.5%;background:var(--slate-950);transition:transform 1.5s var(--ease) .1s}
.dh-upc .hero__curtain--l{left:0;transform-origin:left center}.dh-upc .hero__curtain--r{right:0;transform-origin:right center}
.dh-upc.is-loaded .hero__curtain{transform:scaleX(0)}
.dh-upc .hero__frame{position:absolute;inset:clamp(.9rem,2vw,1.6rem);pointer-events:none}
.dh-upc .hero__frame i{position:absolute;background:var(--copper-frame);transition:transform 1s var(--ease)}
.dh-upc .hero__frame .t,.dh-upc .hero__frame .b{left:0;right:0;height:1px;transform:scaleX(0)}
.dh-upc .hero__frame .l,.dh-upc .hero__frame .r{top:0;bottom:0;width:1px;transform:scaleY(0)}
.dh-upc .hero__frame .t{top:0;transform-origin:left}.dh-upc .hero__frame .r{right:0;transform-origin:top}.dh-upc .hero__frame .b{bottom:0;transform-origin:right}.dh-upc .hero__frame .l{left:0;transform-origin:bottom}
.dh-upc.is-loaded .hero__frame i{transform:none}
.dh-upc.is-loaded .hero__frame .t{transition-delay:.55s}.dh-upc.is-loaded .hero__frame .r{transition-delay:1.15s}.dh-upc.is-loaded .hero__frame .b{transition-delay:1.75s}.dh-upc.is-loaded .hero__frame .l{transition-delay:2.35s}
.dh-upc .hero--full > .wrap{position:relative;z-index:1;width:100%}
.dh-upc .hero__top{padding-top:calc(var(--nav-h) + var(--s-3));display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-3)}
.dh-upc .hero--full .crumb{margin:0;opacity:0;transition:opacity .9s var(--ease) .9s}.dh-upc.is-loaded .hero--full .crumb{opacity:1}
.dh-upc .hero__idx{display:flex;align-items:center;gap:.9rem;font-family:var(--serif);font-style:italic;color:var(--ink-1);font-size:1.05rem;white-space:nowrap;opacity:0;transition:opacity .9s var(--ease) 1.2s}
.dh-upc .hero__idx i{width:2.4rem;height:1px;background:var(--copper);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) 1.4s}
.dh-upc .hero__idx span+span{font-family:var(--sans);font-style:normal;font-size:var(--t-xs);letter-spacing:.28em;text-transform:uppercase;color:var(--copper-bright);font-weight:500}
.dh-upc.is-loaded .hero__idx{opacity:1}.dh-upc.is-loaded .hero__idx i{transform:none}
.dh-upc .hero__body{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:calc(var(--gap)*1.4);align-items:end;padding-block:var(--s-5) var(--s-4)}
.dh-upc .hero--full .ovl{opacity:0;letter-spacing:.7em;transition:opacity 1s var(--ease) .9s,letter-spacing 1.6s var(--ease) .9s}
.dh-upc.is-loaded .hero--full .ovl{opacity:1;letter-spacing:.32em}
.dh-upc .hero--full h1{font-size:clamp(2.2rem,1rem + 3.5vw,4.6rem);margin:var(--s-2) 0 var(--s-3);max-width:26ch;text-wrap:balance;text-shadow:0 2px 28px rgba(20,22,23,.75),0 0 2px rgba(20,22,23,.6)}
.dh-upc .ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.dh-upc .ln i{display:block;font-style:inherit;transform:translateY(112%);transition:transform 1.2s var(--ease) 1.05s}
.dh-upc.is-loaded .ln i{transform:none}
.dh-upc.is-loaded .ln:nth-child(2) i{transition-delay:1.15s}.dh-upc.is-loaded .ln:nth-child(3) i{transition-delay:1.25s}.dh-upc.is-loaded .ln:nth-child(4) i{transition-delay:1.35s}
.dh-upc .hero--full .hero__sum{margin:0;max-width:46ch;color:var(--ink-0);opacity:0;transform:translateY(14px);transition:opacity 1s var(--ease) 1.45s,transform 1s var(--ease) 1.45s;text-shadow:0 1px 18px rgba(20,22,23,.8)}
.dh-upc.is-loaded .hero--full .hero__sum{opacity:1;transform:none}
.dh-upc .hero--full .snap{max-width:none;border-top:0;background:rgba(20,22,23,.82);border:1px solid var(--hair-strong);padding:.35rem 1.15rem}
.dh-upc .hero--full .snap div:last-child{border-bottom:0}
.dh-upc .hero--full .snap dt{color:var(--ink-1)}
.dh-upc .hero--full .snap div{border-bottom-color:var(--hair-strong)}
.dh-upc .hero--full .snap div{opacity:0;transform:translateY(10px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.dh-upc.is-loaded .hero--full .snap div{opacity:1;transform:none}
.dh-upc.is-loaded .hero--full .snap div:nth-child(1){transition-delay:1.55s}.dh-upc.is-loaded .hero--full .snap div:nth-child(2){transition-delay:1.65s}.dh-upc.is-loaded .hero--full .snap div:nth-child(3){transition-delay:1.75s}.dh-upc.is-loaded .hero--full .snap div:nth-child(4){transition-delay:1.85s}
.dh-upc .hero__foot{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:calc(clamp(.9rem,2vw,1.6rem) + var(--s-3))}
.dh-upc .hero--full .hero__cap{position:static;padding:0;background:none;opacity:0;transition:opacity .9s var(--ease) 2.1s;display:flex;gap:1.2rem;align-items:baseline;font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-1)}
.dh-upc.is-loaded .hero--full .hero__cap{opacity:1}
.dh-upc .hero__cap b{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1rem;letter-spacing:0;text-transform:none;color:var(--copper-bright)}
.dh-upc .hero__cue{display:flex;flex-direction:column;align-items:center;gap:.6rem;font-size:var(--t-xs);letter-spacing:.28em;text-transform:uppercase;color:var(--muted);opacity:0;transition:opacity .9s var(--ease) 2.2s,color .3s}
.dh-upc.is-loaded .hero__cue{opacity:1}.dh-upc .hero__cue:hover{color:var(--copper-bright)}
.dh-upc .hero__cue i{width:1px;height:2.6rem;background:var(--hair-strong);position:relative;overflow:hidden}
.dh-upc .hero__cue i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--copper);animation:dhCue 2.2s var(--ease) infinite 2.6s}
@keyframes dhCue{0%{top:-100%}60%{top:100%}100%{top:100%}}
/* content parallax on scroll (JS sets --hero-p 0→1) */
.dh-upc.is-loaded .hero__body,.dh-upc.is-loaded .hero__foot{transform:translate3d(0,calc(var(--hero-p,0) * -6vh),0);opacity:calc(1 - var(--hero-p,0) * 1.15)}
.dh-upc.is-loaded .hero__media img{transform:scale(1) translate3d(0,calc(var(--hero-p,0) * 8vh),0)}

/* ── Visuals v1.2: heading, frame and note all live inside the pinned 100vh stage; frame sized to the viewport ── */
.dh-upc .vis{background:var(--slate-950);border-block:1px solid var(--hair)}
.dh-upc .vis__track{height:260vh;position:relative}
.dh-upc .vis__stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;padding:calc(var(--nav-h) + var(--s-2)) var(--pad-x) var(--s-3);max-width:var(--wrap);margin-inline:auto;box-sizing:border-box}
.dh-upc .vis__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-3);flex:0 0 auto}
.dh-upc .vis__head h2{font-size:clamp(1.6rem,1rem + 1.8vw,2.6rem);margin-top:var(--s-1);max-width:22ch}
.dh-upc .vis__hint{font-family:var(--serif);font-style:italic;color:var(--muted);white-space:nowrap}
.dh-upc .vis__frame{position:relative;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-self:center;width:100%;border:1px solid var(--copper-frame);padding:clamp(.9rem,2vw,1.6rem)}
.dh-upc .vis__stack{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:var(--slate-900)}
.dh-upc .vis__stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.92)}
.dh-upc .vis__stack img.b{clip-path:inset(0 0 0 100%)}
.dh-upc .vis__edge{position:absolute;top:0;bottom:0;left:100%;width:1px;background:var(--copper);opacity:0;pointer-events:none;box-shadow:0 0 18px rgba(200,126,51,.5)}
.dh-upc .vis__caps{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2);margin-top:var(--s-2);font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);flex:0 0 auto}
.dh-upc .vis__caps .swap{position:relative;display:inline-block;color:var(--ink-1)}
.dh-upc .vis__caps .swap span{display:block;transition:opacity .4s}
.dh-upc .vis__caps .swap span+span{position:absolute;inset:0;opacity:0}
.dh-upc .vis[data-phase="b"] .swap span:first-child{opacity:0}.dh-upc .vis[data-phase="b"] .swap span+span{opacity:1}
.dh-upc .vis__bar{position:relative;height:1px;background:var(--hair-strong);flex:1;max-width:220px;margin-inline:var(--s-3)}
.dh-upc .vis__bar i{position:absolute;inset:0 auto 0 0;width:0;background:var(--copper)}
.dh-upc .vis__note{margin-top:var(--s-3);max-width:62ch;color:var(--muted);font-size:var(--t-sm);flex:0 0 auto}
/* JS sets --vis-w so the frame is as wide as the remaining height allows at the render's ratio */
.dh-upc.is-js:not(.vis-static) .vis__frame{width:var(--vis-w,100%);max-width:100%}
/* static fallback (mobile / touch / reduced motion / no module): normal flow, two framed renders stacked */
.dh-upc.vis-static .vis__track{height:auto}
.dh-upc.vis-static .vis__stage{position:static;height:auto;display:block;padding-block:var(--sec-y)}
.dh-upc.vis-static .vis__head{margin-bottom:var(--s-4)}
.dh-upc.vis-static .vis__frame{display:block}
.dh-upc.vis-static .vis__stack{aspect-ratio:auto;overflow:visible;background:none;display:grid;gap:var(--s-3)}
.dh-upc.vis-static .vis__stack img{position:static;height:auto;aspect-ratio:var(--vis-ratio-static,3/2);clip-path:none!important}
.dh-upc.vis-static .vis__edge,.dh-upc.vis-static .vis__bar,.dh-upc.vis-static .vis__hint{display:none}
.dh-upc.vis-static .swap span+span{position:static;opacity:1;margin-top:.35rem}

/* safety nets: if the module never runs, the hero shows after 2.5 s and the stage falls into normal flow */
@keyframes dhForceHero{to{opacity:1;transform:none}}
@keyframes dhForceOvl{to{opacity:1;letter-spacing:.32em}}
@keyframes dhForceCurtain{to{transform:scaleX(0)}}
@keyframes dhForceImg{to{transform:none;filter:saturate(.92) brightness(.92)}}
.dh-upc:not(.is-js) .hero__curtain{animation:dhForceCurtain .8s var(--ease) 2.5s forwards}
.dh-upc:not(.is-js) .hero__media img{animation:dhForceImg .8s var(--ease) 2.5s forwards}
.dh-upc:not(.is-js) .ln i,.dh-upc:not(.is-js) .hero__frame i,.dh-upc:not(.is-js) .hero__idx i{animation:dhForceHero .8s var(--ease) 2.5s forwards}
.dh-upc:not(.is-js) .hero--full .ovl{animation:dhForceOvl .8s var(--ease) 2.5s forwards}
.dh-upc:not(.is-js) .hero--full .crumb,.dh-upc:not(.is-js) .hero__idx,.dh-upc:not(.is-js) .hero--full .hero__sum,.dh-upc:not(.is-js) .hero--full .snap div,.dh-upc:not(.is-js) .hero--full .hero__cap,.dh-upc:not(.is-js) .hero__cue{animation:dhForceHero .8s var(--ease) 2.5s forwards}
.dh-upc:not(.is-js) .vis__track{height:auto}
.dh-upc:not(.is-js) .vis__stage{position:static;height:auto;display:block;padding-block:var(--sec-y)}
.dh-upc:not(.is-js) .vis__frame{display:block}
.dh-upc:not(.is-js) .vis__stack{overflow:visible;background:none;display:grid;gap:var(--s-3)}
.dh-upc:not(.is-js) .vis__stack img{position:static;height:auto;aspect-ratio:var(--vis-ratio-static,3/2);clip-path:none!important}
.dh-upc:not(.is-js) .vis__edge,.dh-upc:not(.is-js) .vis__bar,.dh-upc:not(.is-js) .vis__hint{display:none}
.dh-upc:not(.is-js) .swap span+span{position:static;opacity:1;margin-top:.35rem}

/* ── Editorial photo grid v1.2.1: 12-col, deliberate rhythm (feature · 5/7 dropped · 4/4/4 · 7/5 · 4/4/4), no captions,
      each frame unveils bottom-up with the image settling from 1.06 → 1; copper inset + slow scale on hover ── */
.dh-upc .grid{padding-block:var(--sec-y);background:var(--slate-950);border-block:1px solid var(--hair)}
.dh-upc .grid__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
.dh-upc .grid__head h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .grid__n{font-family:var(--serif);font-style:italic;color:var(--muted);white-space:nowrap}.dh-upc .grid__n b{font-style:normal;font-size:1.6rem;color:var(--copper-bright);font-weight:400}
.dh-upc .grid__rows{display:grid;grid-template-columns:repeat(12,1fr);gap:calc(var(--gap) * 1.6) var(--gap);align-items:start}
.dh-upc .g{position:relative;overflow:hidden;background:var(--slate-900);grid-column:span 4;margin:0}
.dh-upc .g--12{grid-column:span 12}.dh-upc .g--7{grid-column:span 7}.dh-upc .g--5{grid-column:span 5}.dh-upc .g--6{grid-column:span 6}.dh-upc .g--8{grid-column:span 8}
.dh-upc .g--drop{margin-top:clamp(2rem,6vw,6rem)}

.dh-upc .g img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;filter:saturate(.92);transition:transform 1.4s var(--ease);cursor:zoom-in;transform:scale(1)}
.dh-upc .g--12 img{aspect-ratio:21/9}.dh-upc .g--7 img,.dh-upc .g--8 img{aspect-ratio:16/10}.dh-upc .g--5 img{aspect-ratio:4/3}
.dh-upc .g::after{content:"";position:absolute;inset:0;border:1px solid transparent;pointer-events:none;transition:border-color .6s var(--ease),inset .6s var(--ease)}
.dh-upc .g:hover::after{border-color:var(--copper-frame);inset:.7rem}.dh-upc .g:hover img{transform:scale(1.03)}
/* unveil on scroll (replaces the generic .rv fade for these frames) */
.dh-upc .g.rv{opacity:1;transform:none;clip-path:inset(0 0 100% 0);transition:clip-path 1.2s var(--ease)}
.dh-upc .g.rv img{transform:scale(1.06);transition:transform 1.8s var(--ease)}
.dh-upc .g.rv.in{clip-path:inset(0 0 0 0)}.dh-upc .g.rv.in img{transform:scale(1)}
.dh-upc .g.rv.in:hover img{transform:scale(1.03)}
@keyframes dhUnveil{to{clip-path:inset(0 0 0 0)}}
.dh-upc .g.rv:not(.in){animation:dhUnveil .8s var(--ease) 2.5s forwards}

/* ── Design-stage steps (forthcoming pages): done = copper dot · active = outlined copper, pulses · pending = neutral ── */
.dh-upc .steps{list-style:none;margin-top:var(--s-3);border-top:1px solid var(--hair-strong);max-width:560px}
.dh-upc .steps li{display:flex;align-items:center;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--hair);font-size:var(--t-sm);color:var(--muted)}
.dh-upc .steps li::before{content:"";flex:0 0 auto;width:.5rem;height:.5rem;border-radius:50%;border:1px solid var(--hair-strong)}
.dh-upc .steps li.done{color:var(--ink-1)}.dh-upc .steps li.done::before{border-color:var(--copper);background:var(--copper)}
.dh-upc .steps li.active{color:var(--ink-0)}.dh-upc .steps li.active::before{border-color:var(--copper);box-shadow:0 0 0 0 rgba(200,126,51,.5);animation:dhStep 2.4s var(--ease) infinite}
@keyframes dhStep{0%{box-shadow:0 0 0 0 rgba(200,126,51,.5)}100%{box-shadow:0 0 0 .55rem rgba(200,126,51,0)}}
.dh-upc .steps li.active::after{content:"current";margin-left:auto;font-size:var(--t-xs);letter-spacing:.24em;text-transform:uppercase;color:var(--copper-bright)}
@media (prefers-reduced-motion:reduce){.dh-upc .steps li.active::before{animation:none}}

/* ── Approach v1.1: image / copy pairing (front approach), soft parallax, scrim only ── */
.dh-upc .appr--img{position:relative;padding:0;overflow:hidden;background:var(--slate-950)}
.dh-upc .appr__img{position:relative;height:min(100vh,940px);overflow:hidden}
.dh-upc .appr__img img{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover;object-position:var(--appr-focus,50% 45%);filter:saturate(.9);will-change:transform}
.dh-upc .appr__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,23,0) 25%,rgba(20,22,23,.45) 55%,rgba(20,22,23,.94) 100%),linear-gradient(90deg,rgba(20,22,23,.55) 0%,rgba(20,22,23,0) 55%)}
.dh-upc .appr__body{position:absolute;inset:auto 0 0 0;padding:0 var(--pad-x) var(--s-5)}
.dh-upc .appr__body .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gap);padding:0;align-items:end}
.dh-upc .appr--img .pull{font-size:clamp(1.3rem,1rem + 1.2vw,1.95rem);line-height:1.4;max-width:34ch;text-shadow:0 1px 18px rgba(20,22,23,.6)}
.dh-upc .appr__cap{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-1);text-align:right;line-height:1.9}


/* ── Programme on the paper stage ── */
.dh-upc .prog--paper{background:var(--paper);color:var(--paper-ink);border-block:1px solid var(--paper-hair)}
.dh-upc .prog--paper .ovl{color:var(--copper-deep)}
.dh-upc .prog--paper h2,.dh-upc .prog--paper h3{color:var(--paper-ink)}
.dh-upc .prog--paper .prog__grid{border-top-color:var(--paper-ink)}
.dh-upc .prog--paper .prog__item{border-bottom-color:var(--paper-hair)}
.dh-upc .prog--paper .prog__item p{color:var(--paper-muted)}
.dh-upc .prog--paper ::selection{background:var(--copper-deep);color:var(--paper)}

/* ── Landscape pair v1.1: asymmetric two-up, framed, copper inset on hover ── */
.dh-upc .gal{padding-block:var(--sec-y);background:var(--slate-850)}
.dh-upc .gal__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin-bottom:var(--s-5)}
.dh-upc .gal__head h2{font-size:var(--t-h2);margin-top:var(--s-2)}
.dh-upc .gal__hint{font-family:var(--serif);font-style:italic;color:var(--muted);white-space:nowrap}
.dh-upc .gal__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:start}
.dh-upc .gal__item--a{grid-column:span 7}.dh-upc .gal__item--b{grid-column:span 5;margin-top:clamp(2rem,6vw,6rem)}
.dh-upc .gal__fig{position:relative;overflow:hidden;background:var(--slate-900)}
.dh-upc .gal__fig::after{content:"";position:absolute;inset:0;border:1px solid transparent;pointer-events:none;transition:border-color .6s var(--ease),inset .6s var(--ease)}
.dh-upc .gal__item:hover .gal__fig::after{border-color:var(--copper-frame);inset:.7rem}
.dh-upc .gal__fig img{width:100%;aspect-ratio:16/10;object-fit:cover;filter:saturate(.92);transition:transform 1.4s var(--ease)}
.dh-upc .gal__item--b .gal__fig img{aspect-ratio:4/3}
.dh-upc .gal__item:hover img{transform:scale(1.03)}
.dh-upc .gal figcaption{margin-top:var(--s-2);display:flex;justify-content:space-between;gap:var(--s-2);align-items:baseline;border-bottom:1px solid var(--hair);padding-bottom:var(--s-2)}
.dh-upc .gal figcaption b{font-family:var(--serif);font-weight:300;font-style:italic;font-size:1.15rem;color:var(--ink-0)}
.dh-upc .gal figcaption span{font-size:var(--t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

@media (max-width:1100px){
  .dh-upc .appr__body .wrap{grid-template-columns:1fr;gap:var(--s-3)}
  .dh-upc .appr__cap{text-align:left}
}
@media (max-width:960px){
  .dh-upc .gal__grid{grid-template-columns:1fr}.dh-upc .gal__item--a,.dh-upc .gal__item--b{grid-column:auto;margin-top:0}.dh-upc .gal__head{flex-direction:column;align-items:flex-start}
  .dh-upc .hero__body{grid-template-columns:1fr;gap:var(--s-4)}
  .dh-upc .hero__scrim{background:linear-gradient(180deg,rgba(20,22,23,.6) 0%,rgba(20,22,23,.25) 30%,rgba(20,22,23,.55) 55%,rgba(20,22,23,.95) 100%)}
  .dh-upc .hero--full .snap{max-width:560px}
  .dh-upc .hero__idx{display:none}
  .dh-upc .vis__head{flex-direction:column;align-items:flex-start}
  .dh-upc .appr__img{height:auto;min-height:70vh}
}
@media (max-width:640px){
  .dh-upc .appr .pull{font-size:1.25rem}
}
@media (prefers-reduced-motion:reduce){
  .dh-upc .gal__fig img,.dh-upc .gal__fig::after{transition:none}
  .dh-upc .rv,.dh-upc .ln i,.dh-upc .hero__media img,.dh-upc .hero__curtain,.dh-upc .hero__frame i,.dh-upc .hero--full .ovl,.dh-upc .hero--full .crumb,.dh-upc .hero__idx,.dh-upc .hero__idx i,.dh-upc .hero--full .hero__sum,.dh-upc .hero--full .snap div,.dh-upc .hero--full .hero__cap,.dh-upc .hero__cue{transition:none!important;animation:none!important}
  .dh-upc .hero__curtain{transform:scaleX(0)!important}.dh-upc .hero__frame i,.dh-upc .ln i,.dh-upc .hero__idx i{transform:none!important}.dh-upc .hero__media img{transform:none!important;filter:saturate(.92) brightness(.92)!important}
  .dh-upc .hero--full .ovl,.dh-upc .hero--full .crumb,.dh-upc .hero__idx,.dh-upc .hero--full .hero__sum,.dh-upc .hero--full .snap div,.dh-upc .hero--full .hero__cap,.dh-upc .hero__cue{opacity:1!important;transform:none!important;letter-spacing:.32em}
  .dh-upc .hero--full .hero__sum,.dh-upc .hero--full .crumb{letter-spacing:inherit}
  .dh-upc .hero__cue i::after{display:none}
  .dh-upc .prog__item::before{transition:none}
}
@media (max-width:640px){.mock-nav span{display:none}}