html {
  font: 5vmin/1.3 Serif;
  overflow: hidden;
  background: #123;
}

body, head {
  display: block;
  font-size: 52px;
  color: transparent;
}

head::before, head::after,
body::before, body::after {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 3em;
  height: 3em;
  content: ".";
  mix-blend-mode: screen;
  animation: 44s -27s move infinite ease-in-out alternate;
}

body::before {
  text-shadow: 0.9761025168em 0.9016807478em 7px rgba(255, 151, 0, 0.9), -0.4565509226em 0.5791132244em 7px rgba(193, 0, 255, 0.9), 2.1901992979em 0.4645776114em 7px rgba(0, 7, 255, 0.9), 0.1846241076em -0.0169671557em 7px rgba(255, 0, 29, 0.9), 1.8753636228em 2.2053721575em 7px rgba(244, 255, 0, 0.9), 2.0913483232em 0.587788705em 7px rgba(133, 255, 0, 0.9), 1.3337537046em 2.4419388814em 7px rgba(255, 0, 217, 0.9), 0.0112723266em 0.7762710856em 7px rgba(158, 0, 255, 0.9), 0.2231845045em 1.1148366127em 7px rgba(255, 143, 0, 0.9), 0.6406755439em 0.0956597092em 7px rgba(72, 255, 0, 0.9), 0.9542236434em -0.1381856786em 7px rgba(255, 0, 122, 0.9), -0.3514446105em 0.1122259466em 7px rgba(255, 176, 0, 0.9), 2.0825731604em 2.2613285184em 7px rgba(141, 255, 0, 0.9), 1.2106725982em 0.9429489999em 7px rgba(137, 0, 255, 0.9), 0.7015072799em 0.2043958685em 7px rgba(0, 255, 33, 0.9), 0.3873888889em 1.1895990985em 7px rgba(255, 18, 0, 0.9), 1.6049672822em 2.2149127748em 7px rgba(201, 255, 0, 0.9), 2.3668505409em -0.4768683515em 7px rgba(251, 255, 0, 0.9), 0.9493414104em 0.1797269884em 7px rgba(255, 168, 0, 0.9), 1.4690852958em 0.2300352598em 7px rgba(0, 179, 255, 0.9), 0.6151526912em 0.0780882427em 7px rgba(255, 229, 0, 0.9), 1.1342919866em 0.8412292739em 7px rgba(255, 0, 95, 0.9), 0.6608396341em 1.7394332309em 7px rgba(130, 0, 255, 0.9), 1.0213289242em 1.0860237278em 7px rgba(255, 0, 172, 0.9), -0.0295761949em 1.0215214344em 7px rgba(104, 255, 0, 0.9), 0.0554361083em 0.8259414849em 7px rgba(15, 255, 0, 0.9), 1.3532450466em -0.2950900082em 7px rgba(255, 57, 0, 0.9), 0.5387599174em 0.1247388336em 7px rgba(255, 0, 169, 0.9), -0.4561763407em 0.1197772612em 7px rgba(255, 36, 0, 0.9), 0.4977217107em 0.4237210445em 7px rgba(0, 62, 255, 0.9), 1.789948527em 1.6252114187em 7px rgba(255, 0, 39, 0.9), 2.2151271115em 0.9424302799em 7px rgba(67, 0, 255, 0.9), 0.8836964567em 1.7114672058em 7px rgba(0, 255, 85, 0.9), 1.5214770259em 2.4344272169em 7px rgba(23, 0, 255, 0.9), 0.9089494368em 0.776740335em 7px rgba(255, 0, 139, 0.9), -0.3730605036em 0.8179554601em 7px rgba(242, 255, 0, 0.9), -0.2304729377em 2.4178141694em 7px rgba(255, 202, 0, 0.9), 0.1705321819em 2.4823910834em 7px rgba(95, 0, 255, 0.9), 1.9404588631em -0.4692349168em 7px rgba(0, 110, 255, 0.9), 1.3553286856em 0.5327746992em 7px rgba(110, 0, 255, 0.9), 1.5324021395em 0.0067169304em 7px rgba(0, 138, 255, 0.9);
  animation-duration: 44s;
  animation-delay: -27s;
}

body::after {
  text-shadow: 1.2638531196em 2.3341966899em 7px rgba(250, 0, 255, 0.9), 0.0126910418em 0.4242465598em 7px rgba(228, 0, 255, 0.9), 1.7806513411em 0.6187015659em 7px rgba(33, 0, 255, 0.9), 1.5915091148em 2.4776257225em 7px rgba(165, 0, 255, 0.9), 0.5085611692em -0.3915655859em 7px rgba(255, 75, 0, 0.9), 1.9270017596em -0.1802346061em 7px rgba(0, 255, 111, 0.9), 0.4505338115em 1.7628238088em 7px rgba(255, 4, 0, 0.9), 0.6932442101em 1.3041202973em 7px rgba(243, 0, 255, 0.9), -0.0003826466em 1.0941017071em 7px rgba(255, 145, 0, 0.9), 1.9691267455em -0.3287278059em 7px rgba(255, 0, 176, 0.9), 1.1187561985em -0.4516567859em 7px rgba(255, 73, 0, 0.9), 2.0483803098em 1.336633428em 7px rgba(255, 8, 0, 0.9), 1.840402014em -0.0356299113em 7px rgba(0, 55, 255, 0.9), 2.0027235719em 2.3261351071em 7px rgba(42, 255, 0, 0.9), 2.4013720578em 0.7238157341em 7px rgba(255, 244, 0, 0.9), 0.8820619136em 0.8919510264em 7px rgba(255, 0, 81, 0.9), 2.0668019201em 1.1925488911em 7px rgba(0, 255, 165, 0.9), 1.9681595072em 0.8751888897em 7px rgba(0, 206, 255, 0.9), 0.034136468em 1.6803116049em 7px rgba(255, 0, 45, 0.9), 2.4924357205em 2.1191101717em 7px rgba(0, 255, 76, 0.9), 0.933189667em 0.8252660334em 7px rgba(165, 255, 0, 0.9), 0.8576863636em 1.4136244935em 7px rgba(32, 0, 255, 0.9), 1.7224696934em 0.201279001em 7px rgba(181, 0, 255, 0.9), 0.126143375em 2.116703082em 7px rgba(31, 0, 255, 0.9), 1.227144798em 1.6809987518em 7px rgba(0, 139, 255, 0.9), -0.1670240614em 0.3634527119em 7px rgba(28, 255, 0, 0.9), 1.1946352257em 0.9243494482em 7px rgba(87, 255, 0, 0.9), 0.7882035934em 2.4937124834em 7px rgba(0, 255, 250, 0.9), -0.3888723125em 2.0972626227em 7px rgba(255, 0, 30, 0.9), 1.5647972553em 0.7428008776em 7px rgba(255, 218, 0, 0.9), 0.8872401865em 1.7523099396em 7px rgba(255, 0, 52, 0.9), -0.48246543em 1.6887563349em 7px rgba(255, 2, 0, 0.9), -0.3084127899em 1.1347039723em 7px rgba(146, 255, 0, 0.9), 2.3279177939em -0.3323773984em 7px rgba(173, 0, 255, 0.9), 1.2525665859em 1.8896345856em 7px rgba(224, 255, 0, 0.9), 2.4347300954em 1.5353869687em 7px rgba(255, 0, 153, 0.9), 1.9288548891em 1.8551064309em 7px rgba(32, 255, 0, 0.9), 0.4361166185em 0.0294237767em 7px rgba(255, 0, 126, 0.9), 2.0626329594em 1.7873463455em 7px rgba(0, 255, 184, 0.9), 1.7022112788em 0.7296571682em 7px rgba(255, 57, 0, 0.9), 1.4664274845em 0.0642658301em 7px rgba(255, 0, 102, 0.9);
  animation-duration: 43s;
  animation-delay: -32s;
}

head::before {
  text-shadow: -0.1502166787em 1.5524595719em 7px rgba(255, 63, 0, 0.9), 2.0093511765em 2.0789722215em 7px rgba(0, 255, 94, 0.9), -0.0002849422em 1.1607457727em 7px rgba(147, 0, 255, 0.9), 2.3423403745em 2.4596755987em 7px rgba(0, 255, 18, 0.9), 0.9731821474em 2.2045992954em 7px rgba(0, 147, 255, 0.9), 0.4768298225em 0.1004564573em 7px rgba(255, 0, 201, 0.9), 1.8570012364em -0.3911784467em 7px rgba(137, 255, 0, 0.9), 1.2958922433em 0.2919475653em 7px rgba(0, 255, 116, 0.9), -0.1733816179em 1.1041716276em 7px rgba(35, 255, 0, 0.9), 1.9484216302em -0.4918090265em 7px rgba(110, 0, 255, 0.9), 2.2485282781em 2.0184403082em 7px rgba(0, 222, 255, 0.9), -0.065861775em 2.2541534764em 7px rgba(255, 0, 99, 0.9), -0.2999919354em 2.1160339583em 7px rgba(0, 73, 255, 0.9), 1.7116572816em 1.1436654382em 7px rgba(30, 0, 255, 0.9), 0.1880846377em 0.4016552632em 7px rgba(0, 81, 255, 0.9), 2.295089691em 0.8618669617em 7px rgba(0, 225, 255, 0.9), 0.8504015859em 0.6133576605em 7px rgba(7, 255, 0, 0.9), -0.1043655273em -0.0300196289em 7px rgba(73, 255, 0, 0.9), 1.1903778106em 1.1095311571em 7px rgba(0, 255, 217, 0.9), -0.3361910623em -0.0972897997em 7px rgba(0, 235, 255, 0.9), 1.3820853255em 1.8203146092em 7px rgba(255, 84, 0, 0.9), 2.4444858553em -0.2003811867em 7px rgba(0, 64, 255, 0.9), 1.2217858125em 0.3003680538em 7px rgba(255, 0, 185, 0.9), 0.4194973416em -0.4178022178em 7px rgba(0, 59, 255, 0.9), 1.8314920828em 1.2507339541em 7px rgba(255, 0, 161, 0.9), 0.5327109664em -0.1537630699em 7px rgba(61, 0, 255, 0.9), 0.1244535243em 1.6058856949em 7px rgba(255, 0, 132, 0.9), 1.5883417993em 0.7417594896em 7px rgba(255, 65, 0, 0.9), -0.134447282em 1.5957285118em 7px rgba(255, 142, 0, 0.9), -0.4879824015em 1.8349333359em 7px rgba(255, 221, 0, 0.9), 2.1499520568em 0.934972073em 7px rgba(88, 0, 255, 0.9), 2.105822612em 0.445471875em 7px rgba(0, 255, 224, 0.9), 1.4792036455em 0.1243796001em 7px rgba(255, 110, 0, 0.9), 2.4159545448em 1.6896686485em 7px rgba(0, 152, 255, 0.9), -0.1658324426em 1.775575511em 7px rgba(96, 255, 0, 0.9), 1.293525261em 2.4179369725em 7px rgba(255, 207, 0, 0.9), 0.3390145125em 1.8790595578em 7px rgba(5, 255, 0, 0.9), 0.5375599065em 1.5595712565em 7px rgba(159, 255, 0, 0.9), 1.080538539em 0.3556572047em 7px rgba(91, 255, 0, 0.9), 0.6140316651em 2.1807473867em 7px rgba(255, 229, 0, 0.9), 1.3787141034em -0.1192326604em 7px rgba(255, 126, 0, 0.9);
  animation-duration: 42s;
  animation-delay: -23s;
}

head::after {
  text-shadow: 0.6560751407em 1.8713832838em 7px rgba(255, 122, 0, 0.9), -0.1905318141em 1.0944196667em 7px rgba(144, 255, 0, 0.9), 0.5391381722em 1.711010998em 7px rgba(243, 255, 0, 0.9), 2.0017457976em 2.3167107241em 7px rgba(255, 0, 78, 0.9), 1.2067438034em 2.1641497018em 7px rgba(255, 27, 0, 0.9), 2.3436522783em -0.1755793351em 7px rgba(255, 0, 0, 0.9), 2.1916207102em 1.2184711223em 7px rgba(0, 151, 255, 0.9), 1.8449161515em 0.5818282438em 7px rgba(179, 0, 255, 0.9), 2.0303731902em 0.1311867832em 7px rgba(174, 0, 255, 0.9), 1.5489574774em 2.3093212343em 7px rgba(0, 238, 255, 0.9), 0.4462941554em 0.4160103594em 7px rgba(34, 255, 0, 0.9), 1.1676471245em 1.7555868648em 7px rgba(0, 255, 240, 0.9), 1.531785511em 1.2703467408em 7px rgba(0, 68, 255, 0.9), 1.2354495326em 0.7057836396em 7px rgba(160, 0, 255, 0.9), 0.5787369007em 2.3320291315em 7px rgba(250, 255, 0, 0.9), 0.6568988756em 0.9856112785em 7px rgba(239, 255, 0, 0.9), 0.3807891951em 2.0883702264em 7px rgba(248, 0, 255, 0.9), 1.8279731772em 1.9557564599em 7px rgba(0, 255, 204, 0.9), 0.0698970277em -0.2440913949em 7px rgba(255, 195, 0, 0.9), -0.0797418038em 1.4025018083em 7px rgba(255, 128, 0, 0.9), -0.4107061541em 0.4479371041em 7px rgba(0, 255, 118, 0.9), 1.6864350487em 1.8130094134em 7px rgba(172, 0, 255, 0.9), -0.2243693765em 0.2954568534em 7px rgba(73, 255, 0, 0.9), 2.1676953715em 0.755717548em 7px rgba(0, 78, 255, 0.9), 0.9149666627em 0.5790651045em 7px rgba(0, 36, 255, 0.9), 2.1876424969em 1.6981553953em 7px rgba(0, 255, 193, 0.9), 1.1441430779em -0.0874233764em 7px rgba(0, 255, 134, 0.9), 0.7270359252em 0.439070818em 7px rgba(177, 255, 0, 0.9), 0.6272652259em 1.4229661057em 7px rgba(0, 83, 255, 0.9), 1.5242730064em -0.2647233697em 7px rgba(29, 0, 255, 0.9), 1.1448937241em 2.1114813048em 7px rgba(248, 255, 0, 0.9), 1.0834855243em 1.0962480823em 7px rgba(0, 255, 187, 0.9), 1.7084234064em 1.893098789em 7px rgba(28, 0, 255, 0.9), 0.4125805553em 1.6094455737em 7px rgba(255, 31, 0, 0.9), -0.4715433em 2.3434147694em 7px rgba(255, 52, 0, 0.9), 0.0303502707em 0.5083158444em 7px rgba(123, 0, 255, 0.9), 1.245911893em -0.1879606753em 7px rgba(171, 255, 0, 0.9), 0.2973067995em 1.7117011846em 7px rgba(255, 0, 103, 0.9), 1.4865859691em 0.4262951728em 7px rgba(255, 0, 121, 0.9), -0.4852254456em 1.9125025819em 7px rgba(155, 255, 0, 0.9), 0.476863616em 1.1953120128em 7px rgba(71, 0, 255, 0.9);
  animation-duration: 41s;
  animation-delay: -19s;
}

@keyframes move {
  from {
    transform: rotate(0deg) scale(12) translateX(-20px);
  }
  to {
    transform: rotate(360deg) scale(18) translateX(20px);
  }
}

/* Additional styling */
.container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
  font-family: 'Poppins', sans-serif;
}

.header h1 {
  font-size: 2rem;
  margin: 0;
  font-weight: 600; /* Bolder for the title */
}

.header p {
  font-size: 1.5rem;
  margin-top: 1rem;
  font-weight: 400; /* Regular for the subtitle */
}