/* Photography stays in a clipped, isolated layer; copy and shopping controls remain stable. */
.campaign{isolation:isolate;background:#8b8b77}
.campaign-scene{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease;overflow:hidden;pointer-events:none}
.campaign-scene.is-active{opacity:1;z-index:1}
.campaign-scene img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:54% 48%;transform-origin:60% 44%}
.campaign-scene.is-active img{animation:campaign-wide 8s linear both;animation-play-state:paused}
.campaign-scene-detail img{object-position:19% 45%;transform-origin:20% 43%}
.campaign-scene-detail.is-active img{animation-name:campaign-detail}
.campaign[data-playing=true] .campaign-scene.is-active img{animation-play-state:running}
.campaign:after{inset:55% 0 0;background:linear-gradient(transparent,rgba(8,22,25,.65));z-index:2}
.campaign .image-caption{z-index:3}.campaign .illustrative{z-index:3}
.campaign-footer{position:absolute;z-index:3;bottom:36px;left:30px;right:30px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px 14px;color:#fff}
.campaign-heading{display:flex;align-items:center;gap:16px;min-width:0}
.campaign-number{font:400 37px/1 var(--display);letter-spacing:-1.5px;min-width:44px}
.campaign-heading>div{display:flex;flex-direction:column;gap:5px}
.campaign-kicker{font-size:7px;letter-spacing:1.8px;opacity:.76}
.campaign-title{font-size:10px;letter-spacing:2px;font-weight:500;white-space:nowrap}
.campaign-controls{display:flex;align-items:center;gap:4px}
.campaign-controls button{color:white;width:32px;height:32px;display:grid;place-items:center;padding:5px;border:1px solid #ffffff50;border-radius:50%;background:#18323926;transition:background .2s}
.campaign-controls button:hover{background:#ffffff26}.campaign-controls svg{width:14px;height:14px;stroke-width:1.5}
.campaign-controls button:focus-visible,.campaign-timeline button:focus-visible{outline-color:var(--green);outline-offset:3px}
.campaign-timeline{display:flex;gap:7px;grid-column:1/-1}
.campaign-timeline button{position:relative;flex:1;padding:7px 0;background:transparent}
.campaign-timeline button:before{content:'';display:block;height:1px;background:#ffffff50}
.campaign-timeline button>span{position:absolute;left:0;top:7px;height:2px;width:100%;transform:scaleX(var(--progress,0));transform-origin:left;background:var(--green)}
.campaign-timeline button[aria-pressed=true]:after{content:'';position:absolute;left:0;top:7px;width:3px;height:2px;background:var(--green)}
.campaign-timeline button[aria-pressed=true]>span{animation:campaign-progress 8s linear both;animation-play-state:paused}
.campaign[data-playing=true] .campaign-timeline button[aria-pressed=true]>span{animation-play-state:running}
@keyframes campaign-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes campaign-wide{from{transform:scale(1.025) translate3d(-.5%,0,0)}to{transform:scale(1.105) translate3d(.7%,-.6%,0)}}
@keyframes campaign-detail{from{transform:scale(1.54) translate3d(2%,0,0)}to{transform:scale(1.43) translate3d(.5%,.4%,0)}}
@media(max-width:1100px){.campaign-footer{left:24px;right:24px}.campaign-title{font-size:9px;letter-spacing:1.5px}.campaign-heading{gap:11px}.campaign-controls{gap:3px}.campaign-controls button{width:28px;height:28px}}
@media(max-width:760px){.campaign-footer{bottom:25px;left:14px;right:14px;grid-template-columns:1fr;gap:9px}.campaign-number{font-size:28px;min-width:31px}.campaign-heading{gap:7px}.campaign-kicker{font-size:5px;letter-spacing:.8px}.campaign-title{font-size:6px;letter-spacing:.8px}.campaign-heading>div{gap:4px}.campaign-controls{gap:5px}.campaign-controls button{width:29px;height:29px}.campaign-timeline{grid-column:1;gap:5px}.campaign-scene img{object-position:56% 48%;transform-origin:60% 44%}.campaign-scene-detail img{object-position:22% 48%;transform-origin:29% 44%}.campaign .image-caption{font-size:5px;letter-spacing:1px}.campaign:after{inset:52% 0 0;background:linear-gradient(transparent,rgba(8,22,25,.73))}}
@media(prefers-reduced-motion:reduce){.campaign-scene{transition:none}.campaign-scene.is-active img{animation:none;transform:none}.campaign-scene-detail.is-active img{transform:scale(1.43)}.campaign-timeline button[aria-pressed=true]>span{transform:scaleX(1)!important}.campaign-controls button{transition:none}}
@media(max-width:760px){.campaign-controls button{width:36px;height:36px}}