/* Scheme two. All new rules are scoped to the copied hero. */
.life-story{position:relative;background:#000;isolation:isolate;color:#252525;font-family:var(--font-gilroy,Gilroy),sans-serif}
.life-stage{position:relative;width:100%;height:100svh;min-height:480px;overflow:hidden;background:#000}
.life-white{position:absolute;inset:0;background:#e0ddde;clip-path:circle(150% at 50% 50%);will-change:clip-path,opacity}
.life-people,.life-intro,.life-product{position:absolute;inset:0;pointer-events:none}
.life-person{position:absolute;overflow:hidden;transform-origin:center;will-change:transform,opacity}
.life-person img{position:absolute;max-width:none;pointer-events:none}
.life-intro{z-index:2;text-align:center;padding-top:clamp(95px,13vh,145px)}
.life-eyebrow{font-size:11px;letter-spacing:.19em;font-weight:500;line-height:1.5}
.life-intro h1{font-size:clamp(57px,6.75vw,102px);font-weight:500;letter-spacing:-.055em;line-height:1.04;margin:15px 16px 0}
.life-window{position:absolute;overflow:hidden;z-index:3;opacity:0;will-change:transform,opacity;border-radius:3px}
.life-window video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.life-caption{position:absolute;z-index:4;left:0;right:0;bottom:12%;text-align:center;pointer-events:none;opacity:0}
.life-caption p{font-size:clamp(23px,2.6vw,36px);letter-spacing:-.035em;line-height:1.2;margin-top:8px}
.life-collect{position:absolute;inset:12% 0 auto;text-align:center;z-index:3;opacity:0;font-size:clamp(30px,3.6vw,54px);line-height:1.08;letter-spacing:-.045em;pointer-events:none}
.life-collect span{color:#777}
.life-handoff{position:absolute;overflow:hidden;z-index:5;opacity:0;will-change:transform,opacity}
.life-handoff img{width:100%;height:100%;object-fit:fill;max-width:none}
.life-device{position:absolute;left:0;top:0;width:512px;height:512px;transform-origin:0 0;z-index:7;opacity:0;will-change:transform,opacity;pointer-events:none}
.life-device img,.life-device canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain}
.life-device canvas{opacity:0}
.life-product{z-index:8;opacity:0;color:#888;text-align:center}
.life-wordmark{position:absolute;width:min(40vw,560px);height:auto;left:50%;top:11%;transform:translateX(-50%)}
.life-product p{position:absolute;top:72%;width:100%;font-size:clamp(12px,1.3vw,19px);line-height:1.22;letter-spacing:-.015em;font-weight:500;color:#333333}
.life-bottom{position:absolute;z-index:9;bottom:28px;left:36px;right:36px;display:flex;justify-content:space-between;align-items:center;font-size:12px;line-height:1.4}
.life-bottom a{color:inherit;text-decoration:none;opacity:.7;padding:12px 0 12px 12px}.life-bottom a:hover{opacity:1}.life-bottom a:focus-visible{outline:2px solid #ff6400;outline-offset:5px}
.life-scroll>span{margin-left:18px}
.life-story.is-dark .life-bottom{color:#aaa}
.life-story.is-reduced .life-stage{min-height:540px}
@media(max-width:767px){.life-stage{min-height:600px}.life-intro{padding-top:100px}.life-intro h1{font-size:57px}.life-eyebrow{font-size:9px}.life-bottom{left:20px;right:20px;bottom:18px;font-size:11px}.life-scroll>span{margin-left:5px}.life-caption{bottom:17%}.life-caption p{font-size:26px}.life-collect{top:15%;font-size:34px}.life-wordmark{width:76%;top:23%}.life-product p{top:72%;font-size:13px}}
@media(prefers-reduced-motion:reduce){.life-story *{scroll-behavior:auto!important}}
.site-header.life-dark-header .site-menu-cta,.site-header.life-dark-header .site-logo{color:#fff}

@font-face{font-family:'Life Quip';src:url('media/66da911aec2c6b8a/Quip DEMO.otf') format('opentype');font-display:swap}
.life-wordmark{font-family:'Life Quip',sans-serif;font-size:clamp(90px,15vw,210px);letter-spacing:-.065em;line-height:.9;white-space:nowrap;width:auto;color:#292929}.life-wordmark span:first-child{color:var(--accent-orange, #ff6400)}
.site-header.life-dark-header .site-logo .logo-mark{filter:brightness(0) invert(1)}
@media(max-width:767px){.life-wordmark{font-size:clamp(74px,28vw,155px);width:auto}}
.life-person{mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 95%,transparent 100%)}
.life-device-mark{position:absolute;width:32px;height:32px;transform:translate(-50%,-50%);border:1px solid #ff6400;border-radius:50%;box-shadow:0 0 0 5px rgba(255,255,255,.7);opacity:0;pointer-events:none}
.life-handoff{mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent)}
@media(max-width:767px){.life-person{mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}.life-handoff{mask-image:none}}

/* Revision: immersive film, AR information only, white product stage. */
.life-story,.life-stage{background:#fff;color:#111}
.life-white{clip-path:none;will-change:auto}
.life-film{position:absolute;inset:0;z-index:3;overflow:hidden;opacity:0;pointer-events:none}
.life-film video{position:absolute;max-width:none;object-fit:fill}
.life-handoff{mask-image:none}
.life-product,.life-wordmark,.life-wordmark span:last-child{color:#111}
/* Centered activity ring; scale the 240 px Figma composition as one unit. */
@font-face{font-family:Instrument Sans;src:url('media/66da911aec2c6b8a/activity-ui/instrument-sans-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Instrument Sans;src:url('media/66da911aec2c6b8a/activity-ui/instrument-sans-600.ttf') format('truetype');font-weight:600;font-display:swap}
.life-ar{position:absolute;inset:0;z-index:6;pointer-events:none}
.activity-placement{position:absolute;top:0;left:0;width:240px;height:240px;opacity:0;transform-origin:0 0}
.activity-orb{position:relative;width:240px;height:240px;transform-origin:center;isolation:isolate;color:#fff;font-family:Instrument Sans,sans-serif;font-variant-numeric:tabular-nums}
.activity-ring{position:absolute;inset:0;display:block;max-width:none}
.activity-capsule{position:absolute;left:50%;top:-6px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;height:40px;box-sizing:border-box;padding:4px 10px 4px 4px;border-radius:99px;background:#fff;color:#000;white-space:nowrap}
.activity-avatar{display:block;flex:none;width:32px;height:32px;object-fit:cover;border-radius:50%}
.activity-amount{font-size:21px;font-weight:600;letter-spacing:-.4px}
.activity-name{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:46px;line-height:1.05;font-weight:600;letter-spacing:-1px;padding:0 25px;box-sizing:border-box}
.activity-name.is-long{font-size:32px}
.video-float[hidden]{display:none!important}

.life-intro-video{position:absolute;max-width:none;object-fit:contain;pointer-events:none;mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 95%,transparent 100%)}

.life-scroll { font-size: 16px; color: #999999; }

/* The opening title stays above the stationary first frame, then blurs out on scroll. */
.life-intro { z-index: 4; will-change: opacity, filter, transform; }

/* Center the opening scroll cue in the breathing room below the people. */
.life-bottom { left: 20px; right: 20px; bottom: 12%; justify-content: center; }
.life-scroll { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.life-scroll img { display: block; width: 14px; height: 20px; filter: brightness(0); opacity: .4; }

.life-scroll > .life-scroll-copy { margin-left: 0; }

.life-scroll > .life-scroll-icon { position: relative; display: grid; place-items: center; width: 48px; height: 48px; margin-left: 0; }
.life-scroll-ring { position: absolute; inset: 0; width: 100%; height: 100%; color: #bebbbe; transform-origin: center; animation: scroll-ring-turn 12s linear infinite; }
.life-scroll-icon img { animation: scroll-arrow-breathe 2.8s ease-in-out infinite; transform-origin: center; }
@keyframes scroll-ring-turn { to { transform: rotate(360deg); } }
@keyframes scroll-arrow-breathe { 0%, 100% { transform: scale(.94); } 50% { transform: scale(1.06); } }
@media (prefers-reduced-motion: reduce) {
  .life-scroll-ring, .life-scroll-icon img { animation: none; }
}

.life-film > video { z-index: 1; }
.life-opening-still { position: absolute; z-index: 0; max-width: none; object-fit: fill; pointer-events: none; }

/* Only changed digits roll; the amount stays readable without whole-label blinking. */
[data-activity-reward]{display:inline-flex;align-items:center;line-height:1.2}
.activity-digit{position:relative;display:inline-block;width:1ch;height:1.2em;overflow:hidden;letter-spacing:0;margin-right:.045em}
.activity-digit.is-symbol{width:auto;min-width:.35em}
.activity-digit-value{display:block}
.activity-digit-out{position:absolute;inset:0;display:block}
.life-film .life-action-loop{pointer-events:none;opacity:0;visibility:hidden}
@media(prefers-reduced-motion:reduce){.activity-digit-value,.activity-digit-out{animation:none!important}}
