/* Light moves around the supplied artwork; the artwork stays authentic. */
.hero-art { isolation: isolate; }
.art-scene { position: absolute; inset: 0; isolation: isolate; transform: perspective(1000px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)); transition: transform .65s cubic-bezier(.18,.65,.3,1); }
.art-aura { position: absolute; inset: -13%; z-index: -3; pointer-events: none; background: radial-gradient(ellipse at 40% 38%, #fac4d670 0%, transparent 60%), radial-gradient(ellipse at 72% 62%, #cdb9e238, transparent 54%); filter: blur(20px); animation: aura-drift 12s ease-in-out infinite alternate; }
.art-backdrop { background: radial-gradient(ellipse at var(--light-x, 45%) var(--light-y, 30%), #fff4f6 0%, #f9d3e1 36%, #edb7ce 80%); box-shadow: inset 0 0 65px #fffaf755, 0 30px 90px #b653831c; transition: border-radius 2s; animation: living-halo 12s ease-in-out infinite alternate; }
.art-backdrop:before { content: ''; position: absolute; inset: -3%; border-radius: inherit; z-index: -1; background: conic-gradient(from 0deg, transparent, #f9b1d040, #fffaf7, #d0bad944, transparent 55%, #fffaf799, transparent); filter: blur(15px); animation: halo-revolution 24s linear infinite; }
.hero-art .orbit { border-color: #c78da335; }
.hero-art .orbit:after { content: ''; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #fffaf7; box-shadow: 0 0 8px 3px #fffaf7, 0 0 22px 8px #ed97bf77; left: 50%; top: -4px; }
.hero-art .orbit-one { animation: orbit-turn-one 28s linear infinite; }
.hero-art .orbit-two { animation: orbit-turn-two 35s linear infinite reverse; }
.hero-art .hands { filter: drop-shadow(0 27px 19px #70284324); }
.hero-art .care-label { background: #fffaf7ce; backdrop-filter: blur(16px); border-color: #fffaf7; box-shadow: 0 14px 40px #8e526820, inset 0 0 18px #ffffff66; animation: label-drift 7s ease-in-out infinite; }
.care-label > span { animation: care-heartbeat 3s ease-in-out infinite; }
.care-canvas { position: absolute; inset: -10%; width: 120%; height: 120%; z-index: 4; pointer-events: none; }
.hero-art .art-caption { z-index: 5; bottom: -16px; }
.love-trigger { display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 18px; min-height: 44px; background: #fffaf7d9; border: 1px solid #dcaabe66; border-radius: 40px; box-shadow: 0 6px 25px #b7739012; font-size: 12px; letter-spacing: .025em; color: var(--rose); transition: background .25s, transform .25s, box-shadow .25s; }
.love-trigger span { margin: 0; font-size: 18px; }
.love-trigger:hover { transform: translateY(-3px); background: #fff; box-shadow: 0 8px 28px #d682ac33; }
.love-trigger:active { transform: scale(.96); }
.hero h1 em { background: linear-gradient(105deg, #a43b60 20%, #a43b60 37%, #d07198 45%, #915580 51%, #a43b60 60%); background-size: 260% 100%; background-clip: text; -webkit-background-clip: text; color: transparent; animation: text-lustre 9s 2s ease-in-out infinite; }
.button-dark, .nav-cta { overflow: hidden; isolation: isolate; }
.button-dark:after, .nav-cta:before { content: ''; position: absolute; inset: -80% -30%; background: linear-gradient(100deg, transparent 35%, #ffffff32 50%, transparent 65%); transform: translateX(-110%) rotate(-10deg); pointer-events: none; }
.nav-cta { position: relative; }
.button-dark:hover:after, .button-dark:focus-visible:after, .nav-cta:hover:before { animation: button-light .9s ease; }
.value-card { position: relative; overflow: hidden; border: 1px solid #ffffff70; isolation: isolate; }
.value-card:before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(260px circle at var(--spot-x, 50%) var(--spot-y, 40%), #ffffffb3, transparent 75%); opacity: 0; transition: opacity .5s; pointer-events: none; }
.value-card:hover:before { opacity: 1; }
.value-card .value-icon { transition: transform .5s cubic-bezier(.2,.8,.3,1); transform-origin: 16px 20px; }
.value-card:hover .value-icon { transform: rotate(-10deg) scale(1.18); }
.kindness-inner { isolation: isolate; background: linear-gradient(125deg, #f7d5df, #f8dce8 45%, #efd9e7); }
.kindness-inner:before { content: ''; position: absolute; z-index: -1; inset: -80%; border-radius: 50%; background: conic-gradient(from 70deg, transparent 20%, #fffaf788 28%, transparent 36%, transparent 70%, #e5b9d866 80%, transparent); animation: halo-revolution 35s linear infinite; pointer-events: none; }
.kindness-inner:after { content: ''; position: absolute; inset: 12px; border: 1px solid #fffaf77d; border-radius: 14px; pointer-events: none; }
body.intro-active .hero-art *, body.intro-active .hero-art *:before, body.intro-active .hero-art *:after { animation-play-state: paused; }
.hero-art.effects-offscreen *, .hero-art.effects-offscreen *:before, .hero-art.effects-offscreen *:after { animation-play-state: paused; }
@keyframes aura-drift { to { transform: translate(3%, -2%) scale(1.1); opacity: .7; } }
@keyframes living-halo { from { border-radius: 48% 48% 43% 43%; transform: rotate(5deg) scale(.98); } to { border-radius: 44% 52% 48% 46%; transform: rotate(11deg) scale(1.025); } }
@keyframes halo-revolution { to { transform: rotate(360deg); } }
@keyframes orbit-turn-one { from { transform: rotate(-34deg); } to { transform: rotate(326deg); } }
@keyframes orbit-turn-two { from { transform: rotate(-34deg); } to { transform: rotate(326deg); } }
@keyframes label-drift { 0%,100% { transform: translateY(0) rotate(6deg); } 50% { transform: translateY(-9px) rotate(3deg); } }
@keyframes care-heartbeat { 0%,70%,100% { transform: scale(1); } 78% { transform: scale(1.18); } 87% { transform: scale(1.02); } 93% { transform: scale(1.1); } }
@keyframes text-lustre { 0%,25% { background-position: 100% 50%; } 65%,100% { background-position: 0% 50%; } }
@keyframes button-light { to { transform: translateX(110%) rotate(-10deg); } }
@media(max-width:760px) { .care-canvas { inset: -5%; width: 110%; height: 110%; } .art-aura { inset: -3%; filter: blur(14px); } .hero-art .art-caption { bottom: -23px; } .hero-art { margin-bottom: 34px; } .love-trigger { font-size: 11px; padding: 9px 16px; } }

/* A continuous light journey from the artwork into the mission. */
.pointer-light { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 45; }
.hero { overflow: clip; overflow-clip-margin: 70px; }
.hero-art .art-aura { background: radial-gradient(ellipse at 40% 38%, #f4a8cd99 0%, transparent 62%), radial-gradient(ellipse at 72% 62%, #cdb9e266, transparent 54%); }
.hero-art .art-backdrop { box-shadow: inset 0 0 75px #fffaf799, 0 0 90px #eaa0c24d, 0 35px 110px #bd739d24; }
.hero-art .art-scene { transform-style: preserve-3d; }
.hero-art .care-label { translate: 0 0 35px; }
.hero-art .hero-art-float { translate: 0 0 20px; }
.hero-art .art-backdrop:after { border-width: 2px; box-shadow: inset 0 0 18px #fff9, 0 0 18px #fff9; }
.belief-strip { position: relative; background: #f7e2eb; mask-image: linear-gradient(90deg, transparent, black 7%, black 93%, transparent); }
.belief-strip > .belief-track { display: flex; width: max-content; min-width: 0; gap: 0; padding: 0; animation: kindness-procession 38s linear infinite; }
.belief-group { display: flex; flex: 0 0 auto; align-items: center; gap: 50px; padding-right: 50px; }
.belief-group span { white-space: nowrap; }
.belief-group i { animation: halo-revolution 20s linear infinite; }
.belief-strip:hover .belief-track { animation-play-state: paused; }
.about { position: relative; isolation: isolate; display: block; max-width: none; padding-top: 120px; padding-bottom: 120px; overflow: hidden; background: radial-gradient(ellipse at 50% 50%, #fbe7f070, transparent 70%); }
.about > .section-label { justify-content: center; margin: 0 0 34px; }
.about-body { position: relative; max-width: 1080px; margin: auto; }
.about h2 { text-align: center; font-size: clamp(44px, 5.8vw, 82px); line-height: 1.12; letter-spacing: -.055em; }
.about h2 em { display: inline; background: linear-gradient(100deg, #a43b60 0%, #a43b60 var(--text-reveal,100%), #936b86 var(--text-reveal,100%)); background-clip: text; -webkit-background-clip: text; color: transparent; }
.about-detail { margin: 45px auto 0; max-width: 740px; padding: 32px; background: #fffaf7db; border: 1px solid #f3dde6; border-radius: 22px; backdrop-filter: blur(12px); box-shadow: 0 20px 80px #9e507310; }
.mission-aura { position: absolute; inset: 0; z-index: -2; pointer-events: none; background: radial-gradient(ellipse at 25% 35%, #f6d1e080, transparent 35%), radial-gradient(ellipse at 75% 68%, #e8d4eb66, transparent 36%); transform: scale(calc(.85 + var(--mission-progress, 0) * .3)); opacity: calc(.3 + var(--mission-progress, 0) * .7); }
.mission-ribbon { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; overflow: visible; }
.mission-ribbon path { fill: none; stroke: url(#ribbon-colour); stroke-linecap: round; }
.ribbon-track { stroke-width: 1; opacity: .2; }
.ribbon-light { stroke-width: 2.5; stroke-dasharray: 220 2200; animation: ribbon-journey 12s linear infinite; opacity: .65; }
.values { padding-top: 60px; }
.value-card:after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(125deg, #fff, #e7bad466, #fffaf7, #cbb5d866); mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude; pointer-events: none; }
.value-card:hover { box-shadow: 0 22px 50px #b26b8d24; }
.kindness-inner { box-shadow: 0 35px 90px #ce86a32b; }
.kindness-inner h2 em { text-shadow: 0 0 35px #fffaf799; }
.footer { padding-bottom: 25px; }
@keyframes kindness-procession { to { transform: translateX(-50%); } }
@keyframes ribbon-journey { from { stroke-dashoffset: 2400; } to { stroke-dashoffset: 0; } }
@media(max-width:760px) {
 .hero { overflow-clip-margin: 15px; }
 .about { padding-top: 75px; padding-bottom: 70px; }
 .about h2 { font-size: clamp(38px, 8.5vw, 58px); }
 .about-detail { padding: 23px 20px; grid-template-columns: 1fr; margin-top: 32px; }
 .about-star { font-size: 32px; }
 .belief-group { gap: 30px; padding-right: 30px; }
 .mission-ribbon { width: 190%; left: -45%; opacity: .55; }
 .values { padding-top: 20px; }
}
.hero-line { display: block; }
.site-enter .hero-line { animation: headline-arrival 1.5s cubic-bezier(.16,1,.3,1) both; }
.site-enter .hero-line:nth-child(1) { animation-delay: .3s; }
.site-enter .hero-line:nth-child(2) { animation-delay: .5s; }
.site-enter .hero-line:nth-child(3) { animation-delay: .7s; }
@keyframes headline-arrival { from { opacity: 0; transform: translateY(30px) rotateX(-15deg); filter: blur(8px); } to { opacity: 1; transform: translateY(0) rotateX(0); filter: blur(0); } }
