/* V42 AURORA: light ground. Four soft blobs drift (transform only); colours tween per section via @property (browsers without it simply switch colour). No shader, no canvas. */
@property --a1 { syntax: '<color>'; inherits: true; initial-value: #FFD6E6; }
@property --a2 { syntax: '<color>'; inherits: true; initial-value: #FFB8D2; }
@property --a3 { syntax: '<color>'; inherits: true; initial-value: #FFD9C2; }
@property --a4 { syntax: '<color>'; inherits: true; initial-value: #FFE9F2; }
html { --a1: #FFD6E6; --a2: #FFB8D2; --a3: #FFD9C2; --a4: #FFE9F2; transition: --a1 1.6s ease, --a2 1.6s ease, --a3 1.6s ease, --a4 1.6s ease; }
html[data-zone="all"] { --a1: #CBEAFF; --a2: #B3DCFF; --a3: #D4DCFF; --a4: #E4F4FF; }
html[data-zone="studio"] { --a1: #DCD9FF; --a2: #BFC4FF; --a3: #E6D2FF; --a4: #EEEDFF; }
html[data-zone="approach"] { --a1: #FFE0C0; --a2: #FFCFA8; --a3: #FFD9D0; --a4: #FFEEDC; }
html[data-zone="clarte"] { --a1: #C9EEEE; --a2: #AEE3E8; --a3: #CBEFD9; --a4: #E4F7F7; }
html[data-zone="work"] { --a1: #F3D6FF; --a2: #E2C2FF; --a3: #FFD2EE; --a4: #F9E9FF; }
html[data-zone="aurore"] { --a1: #DDEBC8; --a2: #C6E3BC; --a3: #EEF3C4; --a4: #F0F6E6; }
html[data-zone="services"] { --a1: #CDF3DD; --a2: #B4EBCB; --a3: #D6F3C8; --a4: #E6FAEE; }
html[data-zone="contact"] { --a1: #F3D6FF; --a2: #E2C2FF; --a3: #FFD2EE; --a4: #F9E9FF; }
html[data-zone="hangyeol"] { --a1: #FFDCCB; --a2: #FFC7BA; --a3: #FFE3B8; --a4: #FFEEE6; }
html[data-zone="motion"] { --a1: #FFF1B5; --a2: #FFE79A; --a3: #FFDFB0; --a4: #FFF9D8; }
html[data-zone="featured"] { --a1: #FFD6E6; --a2: #FFB8D2; --a3: #FFD9C2; --a4: #FFE9F2; }
#aurora { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; background: color-mix(in srgb, var(--a1) 30%, #fff); transition: opacity .6s; contain: strict; }
#aurora i { position: absolute; width: 80vmax; height: 80vmax; border-radius: 50%; will-change: transform; }
#aurora .b1 { left: -20vmax; top: -25vmax; background: radial-gradient(circle, var(--a1) 0, transparent 68%); animation: ab1 11s ease-in-out infinite alternate; }
#aurora .b2 { right: -25vmax; top: -10vmax; background: radial-gradient(circle, var(--a2) 0, transparent 66%); animation: ab2 14s ease-in-out infinite alternate; }
#aurora .b3 { left: 5vmax; bottom: -35vmax; background: radial-gradient(circle, var(--a3) 0, transparent 66%); animation: ab3 16s ease-in-out infinite alternate; }
#aurora .b4 { right: -5vmax; bottom: -30vmax; width: 65vmax; height: 65vmax; background: radial-gradient(circle, var(--a4) 0, transparent 64%); animation: ab4 12s ease-in-out infinite alternate; }
@keyframes ab1 { to { transform: translate3d(42vw, 26vh, 0) scale(1.2) rotate(35deg); } }
@keyframes ab2 { to { transform: translate3d(-38vw, 34vh, 0) scale(.85) rotate(-30deg); } }
@keyframes ab3 { to { transform: translate3d(36vw, -30vh, 0) scale(1.25) rotate(25deg); } }
@keyframes ab4 { to { transform: translate3d(-44vw, -26vh, 0) scale(.9) rotate(-35deg); } }
#aurora.off i { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { #aurora i { animation: none; } html { transition: none; } }
html.aurora-on body { background: none; }
/* world-coloured counters keep enough contrast on the soft ground */
#w-maison-aurore .n.chip { color: #46583a; } #w-clarte-clinic .n.chip { color: #1f5e58; } #w-hangyeol-tea .n.chip, .hx-no { color: #8a3f26; }