/* Nube Clara — an atmospheric, spatial service navigator. */
.hero.constellation-hero{height:100svh;min-height:730px;max-height:1100px;overflow:clip;background:#dfeef5;--camera-x:0;--camera-y:0}
.constellation-hero .hero-sky{inset:-3%;background-position:center,center 60%;transform:scale(1.03) translate(calc(var(--camera-x)*-12px),calc(var(--camera-y)*-8px));transition:transform 1.8s cubic-bezier(.16,1,.3,1);filter:saturate(.78)}
.constellation-hero::after{background:linear-gradient(180deg,#e8f3f54d,transparent 28%,#f5fafb11 70%,#f9fbf9 100%)}
.scene-intro{position:absolute;top:133px;left:5%;z-index:8;width:255px;pointer-events:none}.scene-intro .eyebrow{font-size:7px;letter-spacing:.2em;margin-bottom:15px}.scene-intro h1{font:450 37px/1.02 var(--sans);letter-spacing:-.055em}.scene-intro h1 em{font-size:1.1em;color:#527c83;line-height:1}.scene-intro>p:last-child{font-size:9px;line-height:1.8;color:#677e87;margin-top:14px;max-width:220px}.scene-corner{position:absolute;right:5%;top:142px;z-index:8;text-align:right;font-size:7px;letter-spacing:.14em;line-height:2;color:#6c8c99;pointer-events:none}.scene-corner>span{display:block;font-family:var(--serif);font-style:italic;font-size:21px;letter-spacing:-.02em;color:#7897a3;margin-top:5px}
.constellation-space{position:absolute;inset:0;perspective:1200px;isolation:isolate}.constellation-map{position:absolute;width:100%;height:100%;inset:0;fill:none;stroke-width:.7;stroke:#6b9ba235;pointer-events:none;z-index:-1}.constellation-map .map-orbit{stroke:#ffffff7a;stroke-width:.6}.constellation-map .map-link{stroke-dasharray:2 8;stroke-width:.65}.constellation-map .map-signal{stroke:#80b6b8;stroke-width:1;stroke-dasharray:8 1400;animation:constellation-signal 16s linear infinite}.constellation-map circle{fill:#8cb2b6;stroke:none}
.cloud-island{position:absolute;left:var(--x);top:var(--y);width:235px;height:175px;translate:-50% -50%;z-index:2;transition:left 1.25s var(--ease),top 1.25s var(--ease),width 1.15s var(--ease),height 1.15s var(--ease),filter .9s,opacity .9s;will-change:left,top;isolation:isolate}
.cloud-atmosphere{position:absolute;inset:-17%;pointer-events:none;z-index:-2;transform:rotate(var(--tilt,-3deg));animation:atmosphere-drift 13s ease-in-out infinite;animation-delay:var(--drift-delay,0s)}
.cloud-texture{width:100%;height:100%;object-fit:contain;opacity:.82;filter:drop-shadow(0 12px 14px #78a1b00b);transition:opacity 1s,filter 1s;user-select:none}.cloud-texture.echo{position:absolute;inset:7% -7% -7% 7%;width:100%;height:100%;filter:blur(7px);opacity:.26;transform:scaleX(-1) rotate(-5deg);z-index:-1}
.orbit-select{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:45%;padding:10px;z-index:3;transition:opacity .45s,visibility .45s;opacity:.76;color:#345863;outline-offset:-10px!important}.orbit-select::after{content:'';position:absolute;inset:25% 3% 9%;background:radial-gradient(ellipse,#ffffffd6,transparent 74%);z-index:-1;filter:blur(5px)}.satellite-number{font-size:7px;letter-spacing:.15em;color:#73959e;margin-bottom:7px}.satellite-icon{width:22px;height:22px;margin-bottom:8px;color:var(--island-color,#6b929e)}.satellite-icon svg{width:22px;height:22px;stroke-width:1.25}.satellite-title{font-size:13px;font-weight:550;letter-spacing:-.035em;line-height:1.3}.satellite-note{font-size:7px;color:#6f8c96;margin-top:7px}.orbit-select:hover,.orbit-select:focus-visible{opacity:1}.cloud-island:has(.orbit-select:hover) .cloud-texture,.cloud-island:focus-within .cloud-texture{opacity:1;filter:brightness(1.035)}
.cloud-island.is-active{left:50%;top:54%;width:min(900px,74vw);height:610px;z-index:5;filter:none;opacity:1}.cloud-island.is-active .cloud-atmosphere{inset:-1% -3% -1%;transform:rotate(0deg);animation:active-vapor 17s ease-in-out infinite}.cloud-island.is-active .cloud-texture{opacity:.94}.cloud-island.is-active .cloud-texture.echo{inset:7% -4% -8% 4%;filter:blur(15px);opacity:.42;transform:scaleX(-1) rotate(7deg)}.cloud-island.is-active .orbit-select{opacity:0;visibility:hidden;pointer-events:none}
.cyber-aura{position:absolute;inset:12% -1% 9%;opacity:0;pointer-events:none;z-index:-1;transition:opacity 1s;isolation:isolate}.cyber-aura::before{content:'';position:absolute;inset:0;background:conic-gradient(from 40deg,transparent,#b7e1e040,transparent 25%,#c9d7fa38,transparent 58%,#a7d9d52e,transparent);border-radius:50%;filter:blur(26px);animation:aura-turn 25s linear infinite}.cyber-aura::after{content:'';position:absolute;inset:-2% -4%;background:url('./assets/real-cloud.webp') center/contain no-repeat;opacity:.22;filter:blur(14px);animation:vapor-breathe 8s ease-in-out infinite}.cyber-aura svg{position:absolute;inset:0;width:100%;height:100%;stroke:#83b9bf;stroke-width:.55;overflow:visible}.cyber-aura .cyber-orbit{stroke:#8abcc552;stroke-dasharray:1 4;transform-origin:50% 50%;animation:cyber-orbit 38s linear infinite}.cyber-aura .cyber-pulse{stroke:#6aaeb9;stroke-width:.9;stroke-dasharray:9 1800;animation:constellation-signal 15s linear infinite}.cyber-aura .cyber-node{fill:#75b3b8;stroke:white;stroke-width:1;animation:cyber-flicker 5s ease-in-out infinite}.cyber-aura .cyber-node:nth-child(2n){animation-delay:-2s}.cloud-island.is-active .cyber-aura{opacity:1}
.island-panel{position:absolute;top:50%;left:50%;translate:-50% -50%;width:660px;display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:28px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s,visibility .28s,transform .8s var(--ease);transform:translateY(12px);z-index:4}.island-panel::before{content:'';position:absolute;inset:-25px -35px;background:radial-gradient(ellipse at 40% 50%,#ffffffed 15%,#ffffffc9 45%,#ffffff00 73%);filter:blur(13px);z-index:-1;pointer-events:none}.is-active .island-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:.4s}.island-copy .eyebrow{font-size:7px;letter-spacing:.16em;gap:8px;color:#5a8b96;line-height:1.6}.island-copy .eyebrow i{width:4px;height:4px;border-radius:50%;background:#88b9b1;box-shadow:0 0 0 3px #8fcac018}.island-title{font-size:43px;line-height:1.02;letter-spacing:-.055em;margin-top:15px;outline-offset:7px!important}.island-title em{color:#5f8a8e;font-size:1.12em}.island-description{font-size:11px;line-height:1.9;color:#5d7781;margin-top:20px;max-width:320px}.island-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:17px}.island-tags>span{font-size:7px;color:#72959a;padding:3px 7px;border-radius:10px;border:1px solid #a5c6c54a;background:#ffffff47}.island-actions{display:flex;align-items:center;gap:16px;margin-top:23px}.island-actions .button{padding:14px 17px;gap:19px;font-size:9px;white-space:nowrap}.island-actions .button svg{width:13px;height:13px}.island-more{font-size:8px;border-bottom:1px solid #92aeb5;padding:3px 0;white-space:nowrap}.island-more:hover{color:#508d98}.island-visual{margin:0;position:relative;transform:rotate(-4deg);padding:7px;background:#ffffffa8;border:1px solid #fff8;border-radius:15px;box-shadow:0 14px 35px #3e7b931a;animation:visual-levitate 9s ease-in-out infinite}.island-visual img{width:100%;aspect-ratio:1.2;object-fit:cover;border-radius:9px;background:#ebf1ef}.island-visual figcaption{font-size:6px;letter-spacing:.1em;padding:9px 4px 3px;color:#719097;display:flex;align-items:center;justify-content:space-between;gap:10px}.island-visual figcaption>span{font-size:10px;color:#85a4ab}.visual-label{position:absolute;left:15px;top:17px;font-size:6px;letter-spacing:.08em;background:#ffffffb8;border:1px solid #fff9;backdrop-filter:blur(8px);border-radius:20px;padding:5px 8px;color:#64828d}.island-visual::after{content:'';width:31px;height:31px;position:absolute;bottom:-15px;right:-10px;border-radius:50%;border:1px solid #d0e5e6;background:#f2f8f7d9;box-shadow:0 6px 15px #466d7e0a;backdrop-filter:blur(12px)}
.scene-controls{position:absolute;left:50%;bottom:29px;translate:-50% 0;z-index:12;display:flex;align-items:center;gap:10px;padding:8px;background:#f9fcf987;border:1px solid #fff9;backdrop-filter:blur(18px);border-radius:35px;box-shadow:0 9px 25px #507e8a08}.scene-tabs{display:flex;align-items:center;gap:3px}.scene-tab{font-size:9px;padding:9px 13px;border-radius:20px;color:#66808a;white-space:nowrap;transition:background .3s,color .3s}.scene-tab[aria-pressed=true]{color:#fff;background:#345863;box-shadow:0 2px 10px #34586318}.scene-tab:hover{background:#e6efee}.scene-tab[aria-pressed=true]:hover{background:#466e77}.scene-step{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border:1px solid #a9c5cb4d;border-radius:50%;flex-shrink:0;color:#76949e}.scene-step svg{width:13px;height:13px}.scene-step[data-step='-1'] svg{rotate:180deg}.scene-step:hover{background:#fff;color:#345863}
.sound-control{position:absolute;left:4.8%;bottom:39px;z-index:12;font-size:8px;display:flex;align-items:center;gap:8px;color:#6f8e99;padding:7px 0}.sound-control svg{width:17px;height:17px;stroke-width:1.3}.sound-control[aria-pressed=true]{color:#3b7988}.sound-control .sound-waves{opacity:.3}.sound-control[aria-pressed=true] .sound-waves{opacity:1;animation:sound-waves 2s ease-in-out infinite}.scene-scroll{position:absolute;right:4.8%;bottom:45px;z-index:12;display:flex;align-items:center;gap:12px;color:#7d969e;font-size:7px;letter-spacing:.1em}.scene-scroll>span{font-size:16px}.scene-access-hint{position:absolute;bottom:96px;left:50%;translate:-50%;font-size:7px;letter-spacing:.04em;color:#8ba3aa;z-index:8;white-space:nowrap}.scene-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.transit-mist{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:9;opacity:0}.transit-mist::before,.transit-mist::after{content:'';position:absolute;inset:0;background:url('./assets/real-cloud.webp') center/contain no-repeat;filter:blur(8px);transform:translateX(-85%) scale(1.3);opacity:0}.transit-mist::after{transform:translateX(80%) scale(1.1);filter:blur(15px)}.is-travelling .transit-mist{opacity:1}.is-travelling .transit-mist::before{animation:mist-passage 1.15s var(--ease) both}.is-travelling .transit-mist::after{animation:mist-passage-reverse 1.1s var(--ease) both}.constellation-hero.is-travelling .hero-sky{transform:scale(1.065) translate(calc(var(--travel-direction,1)*-14px),-3px)}
.service-detail-art.has-project-image{padding:25px}.detail-service-image{width:100%;max-width:340px;aspect-ratio:1.05;object-fit:cover;border-radius:12px;transform:rotate(-4deg);box-shadow:0 15px 35px #3d6c7b16;margin-bottom:25px}.detail-image-note{font-size:7px;letter-spacing:.06em;color:#8b9b9b;margin-top:8px}.detail-body h2 em{color:#6d8c90}.service-row[data-service=mobile] h3{color:#4e7984}
@keyframes atmosphere-drift{0%,100%{translate:0 0;rotate:-1deg}50%{translate:4px -6px;rotate:1deg}}@keyframes active-vapor{0%,100%{translate:0 0;scale:1}50%{translate:4px -7px;scale:1.025}}@keyframes vapor-breathe{0%,100%{opacity:.17;scale:1}50%{opacity:.31;scale:1.035}}@keyframes aura-turn{to{rotate:360deg}}@keyframes cyber-orbit{to{rotate:360deg}}@keyframes cyber-flicker{0%,100%{opacity:.35}50%{opacity:1}}@keyframes constellation-signal{to{stroke-dashoffset:-1800}}@keyframes visual-levitate{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -6px;rotate:1deg}}@keyframes sound-waves{0%,100%{opacity:.6}50%{opacity:1}}@keyframes mist-passage{0%{opacity:0;transform:translateX(-80%) scale(1.2)}30%{opacity:.66}70%{opacity:.32}100%{opacity:0;transform:translateX(85%) scale(1.5)}}@keyframes mist-passage-reverse{0%{opacity:0;transform:translateX(85%) scale(1.2)}35%{opacity:.45}100%{opacity:0;transform:translateX(-75%) scale(1.5)}}
@media(min-width:1550px){.cloud-island.is-active{width:1020px;height:690px}.island-panel{width:740px;gap:35px}.island-title{font-size:52px}.island-description{font-size:12px;max-width:360px}.island-visual img{aspect-ratio:1.2}.scene-intro{top:155px}.scene-intro h1{font-size:43px}.scene-intro>p:last-child{font-size:11px;max-width:240px}.scene-intro .eyebrow{font-size:8px}.scene-tab{font-size:10px;padding:11px 15px}.scene-controls{bottom:40px}.sound-control{bottom:54px}.scene-scroll{bottom:59px}.scene-access-hint{bottom:110px}.cloud-island{width:270px;height:205px}.satellite-title{font-size:15px}.satellite-note{font-size:8px}.satellite-icon svg{width:25px;height:25px}.scene-corner{top:160px;font-size:8px}}
@media(max-width:1150px){.scene-intro{top:128px;width:205px}.scene-intro h1{font-size:30px}.scene-intro .eyebrow{font-size:6px}.scene-intro>p:last-child{font-size:8px;max-width:185px}.scene-corner{font-size:6px;top:132px}.scene-corner>span{font-size:18px}.cloud-island.is-active{width:790px;height:570px}.island-panel{width:585px;gap:23px}.island-title{font-size:38px}.island-description{font-size:10px}.island-tags>span{font-size:6px}.island-actions{gap:11px}.island-actions .button{font-size:8px;gap:12px;padding:13px}.island-more{font-size:7px}.cloud-island{width:205px;height:160px}.satellite-title{font-size:11px}.satellite-note{font-size:6px}.satellite-icon,.satellite-icon svg{width:19px;height:19px}.satellite-number{font-size:6px}.scene-controls{gap:5px;padding:7px}.scene-tab{font-size:8px;padding:9px 10px}.sound-control{font-size:7px;left:4%}.scene-scroll{font-size:6px;right:4%}.scene-access-hint{font-size:6px}}
@media(max-width:900px) and (min-width:681px){.hero.constellation-hero{min-height:880px;height:100svh}.scene-intro{top:120px;left:6%}.scene-corner{right:6%;top:125px}.cloud-island.is-active{top:53%;width:740px;height:590px}.island-panel{width:565px}.island-title{font-size:37px}.island-visual img{aspect-ratio:1.06}.cloud-island{width:180px;height:150px}.orbit-select{padding:8px}.satellite-title{font-size:10px}.satellite-note{font-size:5px}.scene-controls{bottom:50px}.sound-control{bottom:15px;left:6%}.scene-scroll{bottom:22px;right:6%}.scene-access-hint{bottom:115px}}
@media(max-width:680px){.hero.constellation-hero{height:1080px;min-height:1080px;max-height:none}.constellation-hero .hero-sky{background-size:cover,auto 100%;background-position:center,50% 65%}.scene-intro{top:119px;left:6%;right:6%;width:auto;text-align:center}.scene-intro .eyebrow{justify-content:center;font-size:6px;letter-spacing:.17em;margin-bottom:12px}.scene-intro h1{font-size:34px;line-height:1.02;letter-spacing:-.06em}.scene-intro h1 br{display:none}.scene-intro h1 em{font-size:1.1em;margin-left:5px}.scene-intro>p:last-child{font-size:9px;max-width:240px;margin:13px auto 0;line-height:1.8}.scene-corner{display:none}.cloud-island{width:165px;height:135px}.cloud-atmosphere{inset:-10% -13%}.satellite-icon,.satellite-icon svg{width:17px;height:17px}.satellite-icon{margin-bottom:5px}.satellite-number{font-size:5px;margin-bottom:5px}.satellite-title{font-size:10px}.satellite-note{font-size:5px;margin-top:5px}.orbit-select{opacity:.73;padding:8px}.cloud-island.is-active{width:720px;height:670px;top:54%;left:50%}.cloud-island.is-active .cloud-atmosphere{inset:-12% -15%;transform:scaleX(.8) scaleY(1.1)}.cloud-island.is-active .cloud-texture{opacity:.91}.island-panel{width:calc(100vw - 76px);max-width:360px;grid-template-columns:1fr;gap:24px;text-align:center;top:48%;}.island-panel::before{inset:-20px -28px;background:radial-gradient(ellipse,#fff 20%,#ffffffdf 52%,transparent 76%);filter:blur(16px)}.island-copy .eyebrow{justify-content:center;font-size:6px;letter-spacing:.14em}.island-title{font-size:36px;margin-top:13px;line-height:1}.island-description{font-size:10.5px;line-height:1.85;margin:15px auto 0;max-width:100%}.island-tags{justify-content:center;margin-top:13px;gap:5px}.island-tags>span{font-size:6px;padding:3px 6px}.island-actions{justify-content:center;margin-top:18px;gap:17px}.island-actions .button{font-size:9px;padding:13px 16px;gap:16px}.island-more{font-size:8px}.island-visual{width:210px;margin:0 auto;max-width:100%;padding:5px;border-radius:11px;transform:rotate(-3deg)}.island-visual img{aspect-ratio:1.7;border-radius:7px}.island-visual figcaption{font-size:5px;padding:6px 4px 2px;letter-spacing:.08em}.island-visual::after{width:23px;height:23px;right:-7px;bottom:-9px}.visual-label{font-size:5px;left:11px;top:11px;padding:4px 6px}.cyber-aura{inset:10% 10% 5%}.cyber-aura svg{stroke-width:.8}.cyber-aura::after{opacity:.18}.scene-controls{bottom:47px;left:50%;width:calc(100% - 30px);max-width:450px;padding:6px;gap:4px;justify-content:center;border-radius:28px}.scene-tabs{gap:2px;overflow-x:auto;scrollbar-width:none;flex:1;scroll-behavior:smooth}.scene-tabs::-webkit-scrollbar{display:none}.scene-tab{font-size:7px;padding:9px 10px;flex-shrink:0}.scene-step{width:25px;height:25px}.scene-step svg{width:12px;height:12px}.scene-access-hint{bottom:105px;font-size:6px;max-width:90%;text-align:center;line-height:1.7;white-space:normal}.sound-control{left:6%;bottom:12px;font-size:7px;gap:6px}.sound-control svg{width:14px;height:14px}.scene-scroll{right:6%;bottom:20px;font-size:6px;gap:8px}.scene-scroll>span{font-size:14px}.cloud-island[data-slot='1']{--x:18%!important;--y:25%!important}.cloud-island[data-slot='2']{--x:82%!important;--y:26%!important}.cloud-island[data-slot='3']{--x:16%!important;--y:79%!important}.cloud-island[data-slot='4']{--x:84%!important;--y:80%!important}.cloud-island[data-slot='5']{--x:50%!important;--y:88%!important}.constellation-map{opacity:.5}.detail-service-image{max-width:210px;aspect-ratio:1.65;margin-bottom:15px}.service-detail-art.has-project-image{padding:35px 25px 25px}.detail-service-image+.detail-art-title{font-size:11px}.detail-image-note{font-size:6px}.transit-mist::before,.transit-mist::after{background-size:auto 80%;filter:blur(12px)}}
@media(max-width:370px){.scene-intro h1{font-size:29px}.island-panel{width:calc(100vw - 56px)}.island-title{font-size:32px}.island-description{font-size:10px}.island-tags>span{font-size:5.5px}.island-actions{gap:12px}.island-actions .button{padding:12px 14px;font-size:8px;gap:12px}.island-more{font-size:7px}.cloud-island{width:145px;height:125px}.satellite-title{font-size:9px}.satellite-note{font-size:4.5px}.island-visual{width:195px}.scene-tab{font-size:6px;padding:9px}.scene-intro>p:last-child{font-size:8px}}
.island-visual img{height:auto}.service-detail-art.has-project-image .detail-art-icon{display:none}.island-panel{transition:opacity .28s,transform .8s var(--ease)}.is-active .island-panel{transition-delay:.35s}.orbit-select{opacity:.82}.cloud-island:not(.is-active) .cyber-aura *,.cloud-island:not(.is-active) .cyber-aura::before,.cloud-island:not(.is-active) .cyber-aura::after,.cloud-island:not(.is-active) .island-visual{animation-play-state:paused}
@media(min-width:1200px) and (max-width:1549px){.island-panel{width:700px;gap:30px}.island-title{font-size:44px}.island-description{font-size:12px;line-height:1.85;max-width:340px}}
@media(max-width:900px) and (min-width:681px){.cloud-island[data-slot='1']{--x:15%!important;--y:31%!important}.cloud-island[data-slot='2']{--x:15%!important;--y:74%!important}.cloud-island[data-slot='3']{--x:50%!important;--y:84%!important}.cloud-island[data-slot='4']{--x:85%!important;--y:74%!important}.cloud-island[data-slot='5']{--x:85%!important;--y:31%!important}}
@media(max-width:680px){.scene-controls{position:fixed;bottom:18px;transition:opacity .3s,visibility .3s}.scene-out-of-view .scene-controls{opacity:0;visibility:hidden;pointer-events:none}.sound-control{top:84px;right:6%;left:auto;bottom:auto;min-height:30px;font-size:7px;gap:6px}.scene-access-hint{bottom:70px}.scene-intro h1 br{display:initial}.scene-intro h1{font-size:32px;line-height:1.03}.scene-intro h1 em{margin:0}.scene-intro>p:last-child{margin-top:11px}.cloud-island[data-slot='1']{--y:28%!important}.cloud-island[data-slot='2']{--y:28%!important}}
@media(prefers-reduced-motion:reduce){.cloud-island,.island-panel,.cloud-texture{transition:none!important}.cloud-atmosphere,.cyber-aura::before,.cyber-aura::after,.cyber-aura svg *,.island-visual,.constellation-map .map-signal{animation:none!important}.transit-mist{display:none!important}.constellation-hero .hero-sky{transform:none!important}.is-active .island-panel{transition-delay:0s!important}.scene-tabs{scroll-behavior:auto}}