/* Shared still-image transition layouts. Script-free/private frames expose
   both native figures; only an authorised enhancement overlays the sources. */
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal{
 --reveal-progress:0%;--reveal-ink:var(--project-custom-ink,#f4f4f1);
 display:grid;grid-template-columns:minmax(0,var(--layout-frame-aside,36fr)) minmax(0,var(--layout-frame-media,64fr));grid-template-rows:minmax(0,1fr);
 width:var(--layout-frame-width,100%);height:var(--layout-frame-height,100%);max-width:100%;max-height:100%;min-width:0;min-height:0;
 gap:var(--layout-frame-gap,clamp(24px,4vw,72px));align-items:center;position:relative;isolation:isolate;color:var(--reveal-ink);container-type:size;
}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__stage{
 grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--layout-frame-image-gap,8px);
 position:relative;width:100%;height:100%;min-width:0;min-height:0;max-height:100%;overflow:clip;isolation:isolate;background:transparent;
}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__layer{position:relative;min-width:0;min-height:0;width:100%;height:100%;overflow:clip}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__layer>.story-media__item{display:block!important;position:relative;inset:auto;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;margin:0!important;aspect-ratio:auto!important;overflow:clip}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__layer .story-media__item>img{display:block;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:var(--framing-fit,cover)}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal>.story-copy{grid-column:1;grid-row:1;display:flex!important;flex-direction:column;align-self:center!important;gap:0;width:100%;height:auto;min-height:0;max-height:100%!important;max-width:52ch;overflow:hidden!important;padding:0!important;z-index:4;position:relative}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy h2{font-size:clamp(26px,2.8vw,48px);line-height:1.12;margin:0 0 14px;text-wrap:balance}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy__body{min-height:0;max-height:100%!important;flex:0 1 auto;overflow-y:auto!important;overflow-x:hidden!important;font-size:clamp(14px,1.15vw,18px);line-height:1.5;mask-image:none!important;-webkit-mask-image:none!important;overscroll-behavior:contain;scrollbar-width:thin}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy__body p{font-size:inherit;line-height:inherit;margin:0 0 .7em}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy__body p:last-child{margin-bottom:0}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-reveal__range,
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-reveal__handle{display:none}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.is-enhanced .story-reveal__stage{display:block}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.is-enhanced .story-reveal__layer{position:absolute;inset:0}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.is-enhanced [data-reveal-after]{z-index:1;clip-path:inset(0 calc(100% - var(--reveal-progress)) 0 0)}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.is-enhanced .story-reveal__range{
 display:block;position:absolute;inset:0;z-index:5;width:100%;height:100%;padding:0;margin:0;border:0;border-radius:0;opacity:0;cursor:ew-resize;touch-action:pan-y;
}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.is-enhanced .story-reveal__handle{display:block;position:absolute;inset-block:0;left:var(--reveal-progress);width:1px;transform:translateX(-.5px);z-index:3;background:#fff;box-shadow:0 0 2px #0009;pointer-events:none}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__handle>span{position:absolute;top:50%;left:0;display:grid;place-items:center;width:42px;height:42px;transform:translate(-50%,-50%);border:1px solid #ffffffb3;border-radius:50%;color:#fff;background:#17191780;box-shadow:0 1px 5px #0003;backdrop-filter:blur(4px)}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__handle svg{width:24px;height:16px}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__stage:has(.story-reveal__range:focus-visible){outline:2px solid currentColor;outline-offset:4px}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal__stage:has(.story-reveal__range:focus-visible) .story-reveal__handle>span{outline:2px solid #fff;outline-offset:3px}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--mirrored:not(.story-reveal--reveal_full)>.story-reveal__stage{grid-column:1}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--mirrored:not(.story-reveal--reveal_full)>.story-copy{grid-column:2}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_split.story-reveal--mirrored{grid-template-columns:minmax(0,var(--layout-frame-media,64fr)) minmax(0,var(--layout-frame-aside,36fr))}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,auto);gap:clamp(16px,2.5cqh,28px);width:min(var(--layout-frame-width,100%),1280px)}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-reveal__stage{grid-column:1!important;grid-row:1}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy{grid-column:1!important;grid-row:2;display:grid!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 36px;max-width:none;max-height:25cqh!important;align-self:start!important}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy>.story-eyebrow{grid-column:1;grid-row:1}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy>h2{grid-column:1;grid-row:2}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy>.story-copy__body{grid-column:2;grid-row:1/3}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset.story-reveal--mirrored>.story-copy>:is(.story-eyebrow,h2){grid-column:2}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset.story-reveal--mirrored>.story-copy>.story-copy__body{grid-column:1}
/* Legacy content-axis rules deliberately have substantial specificity. A full
   spread is the exception, without changing those rules for ordinary pages. */
:is(html,#project-reveal):is(html,#project-reveal) body.page-project-detail #project-story>.story-slide:has(.story-reveal--reveal_full){padding:0!important}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal-boundary:has(.story-reveal--reveal_full){max-width:none;overflow:clip}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full{grid-template:minmax(0,1fr)/minmax(0,1fr);width:100%;height:100%;gap:0}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full>.story-reveal__stage{grid-column:1;grid-row:1}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full>.story-copy{grid-column:1;grid-row:1;align-self:end!important;justify-self:start;margin:0 0 max(110px,calc(var(--project-frame-bottom,12px) + 88px)) max(72px,calc(var(--project-frame-left,28px) + 30px));padding:24px!important;width:min(40%,540px);height:auto!important;max-height:45%!important;background:#151715c7;color:#fff;pointer-events:auto}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full.story-reveal--mirrored>.story-copy{justify-self:end;margin-inline:max(72px,calc(var(--project-frame-right,28px) + 30px))}
/* Explicit text windows share the existing editor geometry and stay above both
   image layers. The source text is never clipped out of its reading window. */
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal>[data-text-frame]{z-index:7}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal-boundary[data-axis-align=start]>.story-reveal{align-self:start}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal-boundary[data-axis-align=end]>.story-reveal{align-self:end}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal.story-reveal--no-copy{grid-template:minmax(0,1fr)/minmax(0,1fr);gap:0}
:is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--no-copy>.story-reveal__stage{grid-column:1!important;grid-row:1}
@media(orientation:landscape){
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal:not(.story-reveal--reveal_full){height:min(var(--layout-frame-height,100%),calc(100cqw * var(--layout-frame-width-factor,1) / var(--layout-frame-ratio,.01)))}
}
@media(orientation:portrait){
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1.2fr) minmax(0,1fr);gap:18px}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal>.story-reveal__stage{grid-column:1!important;grid-row:1}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal>.story-copy{grid-column:1!important;grid-row:2;align-self:start!important;max-width:none;height:100%;max-height:100%!important}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy h2{font-size:clamp(23px,5.8vw,34px)}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy__body{font-size:13px;line-height:1.5}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy{display:flex!important;gap:0}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full{grid-template-rows:minmax(0,1fr)}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full>.story-copy{grid-row:1;align-self:end!important;height:auto!important;width:auto;max-width:none;max-height:28cqh!important;margin:0 max(40px,calc(var(--project-frame-right,16px) + 22px)) max(130px,calc(var(--project-frame-bottom,12px) + 112px)) max(40px,calc(var(--project-frame-left,16px) + 22px));padding:16px!important}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_split.story-reveal--mirrored{grid-template-columns:minmax(0,1fr)}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--no-copy{grid-template-rows:minmax(0,1fr);gap:0}
}
@media(orientation:landscape) and (max-height:550px){
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal{gap:20px}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy h2{font-size:24px;margin-bottom:9px}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy__body{font-size:12px}
 /* A shallow viewport uses one quiet bottom band. Keeping its upper edge
    below the centre leaves the complete draggable divider reachable, while
    adjacent heading/body columns retain useful reading space. */
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full>.story-copy{display:grid!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto minmax(0,1fr);gap:0 24px;width:calc(100% - 144px);max-width:none!important;margin-bottom:72px;max-height:calc(50cqh - 84px)!important;padding:12px!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:thin;overscroll-behavior:contain}
 :is(html,#project-reveal) body.page-project-detail #project-story :is(.story-reveal--reveal_full,.story-reveal--reveal_inset)>.story-copy>.story-eyebrow{grid-column:1;grid-row:1;font-size:9px!important;line-height:1.2!important;margin:0 0 6px!important}
 :is(html,#project-reveal) body.page-project-detail #project-story :is(.story-reveal--reveal_full,.story-reveal--reveal_inset)>.story-copy>h2{grid-column:1;grid-row:2;font-size:22px!important;line-height:1.05!important;margin:0!important}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_full>.story-copy>.story-copy__body{grid-column:2;grid-row:1/3}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset{grid-template-rows:minmax(0,1fr) minmax(0,36cqh)}
 :is(html,#project-reveal) body.page-project-detail #project-story .story-reveal--reveal_inset>.story-copy{max-height:36cqh!important}
}
/* The shared viewport controller marks oversized heading groups as a whole-copy
   reader. Preserve that safety path for all three compositions: a title can
   never disappear into a fixed grid row while only its body remains scrollable.
   This geometry tier does not alter the higher-priority authored text styles. */
:is(html,#project-reveal):is(html,#project-reveal):is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy[data-copy-whole-reader]{display:block!important;overflow-y:auto!important;overflow-x:hidden!important;justify-content:flex-start!important;scrollbar-width:thin;overscroll-behavior:contain}
:is(html,#project-reveal):is(html,#project-reveal):is(html,#project-reveal) body.page-project-detail #project-story .story-reveal .story-copy[data-copy-whole-reader] .story-copy__body{display:block!important;flex:none!important;height:auto!important;max-height:none!important;overflow:visible!important}
@media(prefers-reduced-motion:reduce){.story-reveal *{transition:none!important;animation:none!important}}