.rl-fit-demo-section{background:#111410;color:#fff;margin:0;padding:clamp(3rem,5vw,8rem) var(--rl-editorial-gutter,2rem);isolation:isolate}
.rl-fit-demo{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(3rem,6vw,9rem);max-width:144rem;margin:0 auto;--rl-fit-accent:#dff241}
.rl-fit-demo [hidden]{display:none!important}
.rl-fit-demo__photo-controls{display:none}
.rl-fit-demo[data-ready=true] .rl-fit-demo__photo-controls{display:block}
.rl-fit-demo__stage{position:relative;aspect-ratio:1;min-width:0;border-radius:2rem;background:#e7e8e1;overflow:hidden;box-shadow:0 2rem 8rem #0005;isolation:isolate}
.rl-fit-demo__photo{display:block;width:100%;height:100%;object-fit:contain}
.rl-fit-demo__overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rl-fit-demo__bed{visibility:hidden}
.rl-fit-demo__overlay:has([data-rl-fit-face-image][href]) .rl-fit-demo__bed{visibility:visible}
.rl-fit-demo__rotor,.rl-fit-demo__orbit{transform:rotate(var(--rl-fit-angle));transition:transform .52s cubic-bezier(.18,.75,.2,1);transform-box:view-box}
.rl-fit-demo__orbit{opacity:0;transition:transform .52s cubic-bezier(.18,.75,.2,1),opacity .3s}
.rl-fit-demo[data-ready=true] .rl-fit-demo__orbit{opacity:.9}
.rl-fit-demo__cables{stroke-width:3;opacity:0;stroke-dasharray:10 9;stroke-dashoffset:0;transition:opacity .35s,stroke-width .35s}
.rl-fit-demo[data-state="1"] .rl-fit-demo__cables{opacity:.6;stroke-width:3}
.rl-fit-demo[data-state="2"] .rl-fit-demo__cables{opacity:.85;stroke-width:4}
.rl-fit-demo[data-state="3"] .rl-fit-demo__cables{opacity:1;stroke-width:5}
.rl-fit-demo.is-turning .rl-fit-demo__cables{animation:rl-fit-cable-draw .5s linear}
.rl-fit-demo__dial{position:absolute;left:var(--rl-fit-x);top:var(--rl-fit-y);width:var(--rl-fit-diameter);aspect-ratio:1;min-width:4.4rem;min-height:4.4rem;transform:translate(-50%,-50%);border:0;border-radius:50%;padding:0;background:transparent;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rl-fit-demo__dial::before{content:'';position:absolute;inset:-.5rem;border:1px solid var(--rl-fit-accent);border-radius:50%;box-shadow:0 0 0 .8rem #dff24119,0 0 4rem #dff2412b;opacity:.65;transition:box-shadow .3s}
.rl-fit-demo[data-in-view=true]:not([data-engaged=true]) .rl-fit-demo__dial::before{animation:rl-fit-invite 1.8s ease-out 3}
.rl-fit-demo__dial:hover::before{box-shadow:0 0 0 1.2rem #dff24126,0 0 5rem #dff2414d;opacity:1}
.rl-fit-demo__dial[aria-disabled=true]{cursor:default}
.rl-fit-demo__dial-hint{position:absolute;right:-.3rem;top:-.8rem;display:flex;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;border-radius:50%;background:var(--rl-fit-accent);color:#111410;font:500 2.6rem/1 sans-serif;box-shadow:0 .3rem 1rem #0002;transition:transform .52s}
.rl-fit-demo.is-turning .rl-fit-demo__dial-hint{transform:rotate(60deg)}
.rl-fit-demo__touch-hint{position:absolute;left:calc(var(--rl-fit-x) + var(--rl-fit-diameter)/2 + 2rem);top:var(--rl-fit-y);display:flex;align-items:center;gap:.8rem;transform:translateY(-50%);max-width:15rem;padding:.8rem 1.1rem;background:#111410eb;border-radius:999px;color:#fff;font-size:1.15rem;line-height:1.4;white-space:nowrap;pointer-events:none}
.rl-fit-demo__touch-hint span{color:var(--rl-fit-accent);font-size:1.8rem}
.rl-fit-demo[data-engaged=true] .rl-fit-demo__touch-hint{opacity:0;transition:opacity .3s}
.rl-fit-demo__photo-label{position:absolute;left:1.8rem;bottom:1.8rem;background:#111410e6;color:#fff;border-radius:999px;padding:.7rem 1.2rem;font-size:1.1rem;font-weight:500;letter-spacing:.02em;line-height:1.4}
.rl-fit-demo__copy{min-width:0}
.rl-fit-demo .rl-fit-demo__eyebrow{margin:0 0 2rem;font-size:1.15rem;letter-spacing:.13em;font-weight:650;text-transform:uppercase;color:var(--rl-fit-accent);line-height:1.6}
.rl-fit-demo .rl-fit-demo__copy h2{margin:0;color:#fff;font-size:clamp(4.5rem,5.1vw,8rem);font-weight:700;letter-spacing:-.055em;line-height:1.02;text-wrap:balance}
.rl-fit-demo__copy h2 span{color:var(--rl-fit-accent)}
.rl-fit-demo :is(button,a):focus-visible{outline:2px solid #fff;outline-offset:6px;box-shadow:0 0 0 4px #111410}
.rl-fit-demo-section--white{background:#fff;color:#111410}
.rl-fit-demo-section--white .rl-fit-demo__stage{box-shadow:0 1rem 4rem #00000014}
.rl-fit-demo-section--white .rl-fit-demo .rl-fit-demo__copy h2{color:#111410}
.rl-fit-demo-section--white .rl-fit-demo__copy h2 span{color:#899500}
.rl-fit-demo-section--white .rl-fit-demo .rl-fit-demo__eyebrow{color:#536000}
.rl-fit-demo-section--white .rl-fit-demo :is(button,a):focus-visible{outline-color:#111410;box-shadow:0 0 0 4px #fff}
@keyframes rl-fit-invite{0%{box-shadow:0 0 0 0 #dff24166;opacity:1}80%,100%{box-shadow:0 0 0 2.4rem #dff24100;opacity:.65}}
@keyframes rl-fit-cable-draw{to{stroke-dashoffset:-38}}
@media(max-width:989px){.rl-fit-demo{grid-template-columns:minmax(0,1fr);gap:3rem}.rl-fit-demo-section{padding:3rem var(--rl-editorial-gutter,1.8rem)}.rl-fit-demo__stage{max-width:68rem;width:100%;margin:0 auto}.rl-fit-demo__copy{max-width:68rem;width:100%;margin:0 auto}.rl-fit-demo .rl-fit-demo__copy h2{font-size:clamp(4.2rem,9vw,6rem)}}
@media(max-width:449px){.rl-fit-demo__touch-hint{left:calc(var(--rl-fit-x) + var(--rl-fit-diameter)/2 + 1rem);font-size:1rem;padding:.7rem .9rem;gap:.5rem}.rl-fit-demo__dial-hint{width:3rem;height:3rem;font-size:2.2rem}.rl-fit-demo__photo-label{left:1rem;bottom:1rem;font-size:1rem}.rl-fit-demo__stage{border-radius:1.3rem}}
@media(prefers-reduced-motion:reduce){.rl-fit-demo *,.rl-fit-demo *::before,.rl-fit-demo *::after{animation:none!important;transition:none!important}}
