/* Independent background, light and foreground planes; the approved art stays intact. */
.campaign-gallery{--scene-y:0px;--scene-x:0px;--scene-turn:0deg;--light-x:55%;position:relative;isolation:isolate;overflow:hidden;overflow:clip;background:#062b72;border-radius:30px;padding:88px 48px 70px;margin:0 -28px;color:white;perspective:1600px}
.campaign-decor{position:absolute;inset:-120px -8%;pointer-events:none;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at var(--light-x) 28%,#147bff 0,transparent 52%),linear-gradient(155deg,#031940 0,#0643a5 62%,#052355 100%)}
.campaign-backwall{position:absolute;inset:-12%;background:linear-gradient(122deg,transparent 41%,#51b4ff24 41.2%,#06255755 66%,transparent 66.3%);transform:translate3d(calc(var(--scene-x) * -.5),calc(var(--scene-y) * -.7),0) rotate(-8deg);will-change:auto}
.campaign-beam{position:absolute;width:75%;height:130px;left:-25%;top:17%;border-radius:80px;background:linear-gradient(170deg,#82efff 0,#149deb 8%,#1263ff 49%,#0344a4 90%);box-shadow:0 12px 0 #00357e,0 24px 0 #022254,0 50px 60px #00132c66,inset 0 2px 2px #c8faffb3;transform:translate3d(var(--scene-x),var(--scene-y),0) rotate(-33deg) rotateY(var(--scene-turn));transform-origin:50% 50%}
.campaign-beam.beam-two{width:83%;height:180px;left:auto;right:-36%;top:43%;background:linear-gradient(180deg,#3a97ff,#145eef 22%,#07347d);transform:translate3d(calc(var(--scene-x) * -.65),calc(var(--scene-y) * -1.1),0) rotate(-33deg);box-shadow:0 16px 0 #021e51,0 25px 0 #021536,0 70px 80px #001b4580,inset 0 2px 1px #76c3ff}
.campaign-floor{position:absolute;bottom:-190px;left:-10%;width:120%;height:440px;transform:perspective(700px) translateY(calc(var(--scene-y) * .25)) rotateX(56deg);transform-origin:50% 0;background:linear-gradient(170deg,#0c61da,#031d52 70%);border-top:2px solid #74c7ff55;box-shadow:0 -30px 90px #0172ff38}
.campaign-light{position:absolute;top:0;bottom:0;left:var(--light-x);width:22%;background:linear-gradient(90deg,transparent,#c0f7ff13,transparent);transform:skewX(-24deg);filter:blur(18px)}
.campaign-gallery .work-grid{gap:42px;align-items:start;position:relative;perspective:1800px}
.campaign-gallery .work-item{min-width:0;max-width:none;padding:0;perspective:1400px}
.campaign-gallery .work-item:nth-child(2){padding-top:44px}
.campaign-gallery .work-item:nth-child(3){padding-top:4px}
.campaign-gallery .campaign-frame{--card-y:0px;--card-rx:0deg;--card-ry:0deg;--card-rz:0deg;position:relative;transform-style:preserve-3d;transform:translate3d(0,var(--card-y),0) rotateX(var(--card-rx)) rotateY(var(--card-ry)) rotateZ(var(--card-rz));margin-bottom:35px}
.campaign-frame:before{content:'';position:absolute;inset:6px -8px -8px 5px;border-radius:17px;background:linear-gradient(130deg,#c5e5ff,#326097 58%,#021333);transform:translateZ(-12px);box-shadow:12px 28px 32px #00113077}
.campaign-frame:after{content:'';position:absolute;inset:0;border-radius:13px;background:linear-gradient(118deg,#ffffff16 0,transparent 28%,transparent 73%,#86cfff12);transform:translateZ(2px);pointer-events:none}
.portfolio .campaign-gallery .work-item .work-art{display:block;position:relative;overflow:hidden;border:1px solid #b1d6ff75;border-radius:13px;aspect-ratio:4/5;padding:0;min-height:0;background:#092249;box-shadow:0 2px 2px #00132b;transform:none}
.portfolio .campaign-gallery .work-art img{display:block;width:100%;height:100%;object-fit:contain;transform:none;transition:none}
.campaign-gallery .work-caption{padding:0 4px;background:none;position:relative;transform:none}
.campaign-gallery .work-caption small{color:#a4e2ff;font-size:10px}
.campaign-gallery .work-caption h3{color:white;font-size:clamp(21px,1.85vw,29px);line-height:1.18;margin-top:12px}
.campaign-gallery .work-caption p{color:#d3e6ff;font-size:12px;line-height:1.8;margin-top:13px}
.campaign-gallery .work-caption .channel-icon{color:#d6f3ff}
.campaign-gallery .work-caption .channels{color:#e6f5ff}
.campaign-gallery .view-work{background:#fff;color:#071a47;box-shadow:0 4px 18px #00173630;font-size:10px}
.campaign-gallery .work-art:focus-visible{outline:3px solid #80eaff;outline-offset:7px}
.campaign-gallery .work-grid.is-filtered{grid-template-columns:minmax(0,470px);justify-content:center}
.campaign-gallery .is-filtered .work-item{padding:0;grid-column:auto}
/* Restrained moving surrounds for the wide, explanatory campaign images. */
[data-scroll-surface]{--surface-y:0px;--surface-rx:0deg;--surface-ry:0deg;--surface-light:35%;position:relative;isolation:isolate;perspective:1600px}
[data-scroll-surface]>.work-art{position:relative;padding:clamp(10px,1.6vw,24px);border-radius:24px;background:radial-gradient(ellipse at var(--surface-light) 0,#2489f4,#082c6d 65%);box-shadow:0 10px 0 #d2e4f5,0 32px 55px #15366220;transform:translateY(var(--surface-y)) rotateX(var(--surface-rx)) rotateY(var(--surface-ry));transform-origin:50% 50%;transition:none}
[data-scroll-surface]>.work-art img{border-radius:12px;position:relative;transform:none;box-shadow:0 14px 26px #001a4d5c;transition:none}
[data-scroll-surface]>.work-art:before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,transparent 35%,#9bf4ff38 49%,transparent 65%);background-size:220% 100%;background-position:var(--surface-light) 50%;pointer-events:none}
[data-scroll-surface]>figcaption{position:relative;margin-top:34px}
@media(min-width:1600px){.campaign-gallery{padding:104px 60px 80px}.campaign-gallery .work-grid{gap:60px}}
@media(max-width:1100px){.campaign-gallery{padding:65px 30px 54px;margin-inline:-12px}.campaign-gallery .work-grid{gap:30px;grid-template-columns:repeat(3,minmax(0,1fr))}.campaign-gallery .work-item:last-child{grid-column:auto;max-width:none}.campaign-gallery .work-caption h3{font-size:22px}}
@media(max-width:750px){.campaign-gallery{padding:62px 32px 54px;border-radius:23px;margin-inline:-6px}.campaign-gallery .work-grid{grid-template-columns:1fr;gap:66px;max-width:430px;margin:auto}.campaign-gallery .work-item:nth-child(n){padding:0;max-width:none;grid-column:auto}.campaign-gallery .campaign-frame{margin-bottom:29px}.campaign-gallery .work-caption h3{font-size:27px}.campaign-gallery .work-caption p{font-size:13px}.campaign-beam{width:190%;left:-90%;height:170px;top:18%}.campaign-beam.beam-two{width:230%;right:-150%;top:64%;height:240px}.campaign-light{width:60%}.campaign-gallery .work-grid.is-filtered{grid-template-columns:1fr}.campaign-gallery .view-work{font-size:9px}[data-scroll-surface]>.work-art{border-radius:17px;padding:10px}[data-scroll-surface]>.work-art img{border-radius:8px}[data-scroll-surface]>figcaption{margin-top:28px}}
@media(max-width:360px){.campaign-gallery{padding-inline:20px}.campaign-gallery .work-caption h3{font-size:25px}}
html[data-motion=off] .campaign-frame,html[data-motion=off] [data-scroll-surface]>.work-art{transform:none!important}
html[data-motion=off] .campaign-backwall,html[data-motion=off] .campaign-beam,html[data-motion=off] .campaign-floor{--scene-x:0px!important;--scene-y:0px!important;--scene-turn:0deg!important}
@media(prefers-reduced-motion:reduce){.campaign-frame,[data-scroll-surface]>.work-art{transform:none!important}.campaign-gallery{--scene-x:0px!important;--scene-y:0px!important;--scene-turn:0deg!important}}

.scroll-route .route-tip{r:5px;fill:#fff;stroke:#1263ff;stroke-width:3px;filter:drop-shadow(0 0 5px #43daff)}
.scroll-route .route-glow{opacity:.2}
@media(max-width:650px){.scroll-route .route-tip{r:3.5px;stroke-width:2px}}
