/* This file belongs to home-storytelling-preview.html only. */
.lighting-journey{--lj-accent:var(--brand-accent);font-family:Outfit,Anuphan,sans-serif;color:var(--ink);background:#fff;max-width:1600px;margin:80px auto 0;scroll-margin-top:100px}
.lj-scroll-region{margin:0 4%}
.lj-pin{position:relative;isolation:isolate;padding:64px 0 56px}
.lj-pin::before{content:"";position:absolute;inset:0 -4.35%;z-index:-1;pointer-events:none;background-image:linear-gradient(90deg,#86b35f1c 1px,transparent 1px),linear-gradient(#86b35f1c 1px,transparent 1px);background-size:80px 80px;mask-image:radial-gradient(ellipse at 52% 50%,#000 28%,transparent 77%)}
.lj-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:10%;align-items:start}
.lj-intro{min-width:0}
.lj-label.section-tag{font-family:Anuphan,sans-serif;font-size:13px;padding:4px 8px;margin-bottom:25px;letter-spacing:0;line-height:1.5}
.lighting-journey h2{font-family:Anuphan,sans-serif;font-size:clamp(35px,3.7vw,54px);font-weight:400;line-height:1.42;letter-spacing:-.025em;color:var(--ink);margin:0}
.lj-intro-bottom{margin-top:42px;max-width:430px}
.lj-intro-bottom>p{font:400 17px/1.85 Anuphan,sans-serif;color:var(--muted)}
.lj-timeline{position:relative;min-width:0;padding-left:82px}
.lj-rail{position:absolute;top:22px;left:6px;bottom:18px;width:2px;background:#dfe4df;overflow:hidden}
.lj-rail-fill{position:absolute;inset:0;background:linear-gradient(180deg,var(--green),var(--lime));height:100%;transform:scaleY(0);transform-origin:center top;will-change:transform}
.lj-steps{list-style:none;margin:0;padding:0}
.lj-step{position:relative;padding-bottom:30px;scroll-margin-top:120px;min-width:0}
.lj-step:last-child{padding-bottom:18px}
.lj-dot{position:absolute;left:-81px;top:17px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid #b8c1b8;z-index:1;transition:background .35s,border-color .35s,box-shadow .35s}
.lj-icon{position:absolute;left:-52px;top:28px;width:29px;height:29px;color:var(--ink)}
.lj-icon svg{width:100%;height:100%;display:block}
.lj-step-heading{margin:0;font-weight:400}
.lj-step-toggle{display:block;width:100%;text-align:left;color:var(--ink);padding:0;border:0;background:transparent;cursor:default}
.lj-step-toggle:disabled{opacity:1;color:var(--ink);cursor:default}
.lj-step-number{display:block;font:400 13px/1.6 Anuphan,sans-serif;color:var(--muted);margin-bottom:8px}
.lj-step-title{display:block;font:400 clamp(22px,2.1vw,29px)/1.5 Anuphan,sans-serif;letter-spacing:-.015em;color:var(--ink)}
.lj-step-body{display:grid;grid-template-rows:1fr;transition:grid-template-rows .5s ease}
.lj-step-body-inner{overflow:hidden;min-height:0}
.lj-step-body p{font:400 16px/1.85 Anuphan,sans-serif;color:var(--muted);margin:15px 0 4px;max-width:440px}
.lighting-journey.lj-enhanced .lj-scroll-region{height:300svh;min-height:1800px}
.lj-enhanced .lj-pin{position:sticky;top:96px;height:calc(100svh - 120px);padding:25px 0 28px;min-height:510px}
.lj-enhanced .lj-layout{height:100%;align-items:stretch}
.lj-enhanced .lj-intro{display:flex;flex-direction:column;justify-content:space-between;padding-bottom:8px}
.lj-enhanced .lj-intro-bottom{margin-top:28px}
.lj-enhanced .lj-timeline{height:100%;align-self:stretch}
.lj-enhanced .lj-step{padding-bottom:28px;opacity:1;transform:translateY(0);transition:opacity .5s ease,transform .5s ease}
.lj-enhanced .lj-step.is-future{opacity:0;transform:translateY(18px);pointer-events:none}
.lj-enhanced .lj-step:last-child{padding-bottom:16px}
.lj-enhanced .lj-step-toggle{cursor:pointer}
.lj-enhanced .lj-step-title{color:#697278;transition:color .3s}
.lj-enhanced .lj-step-number{color:#818a8e;transition:color .3s}
.lj-enhanced .lj-icon{opacity:0;transition:opacity .4s ease}
.lj-enhanced .lj-step-body{grid-template-rows:0fr}
.lj-enhanced .lj-step.is-active .lj-step-body{grid-template-rows:1fr}
.lj-enhanced .lj-step.is-active .lj-step-title,.lj-enhanced .lj-step.is-active .lj-step-number{color:var(--ink)}
.lj-enhanced .lj-step.is-active .lj-icon{opacity:1}
.lj-enhanced .lj-step.is-active .lj-dot{border-color:#fff;background:#fff;box-shadow:0 0 0 5px #b2d7002b,0 0 14px 5px #b2d70050}
.lj-dot::before,.lj-dot::after{content:"";position:absolute;border-radius:50%;pointer-events:none;opacity:0}
.lj-enhanced .lj-step.is-active .lj-dot::before{inset:-19px;background:radial-gradient(circle,#b2d70070 0%,#b2d70030 35%,transparent 72%);opacity:.7;animation:lj-dot-breathe 2.8s ease-in-out infinite}
.lj-enhanced .lj-step.is-active .lj-dot::after{inset:-7px;border:1px solid #b2d70070;opacity:.45;animation:lj-dot-ripple 2.8s ease-out infinite}
@keyframes lj-dot-breathe{0%,100%{transform:scale(.92);opacity:.5}50%{transform:scale(1.18);opacity:.85}}
@keyframes lj-dot-ripple{0%{transform:scale(.92);opacity:.4}75%,100%{transform:scale(1.6);opacity:0}}
.lj-enhanced .lj-step.is-past .lj-dot{background:var(--lj-accent);border-color:var(--lj-accent)}
.lj-enhanced .lj-step-toggle:hover .lj-step-title{color:var(--ink)}
.lj-step-toggle:focus-visible{outline:2px solid var(--lj-accent);outline-offset:7px;border-radius:3px}
@media(min-width:901px) and (max-height:760px){.lj-enhanced .lj-pin{top:88px;height:calc(100svh - 106px);min-height:0;padding-top:14px;padding-bottom:20px}.lighting-journey h2{font-size:clamp(35px,3.5vw,46px)}.lj-intro-bottom>p{font-size:16px;line-height:1.8}.lj-step-title{font-size:24px;line-height:1.4}.lj-step-body p{font-size:15px;line-height:1.8;margin-top:12px}.lj-enhanced .lj-step{padding-bottom:24px}.lj-step-number{margin-bottom:5px}.lj-icon{top:24px;width:27px;height:27px}}
@media(max-width:1100px){.lj-layout{gap:7%;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}.lj-timeline{padding-left:65px}.lj-dot{left:-64px}.lj-icon{left:-42px;width:25px;height:25px}.lj-step-title{font-size:24px}.lj-intro-bottom>p{font-size:16px}}
@media(max-width:900px){.lj-pin::before{inset:0 -6.82%;background-size:64px 64px}.lighting-journey{margin-top:45px}.lj-scroll-region{margin-inline:6%}.lj-pin{padding:44px 0 24px}.lj-layout{display:block}.lighting-journey h2{font-size:clamp(32px,5.8vw,43px);line-height:1.4}.lj-label.section-tag{margin-bottom:20px}.lj-intro-bottom{margin-top:25px;max-width:600px}.lj-intro-bottom>p{font-size:16px;line-height:1.85}.lj-timeline{margin-top:42px;padding-left:46px}.lj-dot{left:-45px;top:10px;width:10px;height:10px}.lj-rail{top:15px;left:5px;bottom:35px;width:1px}.lj-icon{display:none}.lj-step{padding-bottom:32px}.lj-step-number{font-size:12px;margin-bottom:6px}.lj-step-title{font-size:24px;line-height:1.45}.lj-step-body p{font-size:15px;line-height:1.8;margin-top:12px;max-width:600px}}
@media(max-width:420px){.lighting-journey h2{font-size:34px}.lj-intro-bottom>p{font-size:15px}.lj-intro-bottom>p>br{display:none}.lj-step-title{font-size:23px}.lj-step-body p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.lighting-journey *,.lighting-journey *:before,.lighting-journey *:after{transition:none!important;animation:none!important}.lj-rail-fill{display:none}}