:root{--experience-speed:1;--experience-intensity:.75;--experience-brightness:1;--experience-period:22s;--experience-accent:var(--detail,#956278)}
/* Static content is the baseline. Only decoration responds to time or scrolling. */
[data-motion-section]{position:relative;isolation:isolate}
[data-motion-section]>.experience-decoration{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:paint;border-radius:inherit;opacity:calc(.5 * var(--experience-brightness))}
.experience-decoration svg{display:block;width:100%;height:100%;min-height:100px;pointer-events:none}
[data-motion-section]>.experience-stage-flow{position:relative;inset:auto;width:100%;height:84px;z-index:0;margin-bottom:1.25rem;opacity:calc(.7 * var(--experience-brightness))}
.experience-stage-flow svg{min-height:0}
.stage-progress{stroke-dasharray:1000;stroke-dashoffset:var(--stage-offset,1000);transition:stroke-dashoffset .18s linear}
[data-motion-section]::after{content:"";position:absolute;pointer-events:none;left:33%;top:0;width:34%;height:100%;max-height:440px;z-index:-1;background:radial-gradient(ellipse,var(--silk-pearl,#fffaf0),transparent 68%);opacity:calc(.35 * var(--experience-brightness));transform:translateX(calc(var(--scroll-wash-x,50%) - 50%))}
/* The photograph remains pixel-stable; only its separate frame illumination moves. */
.hero-portrait,.experience-intro-image{position:relative;isolation:isolate}
.hero-portrait::before,.experience-intro-image::before{content:"";position:absolute;inset:-12px;border-radius:44% 56% 49% 51%;pointer-events:none;z-index:-1;background:linear-gradient(125deg,transparent,var(--silk-champagne,#ddb38f),var(--silk-rose,#bb7e94),transparent);opacity:calc(.22 * var(--experience-brightness));transform:translate(var(--portrait-light-x,0px),var(--portrait-light-y,0px));animation:portrait-light calc(24s / var(--experience-speed)) ease-in-out infinite alternate}
.hero-portrait img,.experience-intro-image img{transform:none!important}
.experience-intro-image{width:min(100%,250px);aspect-ratio:4/5;margin:2rem 0 0;border-radius:36px 36px 96px 36px;border:1px solid var(--line,#d9bfc7);background:var(--paper);box-shadow:0 20px 45px #5035490b}
.experience-intro-image picture,.experience-intro-image img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;object-position:center 35%}
@keyframes portrait-light{from{transform:translate(-5px,3px) rotate(-2deg);opacity:calc(.14 * var(--experience-brightness))}to{transform:translate(6px,-4px) rotate(3deg);opacity:calc(.3 * var(--experience-brightness))}}
/* Whole-card semantic anchors retain normal click, keyboard and touch navigation. */
body[data-experience] :is(.program-card,.focus-card){position:relative;overflow:hidden;isolation:isolate;transform:translateY(0);transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease}
body[data-experience] :is(.program-card,.focus-card)>*{position:relative;z-index:1}
body[data-experience] :is(.program-card,.focus-card)::before{content:"";position:absolute;pointer-events:none;inset:-40% -70%;z-index:0;background:linear-gradient(110deg,transparent 38%,color-mix(in srgb,var(--experience-accent) 13%,transparent) 48%,#fff9ed99 52%,transparent 62%);transform:translateX(-60%) rotate(-8deg);opacity:0}
body[data-experience] :is(.program-card,.focus-card):focus-visible{transform:translateY(-3px);outline:3px solid var(--focus);outline-offset:4px;box-shadow:0 12px 28px color-mix(in srgb,var(--primary) 12%,transparent)}
body[data-experience] :is(.program-card,.focus-card):focus-visible::before{animation:tile-light 1.6s ease-out forwards}
@media(hover:hover) and (pointer:fine){body[data-experience] :is(.program-card,.focus-card):hover{transform:translateY(-5px) perspective(900px) rotateX(.8deg);border-color:var(--secondary);box-shadow:0 16px 32px color-mix(in srgb,var(--primary) 12%,transparent)}body[data-experience] :is(.program-card,.focus-card):hover::before{animation:tile-light 1.6s ease-out forwards}}
body[data-experience] :is(.program-card,.focus-card):active{transform:translateY(-1px);border-color:var(--primary);box-shadow:0 3px 12px color-mix(in srgb,var(--primary) 14%,transparent)}
body[data-experience] :is(.program-card,.focus-card):active::before{opacity:.6;transform:translateX(0)}
@keyframes tile-light{0%{transform:translateX(-60%) rotate(-8deg);opacity:0}25%{opacity:calc(.8 * var(--experience-brightness))}100%{transform:translateX(55%) rotate(-8deg);opacity:0}}
/* Secondary pages have different rhythms, not identical text fades. */
body[data-experience="gut"] #program-structure{border-color:var(--secondary);background:color-mix(in srgb,var(--paper) 70%,var(--surface))}
body[data-experience="sleep"]{--experience-period:34s}
body[data-experience="sleep"] [data-motion-section]::after{background:radial-gradient(ellipse,var(--silk-pearl) 0%,color-mix(in srgb,var(--silk-rose) 12%,transparent) 40%,transparent 72%);width:65%;animation:sleep-illumination calc(34s / var(--experience-speed)) ease-in-out infinite alternate}
@keyframes sleep-illumination{from{transform:translateX(-54%) scale(.92);opacity:calc(.2 * var(--experience-brightness))}to{transform:translateX(-46%) scale(1.06);opacity:calc(.48 * var(--experience-brightness))}}
body[data-experience="services"] .service-item,body[data-experience="laboratory"] .lab-card{position:relative;border-top:2px solid color-mix(in srgb,var(--secondary) 40%,var(--line));transition:border-color .3s ease,box-shadow .3s ease}
body[data-experience="services"] .service-item:focus-within,body[data-experience="services"] .service-item:hover{border-color:var(--primary);box-shadow:0 10px 26px color-mix(in srgb,var(--primary) 8%,transparent)}
body[data-experience="laboratory"] .lab-card::before{content:"";position:absolute;top:0;left:1.5rem;width:calc(100% - 3rem);height:2px;background:linear-gradient(90deg,transparent,var(--silk-champagne),var(--secondary),transparent);transform:scaleX(var(--section-reach,.1));transform-origin:left;pointer-events:none}
body[data-experience="contact"] .card,body[data-experience="contact"] :is(input,select,textarea,form){transform:none!important;animation:none!important}
body[data-experience] .booking-panel{position:relative;isolation:isolate;overflow:hidden}
body[data-experience] .booking-panel::before{content:"";position:absolute;pointer-events:none;inset:-30% -20%;background:linear-gradient(120deg,transparent 40%,color-mix(in srgb,var(--silk-champagne) 12%,transparent) 49%,transparent 60%);transform:translateX(-24%);animation:closing-light calc(26s / var(--experience-speed)) linear infinite alternate;z-index:-1}
@keyframes closing-light{to{transform:translateX(24%)}}
body[data-experience] .button{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
body[data-experience] .button:focus-visible{box-shadow:0 0 0 6px color-mix(in srgb,var(--focus) 13%,transparent)}
[data-decor-visible="false"]::after,[data-decor-visible="false"]::before,[data-decor-visible="false"] .booking-panel::before{animation-play-state:paused!important}
body[data-experience-paused] *,body[data-experience-paused] *::before,body[data-experience-paused] *::after{animation-play-state:paused!important}
@media(max-width:699px){.experience-intro-image{width:160px;margin-top:1.25rem;border-radius:24px 24px 64px 24px}[data-motion-section]>.experience-stage-flow{height:60px}body[data-experience] :is(.program-card,.focus-card):focus-visible{transform:none}}
@media(prefers-reduced-motion:reduce){body[data-experience] *,body[data-experience] *::before,body[data-experience] *::after{animation:none!important;transition:none!important;transform:none!important}.stage-progress{stroke-dashoffset:0!important}}
html[data-motion-reduced] body[data-experience] *,html[data-motion-reduced] body[data-experience] *::before,html[data-motion-reduced] body[data-experience] *::after{animation:none!important;transition:none!important}
html[data-motion-reduced] .stage-progress{stroke-dashoffset:0!important}
@media(forced-colors:active){.experience-decoration,[data-motion-section]::after,.hero-portrait::before,.experience-intro-image::before,.booking-panel::before{display:none!important}}
.experience-decoration svg{transform:scaleY(calc(.65 + .35 * var(--experience-intensity)));transform-origin:center}
body[data-experience] .booking-panel::before{opacity:var(--experience-brightness)}
[data-decor-visible="false"] .hero-portrait::before,[data-decor-visible="false"] .experience-intro-image::before{animation-play-state:paused!important}
body[data-experience-paused] :is(.program-card,.focus-card),html[data-motion-reduced] body[data-experience] :is(.program-card,.focus-card){transform:none!important;transition:none!important}
html[data-studio-static] *,html[data-studio-static] *::before,html[data-studio-static] *::after{animation:none!important;transition:none!important}
html[data-studio-static] .fidelity-canvas,html[data-studio-static] .fidelity-video{display:none!important}
html[data-studio-static] .renderer-fallback{visibility:visible!important}
html[data-studio-static] .mobile-static{display:block!important}

.renderer-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none;contain:paint;border-radius:inherit;isolation:isolate}
.ribbon-static,.ribbon-video,.ribbon-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;object-fit:cover}
.ribbon-canvas,.ribbon-video{display:none}.renderer-scene[data-ready=webgl] .ribbon-canvas{display:block}.renderer-scene[data-ready=video] .ribbon-video{display:block}.renderer-scene[data-ready] .ribbon-static{display:none}
.renderer-protection{position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--paper) 32%,transparent),color-mix(in srgb,var(--paper) 61%,transparent) 36%,transparent 70%)}
body[data-experience=home] .hero{position:relative}body[data-experience=home] .hero-copy,body[data-experience=home] .hero-portrait{position:relative;z-index:2}body[data-experience=home] .hero-contours{display:none}
@media(max-width:699px){.renderer-protection{background:linear-gradient(180deg,color-mix(in srgb,var(--paper) 14%,transparent),color-mix(in srgb,var(--paper) 69%,transparent) 44%,color-mix(in srgb,var(--paper) 59%,transparent) 64%,transparent)}}
@media(max-width:699px),(max-width:1000px) and (max-height:500px){body[data-experience=home]{padding-bottom:70px}body[data-experience=home] .mobile-booking{display:block;position:fixed;inset:auto 0 0;padding:5px 18px calc(5px + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);z-index:35;text-align:center}body[data-experience=home] .mobile-booking .button{min-height:44px;width:min(100%,420px)}body[data-experience=home] #receptionist-launcher{bottom:calc(70px + env(safe-area-inset-bottom));width:48px;height:48px;padding:0;justify-content:center}body[data-experience=home] #receptionist-launcher>span{display:none}}
@media(prefers-reduced-motion:reduce){.renderer-scene .ribbon-canvas,.renderer-scene .ribbon-video{display:none!important}.renderer-scene .ribbon-static{display:block!important}}
html[data-motion-reduced] .ribbon-canvas,html[data-motion-reduced] .ribbon-video,html[data-studio-static] .ribbon-canvas,html[data-studio-static] .ribbon-video{display:none!important}html[data-motion-reduced] .ribbon-static,html[data-studio-static] .ribbon-static{display:block!important}
@media(forced-colors:active){.renderer-scene{display:none}}