/* Casos de portfolio: piezas completas y contexto a un toque. */
#case{background:#fffaf2}
#case .case__chrome{height:54px;padding:0 clamp(14px,4vw,48px);background:#fffaf2}
#case .case__close{font-size:12px;min-height:42px}
#case .case__content{width:min(100%,1320px);padding:0 clamp(12px,3vw,40px)}
#case .case__hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:18px 0;margin-bottom:16px}
#case .case__heading .kicker{font-size:12px;margin-bottom:6px}
#case .case__hero h2{font-size:clamp(40px,5.4vw,72px);line-height:1;overflow-wrap:normal}
#case .case__summary{padding:0;border:0;max-width:430px;font-size:14px}
#case .case__summary summary{cursor:pointer;font-weight:700;list-style:none;padding:12px 0;display:flex;gap:24px;align-items:center;justify-content:space-between}
#case .case__summary summary::-webkit-details-marker{display:none}
#case .case__summary[open] summary span{transform:rotate(45deg)}
#case .case__summary[open]{grid-column:1/-1;max-width:800px}
#case .case__intro{font:400 16px/1.5 var(--body);margin-top:4px}
#case .case__summary-label--services{margin:16px 0 10px;font-size:12px}
#case .case__summary li{font-size:12px;padding:7px 10px}
#case .case__work{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start;padding-bottom:48px}
#case .showcase{min-width:0;border:1px solid #24171e22;border-radius:14px;overflow:hidden;background:#fffdfa}
#case .showcase-caption{padding:14px 16px;background:#fffdfa}
#case .showcase-caption h3{font:400 clamp(25px,2.8vw,36px)/1.06 var(--display);text-transform:uppercase;margin:3px 0 0}
#case .showcase-caption>div>p:first-child{font-size:12px;line-height:1.3;color:#64565b}
#case .piece-context{margin-top:9px;font-size:14px}
#case .piece-context summary{cursor:pointer;font-size:13px;font-weight:600}
#case .piece-context>p{font-size:16px;line-height:1.5;margin-top:10px;color:#51464a}
#case .content-carousel{border-radius:0;background:#ede9e3}
#case .content-carousel__stage{height:min(60svh,620px);min-height:300px;aspect-ratio:auto;cursor:default;background:#ede9e3}
#case .content-carousel__slide{position:absolute;inset:0;display:none;transform:none;transition:none;opacity:1}
#case .content-carousel__slide.is-active{display:flex;align-items:center;justify-content:center;pointer-events:auto}
#case .content-carousel__slide[hidden]{display:none}
#case .media-zoom{display:block;position:relative;border:0;border-radius:0;background:transparent;cursor:zoom-in;padding:0;margin:0;width:100%;height:100%;color:inherit}
#case .media-zoom img{display:block;width:100%;height:100%;object-fit:contain}
#case .zoom-cue{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#201820ca;color:white;font-size:18px;opacity:.7}
#case .content-carousel__slide video{display:block;width:100%;height:100%;object-fit:contain;background:#151115}
#case .carousel-controls{height:56px;display:grid;grid-template-columns:44px 1fr 44px;padding:5px 10px;align-items:center;background:#201820;color:#fff}
#case .carousel-controls button{cursor:pointer;border:1px solid #ffffff55;border-radius:50%;color:white;background:transparent;width:44px;height:44px;font-size:20px}
#case .carousel-controls button:hover{color:#201820;background:var(--lime)}
#case .carousel-controls p{text-align:center;font-size:13px;letter-spacing:.08em}
#case .carousel-controls b{color:var(--lime)}
#case .single-video{height:min(60svh,620px);min-height:300px;background:#151115}
#case .single-video video{width:100%;height:100%;display:block;object-fit:contain}
#case .format--landscape .single-video{min-height:0;height:auto;aspect-ratio:16/9}
#case .work-grid{display:grid;gap:12px}
#case .work-grid .media-zoom{height:min(60svh,620px);background:#ede9e3}
#case .showcase--evolution,#case .showcase--before-after,.identity-process{grid-column:1/-1}
#case .process-visuals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:14px;background:#ede9e3}
#case .process-visuals.comparison{grid-template-columns:repeat(2,minmax(0,1fr))}
#case .process-visuals figure{min-width:0;background:#fffdfa;border-radius:8px;overflow:hidden;border:1px solid #24171e22}
#case .process-visuals figure.is-final{border:2px solid var(--case-color)}
#case .process-visuals .media-zoom{height:auto;aspect-ratio:1/1.414}
#case .process-visuals figcaption{padding:12px;font-size:14px;line-height:1.4}
#case .process-visuals figcaption p{margin-top:4px}
#case .identity-process{border:1px solid #24171e22;padding:18px;border-radius:14px;background:#fffdfa}
#case .identity-process summary{cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:6px;list-style:none}
#case .identity-process summary>span:first-child{grid-column:1/-1;font-size:12px}
#case .identity-process summary>strong{font:400 30px/1.05 var(--display)}
#case .identity-process>p{margin-top:18px;font-size:16px;line-height:1.5}
#case .process-steps{margin-top:20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
#case .process-steps section{border-top:2px solid var(--case-color);padding-top:12px}
#case .process-steps h4{font:400 25px/1.1 var(--display);margin:10px 0}
#case .process-steps p{font-size:16px;line-height:1.5}
#case .showcase--web>.media-zoom{height:auto;aspect-ratio:16/9;background:#201820}
#case .web-description{font-size:16px;line-height:1.5;margin-top:12px}
#case .project-link{display:inline-block;padding:12px 18px;border-radius:24px;background:#201820;color:white;margin-top:16px;text-decoration:none;font-size:14px;font-weight:700}
#case .web-title-art{aspect-ratio:16/9;background:#201820;color:#ffd449;display:flex;flex-direction:column;justify-content:center;padding:32px;gap:10px}
#case .web-title-art>span{font-size:13px;letter-spacing:.2em;color:white}
#case .web-title-art>strong{font:400 clamp(42px,6vw,82px)/.9 var(--display)}
#image-viewer{position:fixed;inset:0;margin:0;padding:64px 12px 12px;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;background:#191419;color:white;overflow:auto}
#image-viewer::backdrop{background:#191419}
#image-viewer>button{position:fixed;top:12px;right:14px;z-index:2;min-height:42px;padding:10px 18px;border-radius:24px;background:white;color:#191419;font:700 14px var(--sub);cursor:pointer}
#image-viewer>img{display:block;margin:auto;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 88px);object-fit:contain;cursor:zoom-in;touch-action:pan-x pan-y pinch-zoom}
#image-viewer>img.actual-size{max-width:none;max-height:none;cursor:zoom-out}
.candy:nth-child(8){--candy-tilt:-10deg;left:70%;top:0%;width:20%;height:38%;z-index:3}
.candies .candy--coca-cola .candy__object{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;transform:rotate(var(--candy-tilt))!important;filter:drop-shadow(0 10px 8px #23151c55)}
.candy--coca-cola .candy__pack{object-fit:contain;width:100%;height:100%}
@media(max-width:700px){
#case .case__chrome{height:50px}#case .case__hero{padding:12px 2px 10px;gap:4px;margin-bottom:10px;display:block}#case .case__hero h2{font-size:42px}#case .case__heading .kicker{font-size:11px;margin-bottom:3px}#case .case__summary summary{padding:6px 0 0;font-size:12px}#case .case__summary{max-width:none}#case .case__summary[open]{padding-bottom:10px}#case .case__work{display:flex;flex-direction:column;gap:20px}#case .showcase,.identity-process{width:100%}#case .showcase-caption{padding:12px 14px}#case .showcase-caption h3{font-size:28px}#case .content-carousel__stage,#case .single-video,#case .work-grid .media-zoom{height:56svh;min-height:290px;max-height:610px}#case .format--catalog .content-carousel__stage{min-height:0;height:auto;aspect-ratio:1800/1273}#case .format--landscape .single-video{height:auto;min-height:0;aspect-ratio:16/9}#case .process-visuals,#case .process-visuals.comparison,#case .process-steps{grid-template-columns:1fr}#case .process-visuals .media-zoom{height:56svh;aspect-ratio:auto}#case .case__footer{padding:24px 0}#case .case__footer p{font-size:32px}
}
@media(prefers-reduced-motion:reduce){#case *,#image-viewer *{scroll-behavior:auto;transition:none}}