/* ROVENTA.AI cinematic polish. The supplied logo image is never modified. */
:root{--motion-cyan:#57e8ff;--motion-violet:#967cff;--motion-blue:#3f88ff}

/* True original wordmark, displayed inside a carefully clipped white frame. */
.logo-wordmark{display:inline-flex!important;align-items:center;justify-content:center;flex:none;width:198px;height:47px;padding:0!important;border:1px solid #dceaff;border-radius:11px;overflow:hidden;background:#fff;box-shadow:0 8px 28px #0004,0 0 26px #6dcaff24;transition:box-shadow .35s ease,transform .35s ease}
.logo-wordmark img,.logo-glass .original-logo{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:#fff;filter:none!important}
.logo-wordmark:hover{transform:translateY(-2px);box-shadow:0 10px 34px #0005,0 0 32px #51d6ff66}
.hero .core .logo-glass{width:96%!important;height:74px!important;min-height:0!important;padding:0!important;overflow:hidden;border:1px solid #d8ecff;border-radius:14px;box-shadow:0 16px 38px #0008,0 0 40px #4ce6ff66;animation:logoHalo 5.5s ease-in-out infinite alternate}
.logo-glass .original-logo{height:100%;width:100%;border-radius:0!important;transform:none!important}
.hero .core{width:320px}
.footer-wordmark{width:193px;height:45px}
.sidebar-wordmark{width:174px;height:42px;max-width:100%}
@keyframes logoHalo{from{box-shadow:0 16px 38px #0008,0 0 26px #4ce6ff50}to{box-shadow:0 22px 55px #0008,0 0 55px #7774ff8a}}

/* Floating prism depth around the existing 3D logo scene. */
.hero .scene{transform-style:preserve-3d;transition:transform .75s cubic-bezier(.2,.7,.18,1)}
.hero .scene::before{content:"";position:absolute;left:15%;right:15%;bottom:32px;height:95px;border-radius:50%;background:radial-gradient(ellipse,#42d6ff50 0,#4e72ff26 38%,transparent 72%);filter:blur(19px);transform:rotateX(69deg);animation:depthPulse 5.2s ease-in-out infinite alternate;pointer-events:none}
.hero .scene::after{content:"";position:absolute;top:16%;right:18%;width:8px;height:8px;border-radius:50%;background:#d0f9ff;box-shadow:0 0 12px 3px #69deff,0 0 45px 12px #7799ff;animation:starOrbit 9s ease-in-out infinite alternate;pointer-events:none}
.hero .ring{box-shadow:inset 0 0 30px #45a9ff10,0 0 27px #628eff18}
.hero .chip{border-color:#98d8ff69;box-shadow:0 16px 42px #0009,inset 0 1px #ffffff1b;transition:border-color .4s ease,box-shadow .4s ease}
.hero .chip::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 36%,#ffffff17 49%,transparent 63%);background-size:240% 100%;animation:lightTrail 8s linear infinite;pointer-events:none}
.hero .halo{background:radial-gradient(circle,#31b6ff8a,#7558ff3c 45%,transparent 75%)}
@keyframes depthPulse{to{opacity:.4;transform:rotateX(69deg) scale(1.3)}}
@keyframes starOrbit{to{transform:translate(-120px,105px) scale(.6);opacity:.5}}
@keyframes lightTrail{to{background-position:-240% 0}}

/* Nav lighting and elegant scrolling section entrances. */
.nav{box-shadow:0 8px 35px #01071469}
.nav .links a{position:relative;transition:color .25s ease}
.nav .links a::after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:2px;border-radius:2px;background:linear-gradient(90deg,#50edff,#927bff);transition:right .35s cubic-bezier(.2,.8,.2,1)}
.nav .links a:hover::after,.nav .links a:focus-visible::after{right:0}
.section>.wrap{transform:translateZ(0)}
.section .heading .eyebrow{display:inline-flex;align-items:center;gap:9px}
.section .heading .eyebrow::before{content:"";display:inline-block;width:7px;height:7px;flex:none;background:#5dfad7;transform:rotate(45deg);box-shadow:0 0 13px #4de8ff;animation:tinyPulse 2.6s ease-in-out infinite}
.section .heading h2{filter:drop-shadow(0 10px 24px #2468da16)}
.section .heading{transition:filter .8s ease,transform .8s ease}
.section.motion-visible .heading{filter:brightness(1.04)}
.roventa-orb{transition:filter 1s ease,opacity 1s ease}
.section.motion-visible .roventa-orb{filter:hue-rotate(14deg) saturate(1.2)}
@keyframes tinyPulse{50%{opacity:.4;transform:rotate(135deg) scale(.67)}}

/* Glass lighting, layered elevation and animated project photography. */
.card{transition:transform .48s cubic-bezier(.18,.82,.18,1),box-shadow .4s ease,border-color .4s ease}
.card.motion-visible{box-shadow:0 18px 50px #0005,0 1px 0 #b4e4ff0c inset}
.card .project-body{position:relative;isolation:isolate}
.card .project-body::before{content:"";position:absolute;top:0;left:-60%;width:55%;height:1px;background:linear-gradient(90deg,transparent,#74ebffb8,transparent);animation:cardTrace 7.5s ease-in-out infinite;pointer-events:none}
.card:nth-child(3n+2) .project-body::before{animation-delay:-2.6s}
.card:nth-child(3n+3) .project-body::before{animation-delay:-5.1s}
@keyframes cardTrace{0%,24%{left:-60%;opacity:0}48%{opacity:1}80%,100%{left:110%;opacity:0}}
.card .project-image{box-shadow:inset 0 -20px 55px #040a17b8}
.card .project-image .tag{border-color:#9cdefc6b}
.service .icon{position:relative;transition:transform .4s ease,box-shadow .4s ease;animation:iconDrift 6s ease-in-out infinite alternate}
.service:nth-child(2n) .icon{animation-delay:-2.5s}
.service .icon::after{content:"";position:absolute;inset:-5px;border-radius:15px;border:1px solid #66dfff24;box-shadow:0 0 20px #3d9aff14;pointer-events:none}
.service:hover .icon{transform:perspective(200px) rotateY(-14deg) rotateX(9deg) translateY(-4px) scale(1.07)}
@keyframes iconDrift{to{filter:brightness(1.25);box-shadow:0 8px 28px #328fff3d}}

/* Existing approach scene and the final CTA get their own visual rhythm. */
.value-scene{transform-style:preserve-3d;transition:transform .85s cubic-bezier(.2,.7,.2,1)}
.value-scene::after{content:"";position:absolute;inset:12% 5%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#278aff2c,transparent 65%);filter:blur(20px);animation:depthPulse 6.5s ease-in-out infinite alternate;pointer-events:none}
.featurephoto{box-shadow:0 20px 55px #0006,0 0 0 1px #84ceff26;transition:transform .75s cubic-bezier(.2,.8,.2,1),box-shadow .6s ease}
.featurephoto.motion-visible{transform:perspective(1100px) rotateY(2deg)}
.featurephoto:hover{transform:perspective(1100px) rotateY(-3deg) scale(1.015);box-shadow:0 30px 75px #0008,0 0 35px #4ab6ff33}
.banner{position:relative;isolation:isolate;overflow:hidden;box-shadow:0 20px 60px #0005}
.banner::after{content:"";position:absolute;width:250px;height:250px;right:-80px;top:-95px;z-index:-1;border-radius:50%;background:#56a7ff4b;filter:blur(45px);animation:bannerAura 9s ease-in-out infinite alternate;pointer-events:none}
@keyframes bannerAura{to{transform:translate(-100px,90px) scale(1.2);background:#8b6bff66}}
.btn.primary{background-size:210% 100%;animation:buttonGlow 8s ease-in-out infinite alternate}
@keyframes buttonGlow{to{background-position:100% center;box-shadow:0 15px 44px #378cff60}}
.click-spark{position:absolute;z-index:2;width:15px;height:15px;left:0;top:0;border-radius:50%;background:#ffffff9c;transform:translate(-50%,-50%) scale(0);pointer-events:none;animation:tapWave .7s ease-out forwards}
@keyframes tapWave{to{transform:translate(-50%,-50%) scale(12);opacity:0}}

/* Demo pages and mobile rendering remain smooth and legible. */
.top .logo-wordmark{width:192px;height:47px}
.workspace,.dash{box-shadow:0 30px 95px #0009,0 0 0 1px #8bcfff0e}
.panel{transition:border-color .35s ease,box-shadow .35s ease}
.panel:hover{border-color:#61b9ff44;box-shadow:inset 0 1px #ffffff0e,0 12px 38px #0002}

@media(max-width:640px){
  .nav .logo-wordmark{width:162px;height:40px;border-radius:9px}
  .hero .core{width:min(315px,88vw)!important;height:195px!important}
  .hero .core .logo-glass{height:65px!important}
  .hero .scene::after{top:17%;right:15%}
  .hero .chip::before{animation-duration:11s}
  .top .logo-wordmark{width:142px;height:39px}
  .footer-wordmark{width:165px;height:40px}
  .service .icon{animation-duration:9s}
  .card .project-body::before{animation-duration:11s}
  .featurephoto.motion-visible{transform:none}
}
@media(max-width:385px){.hero .core{width:min(280px,86vw)!important;height:178px!important}}
@media(hover:none){.hero .scene,.value-scene{transition:none}.card.motion-visible{box-shadow:0 14px 42px #0005}}
@media(prefers-reduced-motion:reduce){
  .logo-glass,.hero .scene::before,.hero .scene::after,.hero .chip::before,
  .section .heading .eyebrow::before,.card .project-body::before,.service .icon,
  .value-scene::after,.banner::after,.btn.primary,.click-spark{animation:none!important}
  .hero .scene,.value-scene,.card,.featurephoto{transition:none!important;transform:none!important}
}
