:root{
  --header-h: 96px;
  --max: 1360px;
  --hero-max: 1240px;

  --radius-xl: 36px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;
  --radius-pill: 999px;

  --shadow-xl: 0 28px 80px rgba(0,0,0,.30);
  --shadow-lg: 0 18px 42px rgba(0,0,0,.18);
  --shadow-md: 0 10px 24px rgba(0,0,0,.12);

  --head-1:#1d64ca;
  --head-2:#2c7ce2;
  --head-3:#5aa7ff;

  --bg-dark-1:#020816;
  --bg-dark-2:#04112a;
  --bg-dark-3:#08204a;
  --bg-dark-4:#031127;

  --text-dark:#f3fbff;
  --text-dark-soft:rgba(243,251,255,.84);
  --text-dark-faint:rgba(243,251,255,.64);

  --bg-light:#f4f8ff;
  --bg-light-2:#eaf1ff;
  --bg-light-3:#ffffff;
  --text-light:#143764;
  --text-light-soft:#3d5f8d;
  --text-light-faint:#62789b;

  --panel-dark:rgba(255,255,255,.07);
  --panel-dark-2:rgba(255,255,255,.11);
  --border-dark:rgba(169,227,255,.14);
  --border-dark-2:rgba(169,227,255,.24);

  --panel-light:#ffffff;
  --panel-light-2:#f7faff;
  --border-light:rgba(20,55,100,.08);
  --border-light-2:rgba(20,55,100,.14);

  --accent:#58b7ff;
  --accent-2:#6ea8ff;
  --danger:#eb415b;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  min-height:100vh;
  padding-top:0;
  overflow-x:hidden;
  font-family:'Prompt',sans-serif;
  color:var(--text-dark);
  background:
    radial-gradient(circle at 50% 16%, rgba(90,165,255,.16), transparent 18%),
    radial-gradient(circle at 12% 18%, rgba(115,220,255,.06), transparent 18%),
    radial-gradient(circle at 88% 12%, rgba(115,220,255,.06), transparent 18%),
    linear-gradient(180deg, var(--bg-dark-1) 0%, var(--bg-dark-2) 34%, var(--bg-dark-3) 78%, var(--bg-dark-4) 100%);
  transition:background .32s ease, color .32s ease;
  top:0 !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.32;
  background-image:
    radial-gradient(circle at 8% 16%, rgba(255,255,255,.84) 0 .8px, transparent 2px),
    radial-gradient(circle at 16% 28%, rgba(255,255,255,.58) 0 .7px, transparent 1.8px),
    radial-gradient(circle at 28% 22%, rgba(255,255,255,.74) 0 .8px, transparent 1.8px),
    radial-gradient(circle at 46% 18%, rgba(255,255,255,.64) 0 .7px, transparent 1.8px),
    radial-gradient(circle at 62% 68%, rgba(255,255,255,.58) 0 .7px, transparent 1.8px),
    radial-gradient(circle at 78% 24%, rgba(255,255,255,.82) 0 .8px, transparent 1.8px),
    radial-gradient(circle at 90% 14%, rgba(255,255,255,.60) 0 .7px, transparent 1.8px);
}

body.light-mode{
  color:var(--text-light);
  background:
    radial-gradient(circle at 50% 10%, rgba(111,155,255,.10), transparent 16%),
    linear-gradient(180deg, var(--bg-light) 0%, var(--bg-light-2) 100%);
}

body.light-mode::before{ opacity:.12; }

.th-font{ font-family:'Prompt',sans-serif; }
.en-font{ font-family:'Orbitron',sans-serif; }

img{ max-width:100%; display:block; }
button,input,textarea,select{ font:inherit; }

.site-wrap{
  position:relative;
  z-index:1;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}