:root{
  --color-bg:#0a0a0a;
  --color-bg-alt:#141414;
  --color-bg-raised:#1b1b1b;
  --color-red:#c81414;
  --color-red-bright:#ff3b3b;
  --color-black:#000000;
  --color-text:#f2f2f2;
  --color-text-dim:#a6a6a6;
  --color-border:#232323;
  --color-border-hover:#4a1515;
  --radius:14px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --font-orbitron:'Orbitron',sans-serif;
  --font-ailerons:'Ailerons',sans-serif;
  --font-ndot:'Ndot55',sans-serif;
  --font-labirhin:'LabirhinFont',sans-serif;
  --font-jaya:'JayaAbadiFont',sans-serif;
  --font-body:'Exo 2','Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}

@font-face{
  font-family:'Orbitron';
  src:url('/ASSets/fonts/Orbitron-VariableFont_wght.ttf') format('truetype');
  font-weight:100 900;
  font-display:swap;
}

@font-face{
  font-family:'Exo 2';
  src:url('/ASSets/fonts/Exo2-VariableFont_wght.ttf') format('truetype');
  font-weight:100 900;
  font-display:swap;
}

@font-face{
  font-family:'Ailerons';
  src:url('/ASSets/fonts/Ailerons.ttf') format('truetype');
  font-weight:normal;
  font-display:swap;
}

@font-face{
  font-family:'Ndot55';
  src:url('/ASSets/fonts/Ndot55-Regular.otf') format('opentype');
  font-weight:normal;
  font-display:swap;
}

@font-face{
  font-family:'LabirhinFont';
  src:url('/ASSets/fonts/LabirhinFont-Regular.otf') format('opentype');
  font-weight:normal;
  font-display:swap;
}

@font-face{
  font-family:'JayaAbadiFont';
  src:url('/ASSets/fonts/JayaAbadiFont-Regular.ttf') format('truetype');
  font-weight:normal;
  font-display:swap;
}

*,*::before,*::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html{
  height:100%;
  background:var(--color-bg);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

@media (prefers-reduced-motion:no-preference){
  html{
    scroll-behavior:smooth;
  }
}

body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  color:var(--color-text);
  font-family:var(--font-body);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Ambient background: drifting red glow. */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
}

body::before{
  background:
    radial-gradient(720px 480px at 12% -8%, rgba(200,20,20,.13), transparent 70%),
    radial-gradient(620px 420px at 92% 6%, rgba(200,20,20,.08), transparent 70%);
  will-change:transform, opacity;
  animation:exoworoGlow 28s ease-in-out infinite alternate;
}

@keyframes exoworoGlow{
  from{ transform:translate3d(0,0,0) scale(1); opacity:.8; }
  to{ transform:translate3d(1.5%,2%,0) scale(1.08); opacity:1; }
}

main{
  flex:1 0 auto;
  width:100%;
}

.site-footer{
  flex-shrink:0;
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  max-width:100%;
  display:block;
}

button{
  font-family:inherit;
  cursor:pointer;
  border:none;
  background:none;
  color:inherit;
}

::selection{
  background:var(--color-red);
  color:#fff;
}

:focus-visible{
  outline:2px solid var(--color-red-bright);
  outline-offset:3px;
  border-radius:4px;
}

.container{
  width:min(1100px,92%);
  margin-inline:auto;
}

.skip-link{
  position:fixed;
  top:-60px;
  left:1rem;
  z-index:10001;
  background:var(--color-red);
  color:#fff;
  padding:.6rem 1rem;
  border-radius:8px;
  transition:top .2s var(--ease);
}

.skip-link:focus{
  top:1rem;
}

/* Shared card look */
.panel{
  background:var(--color-bg-alt);
  border:1px solid var(--color-border);
  border-radius:var(--radius);
  transition:border-color .4s var(--ease-soft);
}

.panel:hover{
  border-color:var(--color-border-hover);
}

/* Buttons */
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.7rem 1.5rem;
  border-radius:10px;
  background:var(--color-red);
  color:#fff;
  font-family:var(--font-orbitron);
  font-size:.82rem;
  letter-spacing:.05em;
  transition:transform .35s var(--ease), background-color .3s var(--ease-soft), border-color .3s var(--ease-soft);
}

.btn:hover{
  transform:translateY(-1px);
  background:#d81c1c;
}

.btn:active{
  transform:translateY(0);
  transition-duration:.1s;
}

.btn[disabled]{
  opacity:.65;
  cursor:wait;
  transform:none;
}

.btn-ghost{
  background:transparent;
  border:1px solid var(--color-border);
  box-shadow:none;
  color:var(--color-text);
}

.btn-ghost:hover{
  border-color:var(--color-red);
  background:rgba(200,20,20,.08);
}

.btn-small{
  padding:.45rem .9rem;
  font-size:.72rem;
  border-radius:8px;
}

/* Scroll reveal (class "js" is set by an inline script so no-JS visitors see everything) */
.js .reveal{
  opacity:0;
  transform:translateY(14px);
  transition-property:opacity, transform, border-color, box-shadow, background-color;
  transition-duration:.9s, .9s, .3s, .3s, .3s;
  transition-timing-function:var(--ease), var(--ease), ease, ease, ease;
  transition-delay:var(--d, 0s), var(--d, 0s), 0s, 0s, 0s;
}

.js .reveal.is-visible{
  opacity:1;
  transform:none;
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    transition-delay:0s !important;
    scroll-behavior:auto !important;
  }
  .js .reveal{
    opacity:1;
    transform:none;
  }
}

/* Thin dark scrollbars */
*{
  scrollbar-width:thin;
  scrollbar-color:#3a3a3a transparent;
}
