/* Copyright (c) 2025 by Yudiz Solutions Limited (https://codepen.io/yudizsolutions/pen/vENNWxx) */
@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400..900&display=swap');
 
*                                       {margin: 0;padding: 0;box-sizing: border-box;}
img                                     {width: 100%;height: auto;}
button,a                                {border: 1px solid transparent;background: transparent;display: flex;align-items: center;justify-content: center;text-decoration: none;color: #EBEBEB;}
body                                    {font-family: "Golos Text";}
/*  */
.webgl                                  {position: fixed;left: 0;top: 0;width: 100vw;height: 100dvh;z-index: -1;}
.header                                 {display: flex;align-items: center;justify-content: space-between;padding: 34px 40px;}
.logo                                   {max-width: 270px;display: flex;align-self: center;justify-content: center;}
.nav-link-container                     {display: flex;align-items: center;gap: 40px;}
.nav-link-container                     {background: #0F0F0F;padding-left: 30px;}
.nav-link-container button img          {width: 20px;aspect-ratio: 1;}
.nav-link-container a                   {font-size: 14px;text-transform: uppercase;transition: all ease-in-out 0.15s;}
.nav-link-container a:hover             {color: #D6F844;}
.toggle-btn                             {background: #515151;padding: 16px;}
.banner-section                         {max-width: 1122px;margin: 0 auto;text-align: center;}
h1                                      {font-size: 100px;line-height: 140px;color: white;font-weight: 900;text-transform: uppercase;}
p                                       {color: #949494;}
/*  */
.title-section                          {position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;min-height: 25vh;padding: 80px 40px 40px;z-index: 1;background: transparent;gap: 20px;}
.site-title                             {font-size: 32px;line-height: 1.4;font-weight: 400;text-transform: none;letter-spacing: 2px;text-align: center;position: relative;font-family: "Courier New", monospace;white-space: pre;word-break: keep-all;font-variant-numeric: tabular-nums;color: #EBEBEB;}
.ca-field                               {display: flex;align-items: center;gap: 10px;font-family: "Courier New", monospace;font-size: 18px;color: #EBEBEB;letter-spacing: 1px;margin-top: 10px;}
.ca-label                               {color: #9D4EDD;font-weight: 500;text-shadow: 0 0 8px rgba(157, 78, 221, 0.5);}
.ca-value                               {color: #C0C0C0;min-width: 200px;text-align: left;cursor: pointer;transition: all 0.3s ease;user-select: none;}
.ca-value:hover                         {color: #9D4EDD;text-shadow: 0 0 8px rgba(157, 78, 221, 0.5);}
.ca-value.copied                        {color: #4CAF50;text-shadow: 0 0 8px rgba(76, 175, 80, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
.site-title                             {color: #EBEBEB;}
.site-title                             {color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 221, 0.5);}
.site-title                             {font-size: 24px;line-height: 1.4;font-weight: 400;text-transform: none;letter-spacing: 2px;text-align: center;position: relative;font-family: "Courier New", monospace;white-space: pre;word-break: keep-all;font-variant-numeric: tabular-nums;color: #EBEBEB;text-shadow: 0 0 10px rgba(157, 78, 221, 0.5);}
/*  */
.banner-section a                       {display: flex;align-items: center;gap: 4px;color: #D6F844;position: relative;max-width: fit-content;margin: 30px auto 0;font-weight: 500;text-transform: uppercase;}
.banner-section a img                   {width: 18px;aspect-ratio: 1;transition: all ease-in-out 0.15s;transform-origin: center;}
.banner-section a::after                {content: '';position: absolute;right: 0;top: calc(100% + 2px);width: 0%;height: 1px;background: #D6F844;transition: all ease-in-out 0.15s;}
.banner-section a:hover:after           {width: 100%;left: 0;right: unset;}
.banner-section a:hover img             {transform: rotate(45deg);}
/*  */
.images-container                       {display: flex;justify-content: space-between;flex-wrap: wrap;padding: 100px 40px;position: relative;}
.images-container .img                  {width: 100%;display: flex;position: relative;}
.images-container .img:nth-child(even)  {justify-content: end;}
.images-container .img:not(:last-child)::after {content: '';position: absolute;bottom: -60px;width: 2px;height: 50px;background: linear-gradient(to bottom, rgba(157, 78, 221, 0.8) 0%, transparent 100%);z-index: 0;pointer-events: none;}
.images-container .img:nth-child(odd):not(:last-child)::after {left: 0;}
.images-container .img:nth-child(even):not(:last-child)::after {right: 0;}
.images-container .img:nth-child(1)::after,
.images-container .img:nth-child(2)::after,
.images-container .img:nth-child(3)::after {display: none;}
.images-container .img:nth-child(1),
.images-container .img:nth-child(2),
.images-container .img:nth-child(3) {margin-bottom: 10px;}
.images-container .img:nth-child(3) {margin-bottom: 60px;}
.hex-connection                         {position: absolute;bottom: -45px;font-family: "Courier New", monospace;font-size: 14px;color: #9D4EDD;letter-spacing: 3px;white-space: nowrap;z-index: 1;pointer-events: none;transition: opacity 0.3s ease;font-weight: 500;text-shadow: 0 0 8px rgba(157, 78, 221, 0.6);}
.images-container .img:nth-child(odd) .hex-connection {left: 0;}
.images-container .img:nth-child(even) .hex-connection {right: 0;}
@keyframes shake                         {0%, 100% {transform: translateX(0);}10%, 30%, 50%, 70%, 90% {transform: translateX(-2px);}20%, 40%, 60%, 80% {transform: translateX(2px);}}
.hex-connection.shaking                  {animation: shake 0.3s ease-in-out;}
.images-container .img:last-child .hex-connection {display: none;}
.images-container img                   {aspect-ratio: 16 / 9;object-fit: cover;transition: all ease 1s;}
.img-main                               {max-width: 35vw;width: 100%;border: 1px solid transparent;overflow: hidden;position: relative;opacity: 0;transition: all ease-in-out 0.15s;padding: 50px;background: rgba(15, 15, 15, 0.8);min-height: 280px;display: flex;align-items: center;justify-content: center;}
.img-main:hover:after                   {content: '';position: absolute;top: -100%;left: -100%;height: 200%;width: 200%;background: linear-gradient(to bottom right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 100%);animation: slide 1s forwards;filter: blur(33px);}
/*  */
@keyframes slide                        {
    from                                { top: -100%; left: -100%; }
    to                                  { top: 100%; left: 100%; }
}
.text-block                             {width: 100%;}
.text-block h3                          {color: #EBEBEB;font-size: 24px;font-weight: 600;margin: 0 0 15px 0;text-transform: uppercase;letter-spacing: 1px;}
.text-block p                           {color: #EBEBEB;font-size: 16px;line-height: 1.6;text-align: left;margin: 0 0 15px 0;}
.text-block ul                          {color: #EBEBEB;font-size: 14px;line-height: 1.8;margin: 15px 0 0 0;padding-left: 20px;}
.text-block li                          {margin: 8px 0;color: #C0C0C0;}
.img-main                               {min-height: 250px;}
.img-main:hover                         {border-color: #9D4EDD;transform: scale(1.02);}
.zoom-img img                           {aspect-ratio: 16 / 9;object-fit: cover;transition: all ease 0.2s;object-position: top;}
.images-container img:hover             {transform: scale(1.1) ;opacity: 1;}
section{min-height: 100vh;}
/*  */
.stats-section                         {padding: 40px;background: rgba(15, 15, 15, 0.3);position: relative;min-height: 600px;display: flex;flex-direction: column;}
.stats-header-top                      {display: flex;justify-content: flex-start;align-items: center;margin-bottom: 30px;z-index: 10;position: relative;}
.stat-online-top                       {text-align: left;}
.stat-value                             {font-family: "Courier New", monospace;font-size: 64px;color: #9D4EDD;font-weight: 700;line-height: 1.2;margin-bottom: 10px;text-shadow: 0 0 20px rgba(157, 78, 221, 0.6);}
.stat-value-small                       {font-family: "Courier New", monospace;font-size: 36px;color: #9D4EDD;font-weight: 700;line-height: 1.2;margin-bottom: 8px;text-shadow: 0 0 15px rgba(157, 78, 221, 0.5);}
.stat-label                             {font-size: 16px;color: #C0C0C0;text-transform: uppercase;letter-spacing: 2px;font-weight: 300;}
.stat-label-small                       {font-size: 12px;color: #C0C0C0;text-transform: uppercase;letter-spacing: 1.5px;font-weight: 300;}
.stat-chart                             {width: 100%;height: 150px;background: transparent;border: none;border-radius: 4px;margin-top: 20px;display: block;}
.stat-chart-large                       {width: 100%;height: 500px;background: transparent;border: none;border-radius: 4px;margin-top: 30px;display: block;}
.stat-chart-full                        {width: 100%;height: 100%;min-height: 600px;background: transparent;border: none;display: block;position: relative;z-index: 1;}
.flashes-container                       {width: 100%;padding: 30px 0;display: flex;justify-content: center;align-items: center;gap: 20px;position: relative;z-index: 1;flex-wrap: wrap;}
.flashes-wrapper                         {position: relative;display: flex;flex-direction: column;align-items: center;}
.flashes-label                           {font-family: "Courier New", monospace;font-size: 14px;color: rgba(255, 255, 255, 0.6);text-transform: uppercase;letter-spacing: 2px;margin-bottom: 10px;font-weight: 300;}
.flashes-canvas                          {width: 100%;max-width: 600px;height: 400px;background: rgba(0, 0, 0, 0.2);border: none;border-radius: 4px;display: block;}
.nodes-canvas                            {width: 100%;max-width: 600px;height: 400px;background: rgba(0, 0, 0, 0.2);border: none;border-radius: 4px;display: block;}
/*  */
.early-access-section                    {padding: 100px 40px;background: rgba(15, 15, 15, 0.3);text-align: center;}
.early-access-container                  {max-width: 600px;margin: 0 auto;}
.early-access-title                      {font-size: 48px;color: #EBEBEB;margin-bottom: 20px;font-weight: 300;letter-spacing: 2px;text-transform: uppercase;}
.early-access-description                {font-size: 18px;color: #C0C0C0;margin-bottom: 40px;letter-spacing: 1px;}
.early-access-form                       {display: flex;gap: 15px;justify-content: center;flex-wrap: wrap;margin-bottom: 20px;}
.early-access-input                      {flex: 1;min-width: 250px;padding: 15px 20px;background: rgba(0, 0, 0, 0.4);border: 1px solid rgba(157, 78, 221, 0.3);border-radius: 4px;color: #EBEBEB;font-family: "Courier New", monospace;font-size: 14px;outline: none;transition: all 0.3s ease;position: relative;}
.early-access-input:hover                {border-color: rgba(157, 78, 221, 0.6);background: rgba(0, 0, 0, 0.5);transform: translateY(-2px);box-shadow: 0 4px 12px rgba(157, 78, 221, 0.2);}
.early-access-input:focus                {border-color: rgba(157, 78, 221, 0.8);background: rgba(0, 0, 0, 0.6);transform: translateY(-2px);box-shadow: 0 4px 16px rgba(157, 78, 221, 0.3);}
.early-access-input::placeholder         {color: rgba(255, 255, 255, 0.4);transition: opacity 0.3s;}
.early-access-input:hover::placeholder   {opacity: 0.7;}
.early-access-input.error                {border-color: rgba(244, 67, 54, 0.6);animation: shake 0.4s ease;}
.early-access-button                     {padding: 15px 40px;background: rgba(157, 78, 221, 0.2);border: 1px solid rgba(157, 78, 221, 0.5);border-radius: 4px;color: #9D4EDD;font-family: "Courier New", monospace;font-size: 14px;text-transform: uppercase;letter-spacing: 2px;cursor: pointer;transition: all 0.3s ease;font-weight: 600;position: relative;overflow: hidden;}
.early-access-button::before             {content: '';position: absolute;top: 50%;left: 50%;width: 0;height: 0;border-radius: 50%;background: rgba(157, 78, 221, 0.3);transform: translate(-50%, -50%);transition: width 0.6s, height 0.6s;}
.early-access-button:hover               {background: rgba(157, 78, 221, 0.3);border-color: rgba(157, 78, 221, 0.8);text-shadow: 0 0 15px rgba(157, 78, 221, 0.6);transform: translateY(-2px);box-shadow: 0 6px 20px rgba(157, 78, 221, 0.4);}
.early-access-button:hover::before       {width: 300px;height: 300px;}
.early-access-button:active              {transform: translateY(0) scale(0.98);}
.early-access-message                    {min-height: 24px;margin-top: 15px;font-family: "Courier New", monospace;font-size: 14px;letter-spacing: 1px;opacity: 0;transform: translateY(-10px);transition: all 0.4s ease;}
.early-access-message.show               {opacity: 1;transform: translateY(0);}
.early-access-message.success            {color: #4CAF50;text-shadow: 0 0 10px rgba(76, 175, 80, 0.5);}
.early-access-message.error              {color: #F44336;text-shadow: 0 0 10px rgba(244, 67, 54, 0.5);}
.early-access-benefits                   {margin-top: 50px;padding-top: 40px;border-top: 1px solid rgba(157, 78, 221, 0.2);}
.early-access-benefits-text              {font-size: 16px;color: #C0C0C0;margin-bottom: 20px;letter-spacing: 1px;}
.early-access-benefits-list              {list-style: none;padding: 0;margin: 0;text-align: left;max-width: 500px;margin: 0 auto;}
.early-access-benefits-list li           {font-size: 14px;color: rgba(255, 255, 255, 0.7);padding: 10px 0;padding-left: 25px;position: relative;letter-spacing: 0.5px;font-family: "Courier New", monospace;}
.early-access-benefits-list li::before   {content: '▸';position: absolute;left: 0;color: #9D4EDD;font-size: 16px;}
.early-access-copyright                  {margin-top: 50px;padding-top: 30px;border-top: 1px solid rgba(255, 255, 255, 0.1);}
.early-access-copyright p                {font-size: 12px;color: rgba(255, 255, 255, 0.4);letter-spacing: 1px;font-family: "Courier New", monospace;text-transform: uppercase;}
@keyframes shake                          {0%, 100% {transform: translateX(0);}10%, 30%, 50%, 70%, 90% {transform: translateX(-5px);}20%, 40%, 60%, 80% {transform: translateX(5px);}}
/*  */
.roadmap-section                        {padding: 100px 40px;position: relative;}
.roadmap-title                          {font-size: 60px;color: #EBEBEB;text-align: center;margin-bottom: 80px;font-weight: 300;letter-spacing: 4px;text-transform: uppercase;}
.roadmap-container                      {max-width: 1200px;margin: 0 auto;position: relative;}
.roadmap-item                           {position: relative;padding: 30px 0;display: flex;gap: 40px;align-items: flex-start;}
.roadmap-item.completed                 {opacity: 0.7;}
.roadmap-item.completed .roadmap-date   {color: #6B46C1;}
.roadmap-item.completed .roadmap-content h4 {color: #9D4EDD;text-decoration: line-through;}
.roadmap-item::before                   {content: '';position: absolute;left: 120px;top: 50px;bottom: -30px;width: 2px;background: #9D4EDD;z-index: 0;}
.roadmap-item:last-child::before        {display: none;}
.roadmap-item::after                    {content: '';position: absolute;left: 115px;top: 50px;width: 12px;height: 12px;background: #9D4EDD;border-radius: 50%;z-index: 2;box-shadow: 0 0 10px rgba(157, 78, 221, 0.8);}
.roadmap-item.completed::after          {background: #6B46C1;box-shadow: 0 0 10px rgba(107, 70, 193, 0.6);}
.roadmap-date                           {font-family: "Courier New", monospace;font-size: 14px;color: #9D4EDD;min-width: 120px;width: 120px;font-weight: 500;letter-spacing: 2px;position: relative;z-index: 1;padding-top: 5px;cursor: default;text-align: left;display: inline-block;white-space: nowrap;}
.roadmap-date.shaking                   {animation: shake 0.3s ease-in-out;}
.roadmap-content                        {flex: 1;position: relative;z-index: 1;}
.roadmap-content h4                     {color: #EBEBEB;font-size: 20px;font-weight: 500;margin: 0 0 10px 0;text-transform: uppercase;letter-spacing: 1px;}
.roadmap-content p                      {color: #C0C0C0;font-size: 15px;line-height: 1.6;margin: 0;}
/*  */
html.lenis, html.lenis body             {height: auto;}
.lenis.lenis-smooth                     {scroll-behavior: auto !important;}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior: contain;}
.lenis.lenis-stopped                    {overflow: hidden;}
.lenis.lenis-scrolling iframe           {pointer-events: none;}
 
 
@keyframes spin                         {
  to                                    { transform: rotate(360deg); }
}
#preloader                              {position: fixed; top: 0;left: 0;width: 100%;height: 100%;z-index: 1001;}
.loder-parent                           {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
#loader                                 {display: block;position: relative;width: 300px;height: 300px;border-radius: 50%;border: 5px solid transparent;border-top-color: #D6F844;-webkit-animation: spin 2s linear infinite;animation: spin 2s linear infinite;}
#loader:before                          {content: "";position: absolute;top: 5px;left: 5px;right: 5px;bottom: 5px;border-radius: 50%;border: 4px solid transparent;border-top-color: #D6F844;-webkit-animation: spin 3s linear infinite;animation: spin 3s linear infinite;}
#loader:after                           {content: "";position: absolute;top: 15px;left: 15px;right: 15px;bottom: 15px;border-radius: 50%;border: 3px solid transparent;border-top-color: #D6F844;-webkit-animation: spin 1.5s linear infinite;animation: spin 1.5s linear infinite;}
@-webkit-keyframes spin                 {
    0%                                  {-webkit-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
    100%                                {-webkit-transform: rotate(360deg);-ms-transform: rotate(360deg);transform: rotate(360deg);}
}
/* Movie poster with glare effect */
.loader-text                            {position: absolute;left: 50%;transform: translate(-50%, -50%);top: 50%;font-size: 2rem;line-height: 1;font-weight: 700;color: #D6F844;}
.loader-info-text{
    position: absolute;left: 50%;transform: translate(-50%,-50%);top: 70%;font-size: 1rem;line-height: 1;font-weight: 400;color: #D6F844;   }
.dg.ac                                  {display: none !important;}
 
/* ===== MOBILE RESPONSIVE ===== */
 
/* Tablet and smaller screens */
@media screen and (max-width: 1024px)   {
    .header                             {padding: 20px 30px;}
    .nav-link-container                 {gap: 25px;padding-left: 20px;}
    h1                                  {font-size: 80px;line-height: 120px;}
    .site-title                         {font-size: 24px;letter-spacing: 1.5px;}
}
 
/* Mobile landscape and smaller tablets */
@media screen and (max-width: 768px)    {
    .header                             {padding: 15px 20px;flex-direction: column;gap: 20px;}
    .logo                               {max-width: 200px;}
    .nav-link-container                 {gap: 20px;padding-left: 15px;flex-wrap: wrap;justify-content: center;}
    
    .nav-link-container a               {font-size: 12px;}
    h1                                  {font-size: 60px;line-height: 80px;}
    .title-section                      {min-height: 20vh;padding: 60px 20px 30px;}
    .site-title                         {font-size: 18px;letter-spacing: 1px;word-break: break-word;}
    .ca-field                           {font-size: 14px;gap: 8px;margin-top: 8px;}
    .ca-value                           {min-width: 150px;}
    .banner-section                     {padding: 0 20px;}
    .images-container                   {padding: 40px 20px;flex-direction: column;align-items: center;gap: 30px;}
    .img-main                           {max-width: 100%;width: 100%;}
    .text-block                         {padding: 25px 20px;font-size: 14px;line-height: 1.6;}
    .text-block h3                      {font-size: 20px;margin-bottom: 12px;}
    .text-block p                       {font-size: 14px;margin-bottom: 10px;}
    .text-block ul                      {font-size: 13px;padding-left: 20px;}
    .stats-section                      {min-height: 500px;padding: 30px 20px;}
    .stats-header-top                   {justify-content: center;margin-bottom: 20px;}
    .stat-online-top                    {text-align: center;}
    .stat-value                         {font-size: 56px;}
    .stat-value-small                   {font-size: 32px;}
    .stat-label                         {font-size: 15px;}
    .stat-label-small                   {font-size: 11px;}
    .stat-chart-full                    {min-height: 500px;}
    .flashes-container                  {flex-direction: column;gap: 15px;}
    .flashes-canvas                     {max-width: 100%;height: 300px;}
    .nodes-canvas                       {width: 100%;max-width: 600px;height: 300px;}
    .early-access-section               {padding: 60px 20px;}
    .early-access-title                 {font-size: 36px;}
    .early-access-description           {font-size: 16px;margin-bottom: 30px;}
    .early-access-form                  {flex-direction: column;}
    .early-access-input                 {min-width: 100%;}
    .early-access-button                {width: 100%;}
    .early-access-benefits              {margin-top: 40px;padding-top: 30px;}
    .early-access-benefits-text         {font-size: 14px;}
    .early-access-benefits-list li      {font-size: 13px;padding: 8px 0;}
    .early-access-copyright             {margin-top: 40px;padding-top: 20px;}
    .roadmap-section                    {padding: 60px 20px;}
    .roadmap-title                      {font-size: 40px;margin-bottom: 50px;}
    .roadmap-item                       {flex-direction: column;gap: 15px;padding: 25px 0;}
    .roadmap-item::before               {left: 15px;top: 40px;}
    .roadmap-item::after                {left: 10px;top: 40px;}
    .roadmap-date                       {min-width: auto;padding-top: 0;font-size: 12px;}
    .roadmap-content h4                 {font-size: 18px;}
    .roadmap-content p                  {font-size: 14px;line-height: 1.5;}
}
@media screen and (max-width: 575px)    {
    .img-main                           {max-width: 50vw;width: 100%;}
}
/* Mobile portrait */
@media screen and (max-width: 480px)    {
    .header                             {padding: 15px;}
    .logo                               {max-width: 150px;}
    .nav-link-container                 {gap: 10px;padding-left: 10px;padding-right: 0px;}    
    .nav-link-container a               {font-size: 11px;}    
    .toggle-btn                         {padding: 12px;}
    h1                                  {font-size: 40px;line-height: 50px;}
    .title-section                      {min-height: 15vh;padding: 40px 15px 20px;}
    .site-title                         {font-size: 16px;letter-spacing: 0.5px;word-break: break-word;}
    .ca-field                           {font-size: 12px;gap: 6px;margin-top: 6px;}
    .ca-value                           {min-width: 120px;}
    .banner-section                     {padding: 0 15px;}
    .banner-section a                   {margin: 20px auto 0;font-size: 14px;}
    .images-container                   {padding: 40px 15px;gap: 20px;}
    .text-block                         {padding: 20px 15px;font-size: 13px;line-height: 1.5;}
    .text-block h3                      {font-size: 18px;margin-bottom: 10px;}
    .text-block p                       {font-size: 13px;margin-bottom: 8px;}
    .text-block ul                      {font-size: 12px;padding-left: 18px;}
    .text-block li                      {margin-bottom: 5px;}
    .stats-section                      {min-height: 400px;padding: 20px 15px;}
    .stats-section                      {min-height: 400px;padding: 20px 15px;}
    .stats-header-top                   {justify-content: center;margin-bottom: 15px;}
    .stat-online-top                    {text-align: center;}
    .stat-value                         {font-size: 42px;}
    .stat-value-small                   {font-size: 24px;}
    .stat-label                         {font-size: 13px;}
    .stat-label-small                   {font-size: 10px;}
    .stat-chart-full                    {min-height: 400px;}
    .flashes-container                  {flex-direction: column;gap: 10px;}
    .flashes-canvas                     {max-width: 100%;height: 250px;}
    .nodes-canvas                       {width: 100%;max-width: 600px;height: 250px;}
    .early-access-section               {padding: 40px 15px;}
    .early-access-title                 {font-size: 28px;}
    .early-access-description           {font-size: 14px;margin-bottom: 30px;}
    .early-access-form                  {flex-direction: column;}
    .early-access-input                 {min-width: 100%;padding: 12px 15px;}
    .early-access-button                {width: 100%;padding: 12px 30px;}
    .early-access-benefits              {margin-top: 30px;padding-top: 25px;}
    .early-access-benefits-text         {font-size: 13px;margin-bottom: 15px;}
    .early-access-benefits-list         {max-width: 100%;}
    .early-access-benefits-list li      {font-size: 12px;padding: 6px 0;}
    .early-access-copyright             {margin-top: 30px;padding-top: 20px;}
    .early-access-copyright p           {font-size: 11px;}
    .roadmap-section                    {padding: 40px 15px;}
    .roadmap-title                      {font-size: 32px;margin-bottom: 40px;letter-spacing: 2px;}
    .roadmap-item                       {padding: 20px 0;}
    .roadmap-content h4                 {font-size: 16px;}
    .roadmap-content p                  {font-size: 13px;line-height: 1.4;}
    .roadmap-date                       {font-size: 11px;min-width: 100px;}
    /* Loader adjustments for mobile */
    #loader                             {width: 200px;height: 200px;}    
    .loader-text                        {font-size: 1.5rem;}
}
 
/* Very small screens */
@media screen and (max-width: 360px)    {
    .header                             {padding: 10px;}
    .nav-link-container                 {gap: 10px;padding-left: 8px;padding-right: 8px;}
    .nav-link-container a               {font-size: 10px;}
    h1                                  {font-size: 32px;line-height: 40px;}
    .title-section                      {min-height: 12vh;padding: 30px 10px 15px;}
    .site-title                         {font-size: 14px;letter-spacing: 0.5px;word-break: break-word;}
    .ca-field                           {font-size: 11px;gap: 5px;margin-top: 5px;}
    .ca-value                           {min-width: 100px;}
    .banner-section                     {padding: 0 10px;}
    .images-container                   {padding: 30px 10px;gap: 15px;}
    .text-block                         {padding: 15px 12px;font-size: 12px;line-height: 1.4;}
    .text-block h3                      {font-size: 16px;margin-bottom: 8px;}
    .text-block p                       {font-size: 12px;margin-bottom: 6px;}
    .text-block ul                      {font-size: 11px;padding-left: 15px;}
    .stat-value                         {font-size: 36px;}
    .stat-value-small                   {font-size: 20px;}
    .stat-label                         {font-size: 11px;}
    .stat-label-small                   {font-size: 9px;}
    .stat-chart-full                    {min-height: 300px;}
    .flashes-canvas                     {height: 200px;}
    .nodes-canvas                       {height: 200px;}
    .early-access-title                 {font-size: 24px;}
    .early-access-description           {font-size: 12px;}
    .roadmap-title                      {font-size: 28px;}
    .roadmap-content h4                 {font-size: 14px;}
    .roadmap-content p                  {font-size: 12px;}    
    #loader                             {width: 150px;height: 150px;}
    .loader-text                        {font-size: 1.2rem;}
}
 
/* Landscape orientation specific */
@media screen and (max-height: 500px) and (orientation: landscape) {
    .header                             {padding: 10px 20px;}
    h1                                  {font-size: 50px;line-height: 60px;}
    .banner-section                     {margin-top: 20px;}
}