/* Each project borrows its interaction from the object it presents. */
[hidden]{display:none!important}
.project-scroll{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:26px 38px 20px}
.project-heading{display:grid;grid-template-columns:minmax(190px,30%) 1fr;gap:7%;align-items:start;margin-bottom:24px}
.project-heading h2{margin:0;max-width:280px}.project-heading h2 img{width:auto;max-width:100%;max-height:95px;object-position:left center}
.project-heading .project-meta{margin:0 0 12px;font-size:11px;display:block}.project-description{max-width:660px;padding-top:6px}
.project-heading .project-summary{margin:0 0 13px;font-size:14px;line-height:1.6}.project-story summary{cursor:pointer;font-size:12px;width:max-content;max-width:100%;padding:4px 0;text-decoration:underline;text-underline-offset:4px}.project-story .project-body{font-size:13px;margin:14px 0 5px;max-width:68ch;animation:unfold .25s ease}
.project-scroll>.next-project{margin:24px 0 0;padding:14px 0 0;text-align:right}
.experience{position:relative;min-width:0;--accent:#161513}.experience button{border-radius:0}.experience button:focus-visible{outline-offset:2px}
.scene-nav{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;padding:10px}.scene-nav button{font-size:12px;padding:9px 15px;border:1px solid transparent}.scene-nav button[aria-pressed=true]{border-color:currentColor;background:#ffffff90}.scene-nav button:hover{background:#ffffffb0}
.art-full{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%;min-height:0;cursor:zoom-in}.art-full>img{width:100%;height:100%;object-fit:contain;max-height:100%;mix-blend-mode:normal}.art-enlarge{position:absolute;right:12px;bottom:12px;padding:5px 8px;font-size:10px;background:#fffffff0;opacity:0;transition:opacity .2s}.art-full:hover .art-enlarge,.art-full:focus-visible .art-enlarge{opacity:1}.gesture-note{font-size:11px;text-align:center;margin:0;padding:14px;color:#514e47}.scene-panel{min-width:0;min-height:0}.scene-panel:not([hidden]){animation:unfold .35s ease both}
/* Cáscara: the navigation is the index of a physical file. */
.file-experience{display:grid;grid-template-columns:145px 1fr;--accent:#55744a;max-width:1120px;margin:auto}.file-experience>.scene-nav{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:30px 0 0;gap:9px}.file-experience .scene-nav button{text-align:left;padding:16px 15px;background:#e2e9cf;border:0;border-radius:10px 0 0 10px;transform:translateX(10px);transition:transform .25s}.file-experience .scene-nav button:nth-child(2n){background:#eddbb6}.file-experience .scene-nav button[aria-pressed=true]{background:#55744a;color:white;transform:translateX(0)}.file-drawer{padding:18px;background:#e7e1cd;border-radius:0 12px 12px;position:relative}.file-sheet{height:clamp(320px,50vh,610px);background:#fff;box-shadow:0 4px 18px #302b181c}.file-sheet:not([hidden]){animation:file-pull .38s ease}.file-sheet img{padding:5px}.file-experience>.gesture-note{grid-column:1/-1}
/* Cuida Punta: an entire collection stays within reach around the selected sticker. */
.sticker-experience{background:#e3f2f0;border-radius:50% 50% 16px 16px / 8% 8% 16px 16px;overflow:hidden}.sticker-board{height:clamp(350px,51vh,610px);position:relative;max-width:950px;margin:auto}.sticker-item{position:absolute;width:23%;height:66%;left:calc(2% + var(--i)*18%);top:calc(10% + var(--i)*3%);padding:0;transform:rotate(calc(-12deg + var(--i)*5deg));transition:transform .4s,left .4s,top .4s,opacity .4s,width .4s,height .4s;z-index:1}.sticker-item img{width:100%;height:88%;object-fit:contain;filter:drop-shadow(0 7px 5px #31494420)}.sticker-item span{display:block;font-size:11px;padding:7px}.sticker-item:hover{background:transparent;transform:translateY(-12px) rotate(0deg)}.sticker-board.has-selection .sticker-item{width:12%;height:32%;left:calc(5% + var(--i)*19%);top:67%;transform:rotate(0);opacity:.65}.sticker-board.has-selection .sticker-item[aria-pressed=true]{width:40%;height:72%;left:30%;top:0;transform:rotate(-4deg);opacity:1;z-index:3}.sticker-item[aria-pressed=true] span{display:none}.sticker-actions{display:flex;justify-content:center;gap:20px;align-items:center;padding:6px 15px;font-size:11px}.sticker-actions button{text-decoration:underline;text-underline-offset:3px}.selected-sticker-link{visibility:hidden}.sticker-experience:has(.has-selection) .selected-sticker-link{visibility:visible}.beach-view{height:clamp(350px,51vh,610px);padding:12px}.sticker-experience:has(.beach-view:not([hidden])) .sticker-actions,.sticker-experience:has(.beach-view:not([hidden]))>.gesture-note{display:none}
/* Oli: browse one continuous shop-window rather than a thumbnail gallery. */
.market-experience{background:#f4ead8}.market-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;overscroll-behavior-x:contain;gap:28px;padding:0 5% 14px}.market-stop{flex:0 0 90%;scroll-snap-align:center;min-width:0;background:#fcf9f0;padding:20px;display:flex;flex-direction:column;justify-content:center}.market-stop:nth-child(2){background:#fdfbf6}.market-stop:nth-child(3){background:#ede6f4}.market-stop:nth-child(4){background:#e4e7be}.market-art{height:clamp(310px,49vh,560px)}.market-label{display:block;text-align:center;font-size:12px;padding-top:15px}.market-stop .art-full>img{object-fit:contain}.market-experience .scene-nav button[aria-pressed=true]{color:#694b7f;border-color:#694b7f}
/* Fuego Bajo: the kit expands one compartment at a time. */
.kit-experience{background:#eadfcf;padding:18px}.kit-parts{display:flex;gap:8px;height:clamp(360px,52vh,600px)}.kit-part{display:flex;flex:0 0 58px;background:#d7c3a8;min-width:0;overflow:hidden;transition:flex .4s}.kit-part.is-open{flex:1;background:#fcfaf5}.kit-part>button{flex:0 0 58px;display:flex;align-items:center;justify-content:space-between;writing-mode:vertical-rl;gap:16px;padding:22px 15px;font-size:13px;min-height:0}.kit-symbol{font-size:20px}.kit-part:nth-child(2)>button{background:#cdd5b4}.kit-part:nth-child(3)>button{background:#eac2b4}.kit-part:nth-child(4)>button{background:#e6cf8c}.kit-art{flex:1;min-width:0;padding:18px}.kit-art img{object-fit:contain}
/* Crocs: photographs pivot like leaves around a binding. */
.book-experience{background:#eee6d7;padding:24px 20px 0;overflow:hidden}.book-stage{position:relative;height:clamp(330px,48vh,570px);max-width:860px;margin:auto;perspective:1200px;padding:20px 8%}.book-backing{position:absolute;inset:22px 9%;background:#cfbaa0;transform:rotate(3deg);box-shadow:0 4px 8px #533e2920}.book-backing:after{content:'';position:absolute;inset:0;background:#e0d2bc;transform:rotate(-5deg)}.book-leaf{position:relative;height:100%;transform-origin:12% 10%;background:#fcfaf5;padding:10px;box-shadow:1px 4px 15px #43351c24}.book-leaf:not([hidden]){animation:turn-leaf .5s ease both}.book-controls{display:flex;justify-content:center;gap:7px;align-items:center;margin-top:14px}.book-controls>button{font-size:24px;padding:6px 15px}.book-experience .scene-nav button[aria-pressed=true]{border-color:#e6532a;color:#923018}
/* El Periódico: unfold the object, then approach either full printed page. */
.newspaper-experience{background:#e9e8e1;padding:20px}.newspaper-closed{height:clamp(380px,53vh,630px);position:relative;display:flex;justify-content:center}.newspaper-closed .art-full{max-width:820px}.newspaper-closed img{mix-blend-mode:multiply}.open-newspaper{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:#efc235;border:1px solid #b39b51;padding:14px 22px;white-space:nowrap;box-shadow:0 5px 15px #54452920}.newspaper-spread{display:flex;justify-content:center;gap:0;max-width:1100px;margin:auto;align-items:flex-start}.newspaper-spread>div{width:50%;min-width:0;background:white;box-shadow:0 8px 15px #29281717;transition:width .3s}.newspaper-spread .art-full{height:auto}.newspaper-spread img{height:auto;object-fit:contain;max-height:none}.newspaper-open:not([hidden]){animation:unfold .4s ease}.newspaper-spread.is-reading>div{width:100%;max-width:900px}.newspaper-open .scene-nav{position:sticky;top:-26px;background:#e9e8e1ed;z-index:2}
/* El rubí: zoom to locations in the original infographic. */
.atlas-experience{background:#ecdfd1;padding:12px}.atlas-viewport{position:relative;height:clamp(330px,52vh,680px);overflow:hidden;background:#faf6ef}.atlas-sheet{position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.7,.2,1);transform-origin:center}.atlas-sheet img{width:100%;height:100%;object-fit:contain}.atlas-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 10px}.atlas-footer a{font-size:11px}.atlas-experience .scene-nav button[aria-pressed=true]{background:#d9644b;color:white;border-color:#d9644b}
/* Maria’s Place: turn the poster to move from design to its street context. */
.poster-experience{background:#eee8ce;padding:20px 24px 10px;perspective:1500px}.poster-stage{height:clamp(360px,53vh,650px);max-width:1100px;margin:auto}.poster-face{height:100%;transform-origin:center;backface-visibility:hidden}.poster-face:not([hidden]){animation:turn-poster .5s ease}.poster-face[data-panel="0"] img{filter:drop-shadow(4px 7px 5px #3e341622)}.poster-controls{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:15px}.turn-poster{font-size:12px;text-decoration:underline;text-underline-offset:5px;padding:10px}.poster-experience .scene-nav button[aria-pressed=true]{border-color:#b25535;background:#d4774433}
@keyframes unfold{from{opacity:.3;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes file-pull{from{opacity:.4;transform:translateX(-20px) rotate(-1deg)}to{opacity:1;transform:none}}
@keyframes turn-leaf{from{opacity:.2;transform:rotate(-9deg) rotateY(-25deg)}to{opacity:1;transform:rotate(0)}}
@keyframes turn-poster{from{opacity:.3;transform:rotateY(-75deg)}to{opacity:1;transform:rotateY(0)}}
@media(max-width:900px){.project-scroll{padding:22px}.project-heading{gap:5%;grid-template-columns:30% 1fr}.kit-part{flex-basis:45px}.kit-part>button{flex-basis:45px;padding:16px 10px}.kit-art{padding:8px}.scene-nav button{padding:8px 10px;font-size:11px}.file-experience{grid-template-columns:115px 1fr}}
@media(max-width:620px){.project-scroll{padding:22px 14px 16px}.project-heading{display:block;margin-bottom:22px}.project-heading h2{max-width:240px;margin-bottom:16px}.project-heading h2 img{max-height:82px}.project-heading .project-meta{font-size:10px;margin-bottom:9px}.project-heading .project-summary{font-size:12px;margin-bottom:8px}.project-story summary{font-size:11px}.project-description{padding:0}.project-story .project-body{font-size:12px}.scene-nav{gap:2px;padding:8px 2px}.scene-nav button{padding:8px 9px;font-size:10px}.art-enlarge{opacity:1;font-size:9px;bottom:6px;right:6px}.gesture-note{font-size:10px;padding:12px 7px}.file-experience{display:block}.file-experience>.scene-nav{flex-direction:row;flex-wrap:nowrap;gap:3px;padding:0;overflow:auto;align-items:stretch}.file-experience .scene-nav button{border-radius:7px 7px 0 0;transform:none;padding:12px 7px;flex:1;font-size:9px;text-align:center}.file-drawer{padding:9px;border-radius:0 0 7px 7px}.file-sheet{height:310px}.sticker-experience{border-radius:16px}.sticker-board{height:360px}.sticker-item{width:32%;height:45%;left:calc(2% + var(--i)*15%);top:calc(8% + var(--i)*9%)}.sticker-board.has-selection .sticker-item{width:18%;height:25%;left:calc(1% + var(--i)*20%);top:74%}.sticker-board.has-selection .sticker-item[aria-pressed=true]{width:62%;height:73%;left:19%;top:0}.sticker-item span{font-size:9px}.sticker-actions{gap:12px;font-size:9px}.beach-view{height:390px}.market-track{gap:12px;padding:0 4% 12px}.market-stop{flex-basis:96%;padding:10px}.market-art{height:330px}.market-label{font-size:10px}.kit-experience{padding:9px}.kit-parts{display:block;height:auto}.kit-part{display:block;margin-bottom:7px}.kit-part>button{writing-mode:horizontal-tb;width:100%;padding:11px 15px;font-size:12px}.kit-art{height:310px;padding:12px}.kit-part.is-open{background:#fcfaf5}.book-experience{padding:15px 5px 0}.book-stage{height:320px;padding:13px 5%}.book-backing{inset:18px 7%}.book-controls{gap:0}.book-controls>button{font-size:18px;padding:6px}.book-controls .scene-nav{gap:0}.book-controls .scene-nav button{padding:8px 6px;font-size:9px}.newspaper-experience{padding:10px}.newspaper-closed{height:350px}.open-newspaper{font-size:11px;padding:12px 15px;bottom:15px}.newspaper-spread{gap:2px}.newspaper-open .scene-nav{top:-22px}.atlas-experience{padding:5px}.atlas-viewport{height:330px}.atlas-footer{display:block;text-align:center;padding-bottom:10px}.atlas-footer a{font-size:10px}.atlas-experience .scene-nav button{padding:8px 6px;font-size:9px}.poster-experience{padding:16px 10px 5px}.poster-stage{height:380px}.poster-controls{display:block;margin-top:10px}.turn-poster{display:block;margin:auto;font-size:11px}.project-scroll>.next-project{font-size:10px;line-height:1.8;text-align:left}}
@media(prefers-reduced-motion:reduce){.experience *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.sticker-board.has-selection .sticker-item[aria-pressed=true]{height:65%}
.atlas-viewport{touch-action:none;cursor:grab}.atlas-viewport.is-dragging{cursor:grabbing}.atlas-viewport.is-dragging .atlas-sheet{transition:none}.atlas-tools{display:flex;justify-content:center;align-items:center;gap:12px;padding:5px}.atlas-tools button{width:32px;height:30px;font:20px Arial,sans-serif}.atlas-tools output{font-size:11px;min-width:40px;text-align:center}
@media(max-width:620px){.sticker-board.has-selection .sticker-item[aria-pressed=true]{height:67%}}
/* Keep each sticker's hit target separate, even when its artwork is tilted. */
.sticker-item{width:18%;left:calc(1% + var(--i)*20%);height:76%;top:8%;transform:none}
.sticker-item img{transform:rotate(calc(-10deg + var(--i)*4deg));transition:transform .3s}
.sticker-item:hover{transform:none}.sticker-item:hover img{transform:translateY(-8px) rotate(0)}
.sticker-board.has-selection .sticker-item img{transform:none}
@media(max-width:620px){
 .sticker-item{width:29%;height:43%;left:3%;top:2%;transform:none}
 .sticker-item:nth-child(2){left:35%}.sticker-item:nth-child(3){left:67%}
 .sticker-item:nth-child(4){left:19%;top:50%}.sticker-item:nth-child(5){left:52%;top:50%}
 .sticker-board.has-selection .sticker-item{left:calc(1% + var(--i)*20%);top:74%}
 .sticker-board.has-selection .sticker-item[aria-pressed=true]{left:19%;top:0}
}

/* The static fallback must never hide the enhanced modal after client navigation. */
body:not(.enhanced) .experience{display:none}
.sticker-actions{display:none}.sticker-experience:has(.has-selection) .sticker-actions{display:flex}
.file-experience,.book-experience,.market-experience,.sticker-experience{padding-bottom:16px}
.atlas-footer{justify-content:flex-end}
