.xhex_box{--hex-on:0;--hex-bg-alpha:calc(0.12 + (0.32 * var(--hex-on)));--hex-border-alpha:calc(0.22 + (0.78 * var(--hex-on)));--hex-glow-alpha:calc(0.00 + (0.55 * var(--hex-on)));background-color:rgb(from var(--clr) r g b / var(--hex-border-alpha));transition:background-color 1200ms ease,filter 1200ms ease,box-shadow 1200ms ease;transition-delay:calc(var(--i, 0) * 45ms);filter:saturate(calc(0.55 + (0.65 * var(--hex-on)))) brightness(calc(0.72 + (0.42 * var(--hex-on))));box-shadow:0 0 calc(4px + (20px * var(--hex-on))) rgb(from var(--clr) r g b / var(--hex-glow-alpha))}.xhex_box.scrollFlowInside{--hex-on:1}.xhex_box .xhex{transition:background-color 1200ms ease,box-shadow 1200ms ease}.xhex_box .xhex::before{opacity:calc(0.28 + (0.72 * var(--hex-on)));filter:drop-shadow(0 0 calc(2px + (10px * var(--hex-on))) rgb(from var(--clr) r g b / .55));transition:opacity 1200ms ease,transform 1200ms cubic-bezier(.22,1,.36,1),filter 1200ms ease}.xhex_box .xhex::after{opacity:calc(0.18 + (0.35 * var(--hex-on)));transition:opacity 1200ms ease}flynt-component[name="X_TN_Hexagon_Grid"]{width:100%}flynt-component[name="X_TN_Hexagon_Grid"].xhexgrid{position:relative}.xhexgrid_container{position:relative;width:100%}.xhexgrid_stage{width:100%;display:flex;justify-content:flex-end;position:absolute;pointer-events:none}.xhexgrid_wrap{position:relative;--maxCols:8;width:calc((100% / var(--maxCols)) * var(--cols));--slotW:calc(100% / var(--cols));--hexRatio:calc(130 / 200);--gap0:15px;--gap:clamp(8px, calc(var(--slotW) * 0.08), 18px);--slotH:calc(var(--slotW) * var(--hexRatio));--rowStepMul:0.75;--stepY:calc((var(--slotH) * var(--rowStepMul)));--rowOffsetX:calc(var(--slotW) / 2);aspect-ratio:calc(130 * var(--cols)) / calc(150 * var(--rows));pointer-events:none;transform:translateY(-20cqw)}.xhex_wrap{position:absolute;--r0:calc(var(--r) - 1);--c0:calc(var(--c) - 1);--is-even:calc(var(--r) - 2 * floor(var(--r) / 2));transform:translateX(calc((var(--is-even) * 50% - 25%)));width:var(--slotW);left:calc((var(--c0) * var(--slotW)) + (var(--shift) * var(--rowOffsetX)));top:calc(var(--r0) * var(--stepY));padding:calc((var(--gap) + 4px));box-sizing:border-box;aspect-ratio:130 / 150;filter:drop-shadow(1px 1px 1px #000000);pointer-events:all}.xhex{width:100%;height:100%;background:#181b24;background:rgb(from #181b24 r g b / .9);clip-path:polygon(50% 0%,100% 22%,100% 78%,50% 100%,0% 78%,0% 22%);display:flex;align-items:center;justify-content:center;clip-path:polygon(50% 0%,100% 22%,100% 78%,50% 100%,0% 78%,0% 22%);display:flex;align-items:center;justify-content:center;z-index:1;position:relative}.xhex_box{width:100%;height:100%;padding:1px;background-color:var(--clr);clip-path:polygon(50% 0%,100% 22%,100% 78%,50% 100%,0% 78%,0% 22%);background-color:rgb(from var(--clr) r g b / .4)}.xhex:after{content:"";position:absolute;inset:0;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");mix-blend-mode:overlay;pointer-events:none;mask-border-mode:luminance;mask-mode:luminance;background-color:#ffffff40}.xhex_icon{width:70%;height:70%;object-fit:contain;opacity:.9;filter:grayscale(1) brightness(1.25)}.xhex:before{content:"";position:absolute;inset:18%;background:var(--clr);-webkit-mask-image:var(--icon);mask-image:var(--icon);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;opacity:.9}