/* Real page captures layered over OpenAI-generated editorial artwork. */
.funnel-track .service-art.work-art{min-height:390px;isolation:isolate;background:#100c17;border-radius:6px;border:1px solid #bda1ff20;perspective:1000px;overflow:hidden;--visual-drift:0}
.work-art:before{content:'';position:absolute;inset:-6%;z-index:-1;background:url('images/work/violet-glass-v1.jpg') center/cover no-repeat;opacity:.95;transform:scale(1.06) translateX(calc(var(--visual-drift) * -10px));pointer-events:none}
.work-art:after{content:'';position:absolute;inset:0;z-index:8;pointer-events:none;box-shadow:inset 0 -60px 45px -25px #100c17,inset 0 35px 40px -28px #100c17}
.funnel-track .service-row:hover .work-art{transform:none;background:#100c17}
.flight-screen{position:absolute;transform:translate3d(calc(var(--visual-drift) * var(--depth,35px)),calc(var(--visual-drift) * -24px),0) rotate(var(--tilt));filter:drop-shadow(0 20px 24px #0009);width:var(--screen-width);left:var(--screen-left);top:var(--screen-top);z-index:var(--layer);}
.screen-frame{overflow:hidden;background:#e9e8e4;border:1px solid #ffffff45;border-radius:6px;box-shadow:0 0 0 1px #ffffff10;animation:screen-drift var(--duration,13s) ease-in-out infinite alternate;animation-play-state:paused;animation-delay:var(--delay,0s)}
.screen-chrome{height:16px;background:#edeae6;display:flex;align-items:center;gap:3px;padding:0 7px;color:#4c4554;font-size:6px;line-height:1}
.screen-chrome i{width:3px;height:3px;border-radius:50%;background:#99929c}.screen-chrome span{margin:auto;font-size:6px;letter-spacing:.03em}
.screen-frame img{display:block;width:100%;height:auto;aspect-ratio:1280/850;object-fit:cover;object-position:top}
.flight-a2{--screen-width:69%;--screen-left:-12%;--screen-top:0%;--tilt:-13deg;--depth:65px;--layer:1;--duration:15s;--delay:-5s}
.flight-eterno{--screen-width:85%;--screen-left:12%;--screen-top:25%;--tilt:-7deg;--depth:-42px;--layer:3;--duration:12s;--delay:-3s}
.flight-sneakies{--screen-width:72%;--screen-left:41%;--screen-top:65%;--tilt:12deg;--depth:85px;--layer:2;--duration:17s;--delay:-9s}
.flight-eterno .screen-frame img{aspect-ratio:1280/729}.work-caption{position:absolute;bottom:16px;left:18px;right:18px;display:flex;justify-content:space-between;gap:12px;align-items:center;z-index:10;font-size:11px;letter-spacing:.015em;color:#eee5fc;text-shadow:0 2px 8px #000}.work-caption span:last-child{color:#c6b2e7}.work-caption b{font-weight:500}
@keyframes screen-drift{from{transform:translate3d(0,-25px,0) rotate(-2deg)}to{transform:translate3d(12px,25px,0) rotate(2deg)}}
/* A conceptual commerce composition; no fictional client or performance metrics. */
.commerce-desktop{position:absolute;width:77%;top:14%;left:8%;transform:translateX(calc(var(--visual-drift) * 35px)) rotate(-7deg);z-index:2;filter:drop-shadow(0 24px 22px #000a)}
.commerce-board{background:#e5e1d8;border:1px solid #ffffff8c;border-radius:7px;overflow:hidden;color:#292329;animation:store-float 14s ease-in-out infinite alternate;animation-play-state:paused}
.commerce-nav{display:flex;justify-content:space-between;padding:13px 16px;font-size:7px;letter-spacing:.12em;border-bottom:1px solid #352d2d22}.commerce-nav strong{font-size:9px;letter-spacing:.04em}.commerce-product{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:22px 19px}.commerce-product-image{min-height:156px;display:grid;place-items:center;background:#c9c5bd;position:relative;overflow:hidden;border-radius:3px}.commerce-product-image:before{content:'';position:absolute;width:140px;height:140px;border-radius:50%;background:#e8e0d8;top:15%;left:-15%}.sculpture{width:75px;height:119px;border-radius:12px 12px 26px 26px;background:linear-gradient(100deg,#70677c,#b3a7bd 26%,#e3dce8 45%,#897a99 85%);box-shadow:14px 15px 17px #352d3c55;position:relative;transform:rotate(-8deg)}.sculpture:before{content:'';position:absolute;top:-10px;left:12px;width:51px;height:18px;border-radius:5px 5px 2px 2px;background:linear-gradient(90deg,#222028,#63576f,#29232f)}.sculpture:after{content:'FORM\A 01';white-space:pre;position:absolute;inset:45px 0 auto;text-align:center;font-weight:600;font-size:13px;line-height:1.1;letter-spacing:.08em;color:#29212d}.commerce-details{align-self:center}.commerce-details>small{font-size:6px;letter-spacing:.12em}.commerce-details>strong{display:block;font-size:25px;line-height:1;letter-spacing:-.055em;margin:8px 0 14px}.commerce-lines i{display:block;height:3px;background:#655c6655;margin:7px 0;width:90%}.commerce-lines i:nth-child(2){width:70%}.commerce-swatches{display:flex;gap:5px;margin:15px 0}.commerce-swatches i{width:10px;height:10px;border-radius:50%;background:#9c8faa;border:1px solid #6f6478}.commerce-swatches i:nth-child(2){background:#bdaf9c}.commerce-swatches i:nth-child(3){background:#4e4a48}.commerce-add{background:#26202d;color:#f0e8f8;font-size:8px;text-align:center;padding:9px 4px;border-radius:2px}.commerce-mobile{width:30%;max-width:155px;position:absolute;right:5%;top:31%;z-index:4;border:4px solid #342a40;background:#eeeae3;border-radius:17px;box-shadow:0 20px 30px #0008;transform:translateY(calc(var(--visual-drift) * -35px)) rotate(10deg);padding:12px 9px;color:#302835;animation:phone-float 11s ease-in-out infinite alternate;animation-play-state:paused}.commerce-mobile:before{content:'';display:block;margin:-8px auto 10px;width:30%;height:5px;border-radius:8px;background:#342a40}.commerce-mobile strong{font-size:9px;line-height:1.2;display:block;margin:7px 0}.commerce-mobile .commerce-product-image{min-height:105px}.commerce-mobile .sculpture{scale:.64}.commerce-mobile .commerce-add{font-size:7px;padding:7px 2px}.commerce-feedback{position:absolute;z-index:6;top:7%;right:5%;font-size:11px;padding:10px 14px;background:#2e223ad9;border:1px solid #c3a5ec60;border-radius:30px;backdrop-filter:blur(12px);color:#ece2fa;transform:rotate(4deg)}.commerce-feedback:before{content:'✓';color:#bda1ff;margin-right:7px}
@keyframes store-float{from{transform:translateY(-7px) rotate(-1deg)}to{transform:translateY(12px) rotate(2deg)}}@keyframes phone-float{from{margin-top:-12px}to{margin-top:10px}}
/* Retention as a layered email journey, rather than another site screenshot. */
.retention-orbit{position:absolute;left:50%;top:47%;width:76%;aspect-ratio:1;border:1px solid #bda1ff35;border-radius:50%;transform:translate(-50%,-50%) rotateX(57deg) rotateZ(-25deg);box-shadow:0 0 45px #aa73ff14,inset 0 0 40px #aa73ff10}.retention-orbit:after{content:'';position:absolute;inset:24px;border:1px solid #bda1ff25;border-radius:50%}.mail-card{position:absolute;border:1px solid #d9baf66b;border-radius:8px;padding:17px 19px;width:68%;left:12%;background:linear-gradient(120deg,#3c294fe8,#21182ce8);box-shadow:0 22px 40px #0007;backdrop-filter:blur(12px);color:#f4ecff;transform:translateX(calc(var(--visual-drift) * var(--mail-depth,20px))) rotate(var(--mail-tilt,-6deg));z-index:2}.mail-top{font-size:10px;display:flex;justify-content:space-between;gap:8px;color:#c9b3e0;letter-spacing:.06em}.mail-card strong{font-size:24px;line-height:1.05;letter-spacing:-.04em;display:block;margin:12px 0 8px}.mail-card p{font-size:12px;line-height:1.4;color:inherit;margin:0;opacity:.87}.mail-first{top:9%;--mail-tilt:-8deg;--mail-depth:55px}.mail-second{top:36%;left:24%;background:#c2a4f2;color:#211429;--mail-tilt:5deg;--mail-depth:-25px;z-index:4}.mail-second .mail-top{color:#523566}.mail-third{top:65%;left:10%;--mail-tilt:-5deg;--mail-depth:40px;z-index:5}.mail-card-inner{animation:mail-breathe 9s ease-in-out infinite alternate;animation-play-state:paused}.mail-second .mail-card-inner{animation-delay:-4s}.mail-third .mail-card-inner{animation-delay:-7s}@keyframes mail-breathe{from{transform:translateY(-3px)}to{transform:translateY(3px)}}
.work-art.art-running .screen-frame,.work-art.art-running .commerce-board,.work-art.art-running .commerce-mobile,.work-art.art-running .mail-card-inner{animation-play-state:running}
.visuals-toggle{font-size:12px;background:transparent;border:0;color:#d5c8e6;padding:0 0 2px;text-decoration:underline;text-underline-offset:4px;min-height:28px}.funnel-help{align-items:center}.funnel-help>span:first-child{flex:1}.funnel-help .funnel-count{min-width:42px;text-align:right}
.work-motion-paused .work-art{--visual-drift:0!important}.work-motion-paused .screen-frame,.work-motion-paused .commerce-board,.work-motion-paused .commerce-mobile,.work-motion-paused .mail-card-inner{animation-play-state:paused!important}
@media(max-width:1050px) and (min-width:701px){.funnel-track .service-art.work-art{min-height:355px}.commerce-product{padding:16px 11px;gap:9px}.commerce-details>strong{font-size:20px}.commerce-product-image{min-height:135px}.commerce-mobile{top:41%;right:3%}.commerce-mobile .commerce-product-image{min-height:90px}.commerce-feedback{font-size:9px}.mail-card{padding:14px}.mail-card strong{font-size:20px}.mail-card p{font-size:11px}.mail-top{font-size:8px}}
@media(max-width:700px){.funnel-track .service-art.work-art{min-height:350px}.flight-eterno{--screen-top:28%;--screen-width:88%;--screen-left:7%}.flight-a2{--screen-top:5%;--screen-width:83%;--screen-left:-12%}.flight-sneakies{--screen-top:66%;--screen-width:85%;--screen-left:26%}.work-caption{font-size:10px;left:12px;right:12px;bottom:13px}.commerce-desktop{width:84%;left:3%;top:16%}.commerce-mobile{right:3%;top:43%;width:31%}.commerce-product{gap:10px;padding:18px 12px}.commerce-details>strong{font-size:22px}.commerce-product-image{min-height:145px}.commerce-feedback{top:6%;font-size:10px}.mail-card{padding:14px 16px;width:72%}.mail-card strong{font-size:23px}.mail-card p{font-size:11px}.mail-top{font-size:9px}.mail-second{left:22%}.visuals-toggle{font-size:11px}.funnel-help{gap:12px;flex-wrap:wrap}.funnel-help>span:first-child{font-size:11px}.mail-third{top:67%}}
@media(prefers-reduced-motion:reduce){.work-art{--visual-drift:0!important}.work-art *{animation:none!important}}
html.motion-paused .work-art{--visual-drift:0!important}
/* Keep all three real projects recognisable as the layers cross. */
.flight-eterno{--screen-left:22%;--screen-top:23%;--screen-width:84%}.flight-sneakies{--screen-left:-7%;--screen-top:61%;--screen-width:70%;--layer:4}@media(max-width:700px){.flight-eterno{--screen-left:20%;--screen-top:26%;--screen-width:86%}.flight-sneakies{--screen-left:-5%;--screen-top:61%;--screen-width:77%}}

/* Live video occupies the original media window in the Eterno page capture. */
.eterno-page{position:relative}.eterno-page .portfolio-video{position:absolute;left:12.27%;top:18.38%;width:36.88%;height:80.93%;object-fit:cover;border-radius:4%;opacity:0;pointer-events:none}.eterno-page .portfolio-video.video-ready{opacity:1}
.flight-ghost{--screen-width:67%;--screen-left:42%;--screen-top:61%;--tilt:-9deg;--depth:-65px;--layer:5;--duration:16s;--delay:-6s}
.flight-sneakies{--screen-width:61%;--screen-left:-13%;--screen-top:65%}
@media(max-width:700px){.flight-ghost{--screen-width:70%;--screen-left:43%;--screen-top:63%}.flight-sneakies{--screen-width:65%;--screen-left:-13%;--screen-top:65%}}