.nt-shadow{display:none}@supports (mask-mode:luminance) and (mask-composite:intersect) and selector(:has(*)){[data-tone]:has(>.nt-shadow){position:relative}[data-tone]:has(>.nt-behind){isolation:isolate}.nt-shadow{--nt-px:0px;--nt-py:0px;pointer-events:none;opacity:var(--nt-o,.12);mix-blend-mode:multiply;contain:paint;display:block;position:absolute;inset:0;overflow:clip}.nt-behind{z-index:-1}.nt-stage{--nt-edge:min(8rem, 20%);-webkit-mask-image:linear-gradient(to bottom, transparent, #000 var(--nt-edge), #000 calc(100% - var(--nt-edge)), transparent);mask-image:linear-gradient(to bottom, transparent, #000 var(--nt-edge), #000 calc(100% - var(--nt-edge)), transparent);position:absolute;inset:0;overflow:clip}@media (min-width:64rem){.js-motion .nt-pinned>.nt-stage{width:100%;height:100svh;position:sticky;inset:0 auto auto}}.nt-layer{top:calc(var(--y) - var(--s) * var(--cy));left:calc(var(--x) - var(--s) * var(--cx));width:var(--s);height:var(--s);translate:calc(var(--nt-px) * var(--g,1)) calc(var(--nt-py) * var(--g,1));position:absolute}.nt-shadow[data-on="1"] .nt-layer{transition:translate 1.8s cubic-bezier(.25,1,.5,1)}.nt-far{--g:.6}.nt-leaf{background:var(--color-pine,#24301f);opacity:var(--a,1);transform:var(--t,none);transform-origin:calc(var(--cx) * 100%) calc(var(--cy) * 100%);-webkit-mask-image:var(--img), radial-gradient(ellipse var(--vr) at var(--vc), #fff 0, #fff 56%, #000 100%), linear-gradient(to top, #000 0, #fff 16%);mask-image:var(--img), radial-gradient(ellipse var(--vr) at var(--vc), #fff 0, #fff 56%, #000 100%), linear-gradient(to top, #000 0, #fff 16%);position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-source-type:luminance;mask-mode:luminance}.nt-far>.nt-leaf{--a:.66}.nt-m-a{--img:url(/img/w03/grass-soft-a.webp);--cx:.56;--cy:.98;--vc:54% 78%;--vr:50% 74%}.nt-m-b{--img:url(/img/w03/grass-soft-b.webp);--cx:.5;--cy:.98;--vc:46% 76%;--vr:50% 80%}.nt-m-c{--img:url(/img/w03/grass-soft-c.webp);--cx:.5;--cy:.98;--vc:48% 74%;--vr:52% 80%}@keyframes nt-sway-near{0%,to{transform:translate(-5.6px,-2px)}50%{transform:translate(5.6px,2px)}}@keyframes nt-sway-far{0%,to{transform:translate(4.1px,-4.2px)}50%{transform:translate(-4.1px,4.2px)}}.js-motion .nt-layer{animation:7s cubic-bezier(.45,0,.55,1) infinite paused nt-sway-near}.js-motion .nt-far{animation-name:nt-sway-far;animation-duration:8.6s}.js-motion .nt-shadow[data-on="1"] .nt-layer{animation-play-state:running}@media (prefers-reduced-motion:reduce){.nt-layer{transition:none;translate:none;animation:none!important}}.nt-principles{--nt-o:.13}.nt-principles .nt-near{--x:calc(100% + 1rem);--y:96%;--s:clamp(24rem, 54vw, 64rem);--t:rotate(-8deg)}.nt-principles .nt-far{--x:76%;--y:calc(100% + 2rem);--s:clamp(20rem, 38vw, 46rem);--t:rotate(-14deg)}.nt-steps .nt-near{--x:46%;--y:calc(100% + 2rem);--s:clamp(22rem, 44vw, 54rem);--t:rotate(8deg)}.nt-steps .nt-far{--x:calc(100% + 2rem);--y:34%;--s:clamp(20rem, 34vw, 42rem);--t:rotate(-20deg)}.nt-control .nt-near{--x:calc(100% + 1rem);--y:88%;--s:clamp(24rem, 46vw, 56rem);--t:rotate(-38deg)}.nt-control .nt-far{--x:70%;--y:calc(100% + 2rem);--s:clamp(20rem, 38vw, 46rem);--t:none}.nt-why .nt-near{--x:calc(100% + 3rem);--y:42%;--s:clamp(24rem, 52vw, 62rem);--t:rotate(-84deg) scale(-1, 1)}.nt-why .nt-far{--x:90%;--y:calc(100% + 3rem);--s:clamp(20rem, 40vw, 48rem);--t:rotate(-6deg)}.nt-cases{--nt-o:.11}.nt-cases .nt-near{--x:calc(100% + 1rem);--y:34%;--s:clamp(24rem, 46vw, 56rem);--t:rotate(-24deg)}.nt-cases .nt-far{--x:calc(100% + 1rem);--y:78%;--s:clamp(24rem, 50vw, 60rem);--t:rotate(-44deg) scale(-1, 1)}.nt-access .nt-near{--x:calc(100% + 1rem);--y:92%;--s:clamp(24rem, 48vw, 58rem);--t:rotate(-34deg)}.nt-access .nt-far{--x:58%;--y:calc(100% + 2rem);--s:clamp(20rem, 38vw, 46rem);--t:rotate(14deg)}}
.nf{--nf-h:20vh;--nf-ink:var(--color-night);--nf-to:var(--color-chalk);--nf-bank:color-mix(in srgb, var(--nf-ink) 72%, transparent);--nf-bank-soft:color-mix(in srgb, var(--nf-ink) 30%, transparent);z-index:1;height:var(--nf-h);background:var(--nf-to);pointer-events:none;position:relative}.nf[data-from=sand]{--nf-ink:var(--color-sand)}.nf[data-from=chalk]{--nf-ink:var(--color-chalk)}.nf[data-to=sand]{--nf-to:var(--color-sand)}.nf[data-to=night]{--nf-to:var(--color-night)}html.tones-live .nf[data-nf-live]{background:0 0}.nf-rise{background:var(--nf-ink);height:min(5vh,2.5rem);position:absolute;inset:auto 0 100%;-webkit-mask-image:linear-gradient(#0000 0%,#00000047 38%,#000000bd 72%,#000 100%);mask-image:linear-gradient(#0000 0%,#00000047 38%,#000000bd 72%,#000 100%)}.nf-base,.nf-veil{position:absolute;inset:0}.nf-base{--nf-ramp:linear-gradient(to bottom, #000 0%, #000000fc 8.1%, #000000f3 15.5%, #000000e4 22.5%, #000000d2 29%, #000000bd 35.3%, #000000a5 41.2%, #0000008c 47.1%, #00000073 52.9%, #0000005a 58.8%, #00000042 64.7%, #0000002d 71%, #0000001b 77.5%, #0000000c 84.5%, #00000003 91.9%, transparent 100%);background:var(--nf-ink);-webkit-mask-image:var(--nf-ramp);-webkit-mask-image:var(--nf-ramp);mask-image:var(--nf-ramp)}.nf-veil{--nf-hold:linear-gradient(to bottom, #000 0%, #000 20%, #000000a8 48%, #00000042 76%, #0000000f 92%, transparent 100%);-webkit-mask-image:var(--nf-hold);-webkit-mask-image:var(--nf-hold);mask-image:var(--nf-hold);overflow:clip}.nf-drift{will-change:transform;background:radial-gradient(ellipse 30% 7% at 14% 8%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 38% 6% at 72% 19%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 26% 8% at 40% 31%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 34% 6% at 90% 42%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 36% 7% at 10% 53%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 28% 6% at 58% 64%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 40% 7% at 26% 76%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%), radial-gradient(ellipse 30% 6% at 82% 88%, var(--nf-bank) 0%, var(--nf-bank-soft) 46%, transparent 100%);width:110%;height:400%;position:absolute;top:-150%;left:-5%}.nf:after{--nf-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");--nf-mid:linear-gradient(to bottom, transparent 0%, #000 44%, #000 76%, transparent 100%);content:"";opacity:.12;background:var(--nf-ink);-webkit-mask-image:var(--nf-noise), var(--nf-mid);-webkit-mask-image:var(--nf-noise), var(--nf-mid);mask-image:var(--nf-noise), var(--nf-mid);-webkit-mask-composite:source-in;position:absolute;inset:0;-webkit-mask-size:220px 220px,100% 100%;mask-size:220px 220px,100% 100%;-webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;-webkit-mask-composite:source-in;mask-composite:intersect}