.ll{--ease:cubic-bezier(.77,0,.18,1);--p:0;position:relative;color:#F6EEE9;max-width:100%;overflow:hidden}
.ll *{box-sizing:border-box}
.ll-stage{position:relative;background:#1C0416;min-height:clamp(380px,56vh,560px);overflow:hidden;outline:none}
.ll-stage:focus-visible{box-shadow:inset 0 0 0 1px #C9B6CD}
.ll-bg{position:absolute;inset:0;pointer-events:none;transition:opacity 1.2s var(--ease)}
.ll-bg1{background:radial-gradient(120% 90% at 20% 110%,#441C47 0%,rgba(68,28,71,0) 70%);opacity:calc(var(--p) * .9)}
.ll-bg2{background:linear-gradient(135deg,#5F187F 0%,#441C47 70%);opacity:0}
.ll.is-last .ll-bg2{opacity:.9}
.ll-spot{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease);background:radial-gradient(ellipse 34% 100% at 50% -8%,rgba(246,238,233,.2) 0%,rgba(246,238,233,.07) 45%,rgba(246,238,233,0) 72%)}
.ll.is-last .ll-spot{opacity:1}
.ll-ctr{position:absolute;top:22px;right:28px;z-index:3;font-size:11px;letter-spacing:.16em;color:#C9B6CD;font-variant-numeric:tabular-nums}
.ll-slides{position:absolute;inset:0}
.ll-slide{position:absolute;inset:0;pointer-events:none}
.ll-year{position:absolute;left:4%;top:50%;margin-top:calc(clamp(96px,16vw,240px) * -.62);font-family:var(--font-marquee);font-size:clamp(96px,16vw,240px);line-height:1;letter-spacing:.02em;color:rgba(201,182,205,.35);opacity:0;transform:translateX(0);transition:transform .6s var(--ease),opacity .6s var(--ease);white-space:nowrap}
.ll-copy{position:absolute;left:clamp(24px,6%,88px);bottom:clamp(56px,9%,84px);width:min(46ch,calc(100% - 48px));opacity:0;transform:translateX(0);transition:transform .6s var(--ease),opacity .6s var(--ease)}
.ll-t{margin:0 0 14px;font-family:var(--font-display);font-weight:500;font-size:clamp(28px,3.4vw,48px);line-height:1.05;letter-spacing:-.01em;color:#F6EEE9}
.ll-d{margin:0;font-family:var(--font-body);font-size:17px;line-height:1.55;max-width:46ch;color:rgba(246,238,233,.8)}
.ll-d em{font-style:normal;display:inline-block;transform:skewX(-10.7deg)}
.ll-slide.is-on .ll-year,.ll-slide.is-on .ll-copy{opacity:1;transform:none}
.ll-slide.is-on{pointer-events:auto}
.ll-slide.is-before .ll-year{transform:translateX(-14vw)}
.ll-slide.is-after .ll-year{transform:translateX(14vw)}
.ll-slide.is-before .ll-copy{transform:translateX(-36px)}
.ll-slide.is-after .ll-copy{transform:translateX(36px)}
.ll-nav{position:absolute;right:24px;bottom:22px;z-index:3;display:flex;gap:8px}
.ll-btn{width:40px;height:40px;border:1px solid rgba(201,182,205,.4);background:transparent;color:#F6EEE9;font:400 16px var(--font-body);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.ll-btn:hover{background:#F6EEE9;color:#1C0416;border-color:#F6EEE9}
.ll-btn:focus-visible,.ll-dot:focus-visible,.ll-handle:focus-visible{outline:1px solid #C9B6CD;outline-offset:3px}
.ll-scroll{background:#1C0416;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;border-top:1px solid rgba(201,182,205,.18)}
.ll-scroll::-webkit-scrollbar{display:none}
.ll-track{position:relative;height:104px;margin:0 clamp(28px,5%,72px);min-width:640px;user-select:none;touch-action:pan-x}
.ll-line{position:absolute;left:0;right:0;top:38px;height:1px;background:rgba(201,182,205,.3)}
.ll-fill{position:absolute;left:0;top:38px;height:1px;width:0;background:#964785}
.ll-fill,.ll-handle{transition:left .6s var(--ease),width .6s var(--ease)}
.ll.is-drag .ll-fill,.ll.is-drag .ll-handle{transition:none}
.ll-dot{position:absolute;top:14px;width:48px;height:76px;margin-left:-24px;padding:0;border:0;background:none;cursor:pointer;color:#A587A7;z-index:1}
.ll-dotm{position:absolute;left:50%;top:18px;width:9px;height:9px;margin:0 0 0 -4.5px;border-radius:50%;background:#1C0416;border:1px solid #A587A7;transition:background .4s,border-color .4s,transform .4s var(--ease)}
.ll-dot.is-past .ll-dotm{background:#964785;border-color:#964785}
.ll-dot.is-on .ll-dotm{background:#964785;border-color:#964785;transform:scale(1.5)}
.ll-dl{position:absolute;left:50%;top:44px;transform:translateX(-50%);font-family:var(--font-marquee);font-size:13px;letter-spacing:.08em;white-space:nowrap;transition:color .3s}
.ll-dot.is-on .ll-dl,.ll-dot:hover .ll-dl{color:#F6EEE9}
.ll-brk{position:absolute;top:28px;transform:translateX(-50%);font-family:var(--font-body);font-size:13px;letter-spacing:.1em;color:#A587A7;background:#1C0416;padding:0 6px;line-height:20px}
.ll-handle{position:absolute;top:22px;left:0;width:34px;height:34px;margin-left:-17px;border-radius:50%;border:1px solid #F6EEE9;background:rgba(150,71,133,.22);cursor:grab;z-index:2;padding:0;touch-action:none}
.ll-handle::after{content:"";position:absolute;inset:50% auto auto 50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#F6EEE9}
.ll.is-drag .ll-handle{cursor:grabbing}
@media (max-width:700px){
  .ll-stage{min-height:420px}
  .ll-ctr{top:16px;right:20px}
  .ll-year{left:16px;top:64px;margin-top:0;font-size:clamp(96px,30vw,150px)}
  .ll-copy{left:20px;bottom:76px;width:calc(100% - 40px)}
  .ll-d{font-size:16px}
  .ll-nav{left:20px;right:auto;bottom:18px}
  .ll-slide.is-before .ll-year{transform:translateX(-30vw)}
  .ll-slide.is-after .ll-year{transform:translateX(30vw)}
}
@media (prefers-reduced-motion:reduce){
  .ll-year,.ll-copy,.ll-bg,.ll-spot,.ll-fill,.ll-handle,.ll-dotm{transition:opacity .01s!important}
  .ll-slide.is-before .ll-year,.ll-slide.is-after .ll-year,.ll-slide.is-before .ll-copy,.ll-slide.is-after .ll-copy{transform:none}
}