.painting-intro{position:fixed;inset:0;z-index:1000;background:radial-gradient(ellipse at 50% 42%,#39322b,#171714 58%,#11110f);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;transition:opacity .35s ease}
.painting-intro.leaving{opacity:0;pointer-events:none}.intro-brand{position:absolute;top:max(30px,env(safe-area-inset-top));left:6vw;font:600 20px Oswald;letter-spacing:.08em}.intro-brand b{color:#f15a16}.intro-skip{position:absolute;top:max(24px,env(safe-area-inset-top));right:6vw;background:transparent;border:1px solid #ffffff55;border-radius:30px;color:#fff;padding:12px 20px;font:600 14px Manrope;cursor:pointer;z-index:2}.intro-skip:focus-visible{outline:3px solid #f15a16;outline-offset:4px}
.intro-loading{text-align:center;width:min(320px,76vw);transition:opacity .3s,transform .3s}.intro-tool{width:180px;height:200px;margin:0 auto 28px;position:relative}.intro-tool i{position:absolute;inset:0;opacity:0;background-image:url('assets/intro-tools-atlas.png');background-size:720px 480px;animation:toolCycle 1.6s infinite;filter:drop-shadow(0 12px 14px #0007)}
.intro-tool i:nth-child(1){background-position:0 0;clip-path:polygon(13% 14%,22% 10%,92% 10%,100% 16%,98% 88%,88% 94%,21% 94%,13% 87%,7% 42%)}
.intro-tool i:nth-child(2){background-position:-180px 0;clip-path:polygon(37% 4%,89% 4%,87% 44%,72% 49%,65% 95%,49% 96%,41% 49%,35% 43%);animation-delay:.4s}
.intro-tool i:nth-child(3){background-position:-360px 0;clip-path:ellipse(38% 35% at 52% 53%);animation-delay:.8s}
.intro-tool i:nth-child(4){background-position:-540px 0;clip-path:polygon(9% 6%,84% 6%,91% 20%,84% 34%,65% 45%,58% 53%,64% 59%,60% 96%,43% 96%,44% 57%,47% 48%,73% 32%,9% 30%);animation-delay:1.2s}
@keyframes toolCycle{0%,24%{opacity:1;transform:translateY(0) rotate(-3deg) scale(1)}25%,100%{opacity:0;transform:translateY(-12px) rotate(5deg) scale(.9)}}
.intro-loading p{font-size:14px;letter-spacing:.05em}.intro-track{height:7px;border-radius:8px;background:#ffffff18;overflow:hidden;margin-top:22px}.intro-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffc663,#f15a16,#f2ae70);box-shadow:0 0 18px #f15a16;transition:width .3s ease}
.intro-assembly{position:absolute;width:min(920px,96vw);aspect-ratio:1536/620;opacity:0;perspective:1100px;transform:translateY(-5%);pointer-events:none}.intro-part{position:absolute;inset:0;transform:translate3d(var(--dx),var(--dy),var(--dz)) rotate(var(--turn));transition:transform 1.25s cubic-bezier(.22,1,.36,1);filter:drop-shadow(0 10px 9px #0006)}.intro-part img{position:absolute;width:100%;max-width:none;height:auto;top:-64.516%;left:0}
.intro-assembly .nozzle{--dx:-12%;--dy:-14%;--dz:40px;--turn:-12deg}.nozzle img{clip-path:polygon(16% 44%,18% 43.5%,26% 48%,26% 58%,18% 64%,16% 63%,16% 59%,20% 55%,18% 54%,18% 51%,20% 50%)}
.intro-assembly .barrel{--dx:-5%;--dy:9%;--dz:60px;--turn:-4deg}.barrel img{clip-path:polygon(26% 48%,30% 47.5%,32% 49%,51% 49%,52% 48%,54% 49%,54% 57%,52% 58%,31% 56%,30% 58%,26% 58%)}
.intro-assembly .body{--dx:5%;--dy:-15%;--dz:0px;--turn:8deg}.body img{clip-path:polygon(54% 44%,54% 42%,56% 40%,59% 40%,62% 44%,68% 44%,69% 48%,64% 48%,67% 51%,73% 50%,74.5% 52%,74% 56%,71% 57%,67% 55%,64% 58%,59% 61%,56% 59%,55% 54%,54% 56%)}
.intro-assembly .trigger{--dx:-3%;--dy:22%;--dz:70px;--turn:12deg}.trigger img{clip-path:polygon(56% 53%,57% 52%,57.5% 54%,55% 66%,54.5% 76%,52% 82%,49.5% 83%,51% 80%,52.5% 73%,52% 67%)}
.intro-assembly .grip{--dx:12%;--dy:15%;--dz:20px;--turn:-9deg}.grip img{clip-path:polygon(61% 59%,64% 57%,68% 67%,76% 80%,76% 83%,72% 86%,68% 84%,67% 78%,64% 71%,61% 69%,62% 66%,60% 61%)}
.intro-assembly .connector{--dx:15%;--dy:35%;--dz:40px;--turn:15deg}.connector img{clip-path:polygon(71% 84%,75% 82%,77% 88%,77% 91%,79% 95%,78% 98%,76% 98%,74% 93%,72% 91%)}
.painting-intro.assembling .intro-loading{opacity:0;transform:translateY(15px)}.painting-intro.assembling .intro-assembly{opacity:1;transition:opacity .25s}.painting-intro.joined .intro-part{transform:translate3d(0,0,0) rotate(0)}.intro-stage-label{position:absolute;bottom:18%;font:500 clamp(22px,4vw,38px) Oswald;letter-spacing:.02em;text-align:center;opacity:0}.assembling .intro-stage-label{opacity:1;transition:opacity .25s}.intro-caption{position:absolute;bottom:max(30px,env(safe-area-inset-bottom));color:#aaa;font-size:12px;letter-spacing:.15em}
@media(max-width:600px){.intro-stage-label{bottom:25%}.intro-assembly{width:105vw}.intro-brand{font-size:17px}.intro-skip{padding:10px 14px}}
@media(prefers-reduced-motion:reduce){.painting-intro{display:none}.intro-tool i{animation:none}}
.intro-tool i{animation-name:toolCycleSlow;animation-duration:4.5s;animation-delay:0s}
.intro-tool i:nth-child(2){animation-delay:.9s}.intro-tool i:nth-child(3){animation-delay:1.8s}.intro-tool i:nth-child(4){animation-delay:2.7s}
.intro-tool i:nth-child(5){animation-delay:3.6s;width:240px;height:208px;left:-30px;background-image:url('assets/intro-trowel.jpeg');background-size:contain;background-repeat:no-repeat;clip-path:polygon(4% 28%,28% 18%,37% 23%,38% 20%,42% 16%,48% 15%,58% 18%,65% 23%,69% 29%,69% 35%,66% 40%,63% 41%,99% 62%,68% 79%)}
@keyframes toolCycleSlow{0%{opacity:0;transform:translateY(8px) rotate(-4deg) scale(.95)}3%,16%{opacity:1;transform:translateY(0) rotate(0) scale(1)}20%,100%{opacity:0;transform:translateY(-9px) rotate(3deg) scale(.97)}}
.intro-welcome{line-height:1.6!important}.intro-welcome strong{font:600 clamp(28px,6vw,36px) Oswald;color:#fff}.intro-welcome strong b{color:#f15a16;font-weight:600}
.intro-track{height:4px;overflow:visible;background:#ffffff20;border-radius:8px}.intro-track span{position:relative;width:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#cf4310,#f15a16,#ffac65);box-shadow:0 0 12px #f15a1699,0 0 24px #ff842d55;border-radius:8px;animation:introBarFill 4.5s linear forwards;transition:none}.intro-track span:after{content:'';position:absolute;right:0;top:-2px;width:9px;height:8px;border-radius:50%;background:#ffd3a4;box-shadow:0 0 12px 4px #ff842d}
@keyframes introBarFill{to{transform:scaleX(1)}}

/* Only presentation: leave Complianz consent, storage and script blocking untouched.
   Follow the real intro element, including its exit fade and skip action.
   No intro (return visit/reduced motion/JS unavailable) means no banner delay. */
body:has(.painting-intro) .cmplz-cookiebanner,
body:has(.painting-intro) .cmplz-manage-consent {
 visibility: hidden !important;
 pointer-events: none !important;
}