/* Nails Era — layered 3D logo on the splash loader (markup: includes/logo-3d-loader.php) */
.ne3d{--ne3d-size:clamp(150px,38vmin,230px);width:var(--ne3d-size);height:var(--ne3d-size);perspective:1000px;margin:0 auto 18px;position:relative}
.ne3d::after{content:"";position:absolute;left:20%;right:20%;bottom:-16px;height:12px;border-radius:50%;background:radial-gradient(closest-side,rgba(8,40,24,.35),transparent);animation:ne3d-shadow 6s ease-in-out 2.4s infinite}
.ne3d-rig{position:absolute;inset:0;transform-style:preserve-3d;animation:ne3d-rig 6s ease-in-out 2.4s infinite}
.ne3d-ly{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ne3d-ring{animation:ne3d-ring 1.1s cubic-bezier(.2,.9,.25,1) both}
.ne3d-disc{--z:10px;animation:ne3d-in .9s cubic-bezier(.2,.9,.25,1) .25s both}
.ne3d-hand{--z:46px;animation:ne3d-hand 1s cubic-bezier(.2,.9,.25,1) .7s both}
.ne3d-bottle{--z:36px;animation:ne3d-drop 1s cubic-bezier(.3,1.4,.4,1) .9s both}
.ne3d-sparkle{--z:60px;transform-origin:47.6% 27%;animation:ne3d-pop .7s cubic-bezier(.3,1.6,.4,1) 1.5s both,ne3d-tw 2s ease-in-out 2.4s infinite}
.ne3d-text{--z:16px;animation:ne3d-txt 1s ease-out 1.2s both}
.ne3d-text text{font-family:Calibri,Carlito,"Segoe UI",Arial,sans-serif}
.ne3d-shine{transform:translateZ(64px);border-radius:50%;overflow:hidden;pointer-events:none}
.ne3d-shine::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 40%,rgba(255,246,214,.5) 49%,transparent 58%);transform:translateX(-130%);animation:ne3d-sh 3s ease-in-out 2.2s infinite}
@keyframes ne3d-ring{from{transform:rotateY(-200deg) scale(.35);opacity:0}60%{opacity:1}to{transform:none;opacity:1}}
@keyframes ne3d-in{from{transform:translateZ(-160px) scale(.6);opacity:0}to{transform:translateZ(var(--z));opacity:1}}
@keyframes ne3d-hand{from{transform:translateZ(180px) translate(-45%,35%) rotate(-18deg);opacity:0}to{transform:translateZ(var(--z));opacity:1}}
@keyframes ne3d-drop{from{transform:translateZ(200px) translateY(-70%);opacity:0}to{transform:translateZ(var(--z));opacity:1}}
@keyframes ne3d-pop{from{transform:translateZ(var(--z)) scale(0) rotate(-180deg);opacity:0}to{transform:translateZ(var(--z));opacity:1}}
@keyframes ne3d-tw{0%,100%{transform:translateZ(var(--z))}50%{transform:translateZ(var(--z)) scale(1.6) rotate(45deg)}}
@keyframes ne3d-txt{from{transform:translateZ(90px) scale(1.15);opacity:0}to{transform:translateZ(var(--z));opacity:1}}
@keyframes ne3d-rig{0%,100%{transform:none}25%{transform:rotateY(-20deg) rotateX(8deg) translateY(-6px)}50%{transform:rotateX(-4deg)}75%{transform:rotateY(20deg) rotateX(8deg) translateY(-6px)}}
@keyframes ne3d-sh{0%,25%{transform:translateX(-130%)}70%,100%{transform:translateX(130%)}}
@keyframes ne3d-shadow{0%,50%,100%{opacity:.9;transform:scaleX(1)}25%,75%{opacity:.55;transform:scaleX(.85)}}
/* Splash integration: the 3D logo replaces the old logo image / icon / emoji */
.loading-logo.has-3d-logo{min-height:0;font-size:inherit;margin-bottom:6px}
.loading-content .loading-logo.has-3d-logo{animation:none!important}
.loading-content.anim-spinner .loading-logo.has-3d-logo::after{display:none}
.loading-logo.has-3d-logo>img,.loading-logo.has-3d-logo>i,.loading-logo.has-3d-logo>.loading-emoji,.loading-logo.has-3d-logo>.loading-logo-svg{display:none!important}
/* Reel-intro splash (index.php #loadingScreen.has-intro): background follows the website theme */
#loadingScreen.has-intro{background:radial-gradient(ellipse 90% 65% at 50% 40%,color-mix(in srgb,var(--primary,#154b34) 80%,#fff) 0%,var(--primary,#154b34) 45%,color-mix(in srgb,var(--primary-dark,var(--primary,#154b34)) 70%,#000) 100%)!important}
#loadingScreen.has-intro::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 40%,rgba(241,200,115,.18),transparent 45%);animation:ne-intro-glow 3s ease-in-out 1.2s both}
#loadingScreen.has-intro .loading-gradient-overlay,#loadingScreen.has-intro .site-bg-surface.is-loading-surface{display:none!important}
.ne-intro-fx{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.ne-intro-fx i{position:absolute;background:#f1c873;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:0;animation:ne-intro-dust 3.2s ease-in-out infinite}
.has-intro .ne3d{--ne3d-size:clamp(180px,48vmin,320px);margin-bottom:26px}
.has-intro .ne3d::after{background:radial-gradient(closest-side,rgba(0,0,0,.4),transparent)}
.has-intro .loading-logo.has-3d-logo{position:relative}
.ne-intro-ripple{position:absolute;left:50%;top:calc(50% - 13px);width:clamp(190px,51vmin,340px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:2px solid rgba(241,200,115,.55);opacity:0;pointer-events:none;animation:ne-intro-ripple 1.6s ease-out 1.25s both}
.ne-intro-ripple.r2{animation-delay:1.5s}
.has-intro .loading-title{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ne-intro-copy{text-align:center;color:#fff;font-family:"Plus Jakarta Sans",Montserrat,"Segoe UI",Arial,sans-serif}
.ne-intro-brand{font-weight:800;font-size:clamp(30px,8.5vw,52px);letter-spacing:.24em;padding-left:.24em;color:#f1c873;line-height:1.1;animation:ne-intro-rise .9s cubic-bezier(.2,.9,.25,1) 1.9s both}
.ne-intro-studio{font-weight:700;font-size:clamp(13px,3.6vw,21px);letter-spacing:.65em;padding-left:.65em;margin-top:6px;animation:ne-intro-rise .9s cubic-bezier(.2,.9,.25,1) 2.05s both}
.ne-intro-rule{width:0;height:2px;margin:16px auto 0;background:linear-gradient(90deg,transparent,#e3b45d,transparent);animation:ne-intro-rule 1s ease-out 2.2s both}
.ne-intro-tag{font-family:"Playfair Display",Georgia,"Times New Roman",serif;font-style:italic;font-size:clamp(18px,5vw,28px);margin-top:16px;color:#eef7f1;animation:ne-intro-rise .9s cubic-bezier(.2,.9,.25,1) 2.25s both}
#loadingScreen.has-intro .loading-subtitle{margin-top:22px;font-size:.8rem;letter-spacing:.08em;color:rgba(255,255,255,.7)}
#loadingScreen.has-intro .loading-bar-bottom{background:rgba(255,255,255,.14)}
#loadingScreen.has-intro .loading-bar-fill{background:linear-gradient(90deg,#c8923e,#f1c873)}
/* Exit: zoom through the logo like the reel intro */
#loadingScreen.has-intro .loading-content.fade-out{opacity:0;transform:scale(2.4);filter:blur(8px);transition:transform .5s cubic-bezier(.6,0,.8,.4),opacity .5s ease-in,filter .5s ease-in}
@keyframes ne-intro-glow{from{opacity:0}to{opacity:1}}
@keyframes ne-intro-dust{0%,100%{opacity:0;transform:translateY(0) scale(.4)}50%{opacity:.9;transform:translateY(-30px) scale(1)}}
@keyframes ne-intro-ripple{from{transform:translate(-50%,-50%) scale(.8);opacity:.9}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}
@keyframes ne-intro-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes ne-intro-rule{from{width:0}to{width:min(300px,60vw)}}
@media (prefers-reduced-motion:reduce){.ne3d *,.ne3d::after,.ne3d-shine::after,.ne-intro-fx i,.ne-intro-ripple,.ne-intro-copy *,#loadingScreen.has-intro::before{animation:none!important}.ne-intro-rule{width:min(300px,60vw)}#loadingScreen.has-intro .loading-content.fade-out{transform:none;filter:none}}
/* Splash uses the 2s logo motion video (assets/video/logo-intro-720.mp4) on pure black */
#loadingScreen.has-intro.has-logo-video{background:#000!important}
#loadingScreen.has-logo-video::before{display:none}
.ne-logo-video{display:block;width:clamp(220px,min(84vw,62vh),560px);aspect-ratio:1;margin:0 auto;background:#000;pointer-events:none}
#loadingScreen.has-logo-video .loading-subtitle{margin-top:4px}