.index-animated-technology{position:relative;overflow:hidden;background:#fdfdfd;width:100%;height:658px;contain:layout style paint}.index-animated-technology__container{position:relative;z-index:2;max-width:1440px;margin:0 auto;height:100%}.index-animated-technology__video-background{position:absolute;top:0;right:0;width:70%;height:100%;z-index:1;overflow:hidden}.index-animated-technology__video-background:before{content:"";position:absolute;top:0;left:0;width:100px;height:100%;background:linear-gradient(90deg,#fdfdfd,#fdfdfdcc,#fdfdfd00);z-index:2}.index-animated-technology__video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:right top;opacity:0;transition:opacity .3s ease-in-out;will-change:opacity}.index-animated-technology__video.active{opacity:1}.index-animated-technology__content{position:relative;height:100%;display:grid;grid-template-columns:473px 1fr;gap:36px;padding:0 36px}.index-animated-technology__left-content{display:flex;flex-direction:column;gap:80px;padding-top:60px}.index-animated-technology__title{font-family:var(--font-family-body);font-weight:500;font-size:24px;line-height:1.2;color:var(--color-warm-gray-neutral-700);margin:0;animation:fadeInUp .8s ease-out}.index-animated-technology__title--mobile{display:none}.index-animated-technology__infographic{background:var(--color-warm-gray-neutral-200);border-radius:10px;display:grid;grid-template-rows:54px 3px 1fr;padding:0;opacity:1;transition:opacity .3s ease;will-change:opacity;min-height:400px}.index-animated-technology__infographic.active{opacity:1}.index-animated-technology__tabs{position:relative;display:grid;grid-template-columns:1fr 1fr;height:54px;border-radius:10px 10px 0 0;overflow:hidden}.index-animated-technology__tab-indicator{position:absolute;top:0;left:0;background:var(--color-warm-gray-neutral-300);height:54px;border-radius:10px 0 0;transition:all .5s cubic-bezier(.4,0,.2,1);width:50%;will-change:transform;z-index:1}.index-animated-technology__tab-indicator.tab-2{transform:translate(100%);border-radius:0 10px 0 0}.index-animated-technology__tab{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;font-family:var(--font-family-body);font-weight:700;font-size:18px;line-height:1.4;color:var(--color-warm-gray-neutral-800);text-align:center;transition:all .3s ease;cursor:pointer;-webkit-user-select:none;user-select:none;will-change:opacity;padding:0 10px}.index-animated-technology__tab:hover{opacity:.8}.index-animated-technology__tab.inactive{opacity:.3}.index-animated-technology__progress-bar{height:3px;background:var(--color-warm-gray-neutral-300);overflow:hidden;margin:0}.index-animated-technology__progress-fill{height:100%;background:linear-gradient(90deg,var(--color-lilypad-300) 0%,#1A7A2E 100%);width:0%;border-radius:2px;will-change:width}.index-animated-technology__main-content{display:grid;grid-template-columns:75px 1fr;gap:36px;padding:24px 28px 24px 20px}.index-animated-technology__chart{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%}.index-animated-technology__chart-lines{display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:10px;margin-top:8px}.index-animated-technology__chart-line{height:2px;background:var(--color-lilypad-300);border-radius:1px;width:100%;opacity:.1;transition:opacity .3s ease;transition-delay:var(--animation-delay, 0s)}.index-animated-technology__chart-line:nth-child(odd){width:calc(100% - 15px)}.index-animated-technology__chart-line.filled{opacity:1}.index-animated-technology__chart-line.unfilled{opacity:.1}.index-animated-technology__content-area{position:relative;display:flex;flex-direction:column;gap:20px;min-height:120px}.index-animated-technology__tab-content{position:absolute;top:0;left:0;width:100%;font-family:var(--font-family-body);font-weight:400;font-size:18px;line-height:1.4;color:#464646;opacity:0;transition:opacity .3s ease;will-change:opacity}.index-animated-technology__humidity-display{display:flex;flex-direction:column;justify-content:flex-end;margin-top:auto;margin-left:auto;animation:fadeInUp .8s ease-out .3s both}.index-animated-technology__humidity-number{font-family:var(--font-family-body);font-weight:800;font-size:100px;line-height:1;letter-spacing:-.02em;text-transform:uppercase;color:var(--color-warm-gray-neutral-700);transition:all .3s ease;will-change:auto}.index-animated-technology__humidity-label{font-family:var(--font-family-body);font-weight:700;font-size:18px;line-height:1.4;color:#000;animation:fadeInUp .8s ease-out .4s both}.index-animated-technology__humidity-number-container{display:flex;align-items:flex-end;justify-content:flex-end;gap:6px}.index-animated-technology__humidity-percentage{margin-top:-4px;width:36px;height:36px;background:var(--color-lilypad-300);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-family-body);font-weight:500;font-size:21px;line-height:1.2;color:var(--color-warm-gray-neutral-100);position:relative;top:-14px}.index-animated-technology__controls{position:absolute;bottom:16px;left:36px}.index-animated-technology__pause-btn{width:24px;height:24px;background:#0000001a;border:1px solid rgba(0,0,0,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);will-change:background,transform}.index-animated-technology__pause-btn:hover{background:#0003;transform:scale(1.1)}.index-animated-technology__pause-btn:active{transform:scale(.95)}.index-animated-technology__pause-icon{width:6px;height:8px;position:relative;transition:all .3s ease}.index-animated-technology__pause-icon:before,.index-animated-technology__pause-icon:after{content:"";position:absolute;width:2px;height:8px;background:var(--color-warm-gray-neutral-800);top:0;transition:all .3s ease;border-radius:1px}.index-animated-technology__pause-icon:before{left:0}.index-animated-technology__pause-icon:after{right:0}.index-animated-technology__pause-btn.playing .index-animated-technology__pause-icon:before{left:50%;transform:translate(-50%);clip-path:polygon(0 0,100% 50%,0 100%);width:6px;height:8px}.index-animated-technology__pause-btn.playing .index-animated-technology__pause-icon:after{display:none}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.index-animated-technology__controls--mobile{display:none}@media screen and (max-width:768px){.index-animated-technology{height:auto}.index-animated-technology__container{padding:0 16px;margin-top:-16px}.index-animated-technology__controls--desktop{display:none}.index-animated-technology__controls--mobile{display:block}.index-animated-technology__video-background{position:relative;left:0;width:100%;height:auto;order:1}.index-animated-technology__video-background:before{display:none}.index-animated-technology__video[data-tab="1"]{position:static;height:auto;object-fit:initial;object-position:initial}.index-animated-technology__video[data-tab="2"]{position:absolute;top:0;left:0;width:100%;height:auto;object-fit:initial;object-position:initial}.index-animated-technology__content{display:flex;flex-direction:column;gap:40px;padding:0}.index-animated-technology__left-content{order:2;padding-top:0;gap:40px}.index-animated-technology__title{font-size:20px;padding:16px}.index-animated-technology__title--mobile{display:block}.index-animated-technology__title--desktop{display:none}.index-animated-technology__infographic{order:3;min-height:365px}.index-animated-technology__tab{font-size:15px;padding:8px;line-height:1.1}.index-animated-technology__main-content{padding:20px 16px 24px 20px;gap:24px}.index-animated-technology__content-area{order:1;min-height:100px}.index-animated-technology__humidity-number{font-size:70px}.index-animated-technology__controls{position:absolute;top:16px;left:16px}.index-animated-technology__pause-btn{width:20px;height:20px}.index-animated-technology__humidity-display{margin-left:0;margin-right:auto}.index-animated-technology__humidity-percentage{top:-10px}}@media(prefers-reduced-motion:reduce){.index-animated-technology__video,.index-animated-technology__tab-indicator,.index-animated-technology__tab,.index-animated-technology__humidity-number,.index-animated-technology__tab-content,.index-animated-technology__pause-btn{transition:none}.index-animated-technology__chart-line{animation:none;opacity:1}.index-animated-technology__title,.index-animated-technology__humidity-display,.index-animated-technology__humidity-label,.index-animated-technology__humidity-percentage{animation:none}}@media(prefers-contrast:high){.index-animated-technology__infographic{background:var(--color-warm-gray-neutral-100);border:2px solid #000000}.index-animated-technology__tab-indicator{background:#000}.index-animated-technology__pause-btn{background:var(--color-warm-gray-neutral-100);border:2px solid #000000}.index-animated-technology__pause-icon:before,.index-animated-technology__pause-icon:after{background:#000}}.index-animated-technology__tab:focus-visible,.index-animated-technology__pause-btn:focus-visible{outline:2px solid var(--color-lilypad-300);outline-offset:2px}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-index-animated-technology.css.map */