@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500&family=DM+Serif+Display:ital@0;1&display=swap');

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

:root{
  --bg:#08080A;
  --bg2:#0F0F12;
  --bg3:#161618;
  --bg4:#1E1E22;
  --text:#EAE8E0;
  --text2:#8A8880;
  --text3:#4A4845;
  --orange:#C4500A;
  --orange2:#E06820;
  --orange-dim:rgba(196,80,10,0.14);
  --orange-dimmer:rgba(196,80,10,0.07);
  --border:rgba(255,255,255,0.06);
  --border2:rgba(255,255,255,0.11);
  --font-d:'Barlow Condensed',sans-serif;
  --font-b:'Barlow',sans-serif;
  --font-s:'DM Serif Display',serif;
  --ease-mech:cubic-bezier(0.16,1,0.3,1);
  --max-width:1240px;
  --gutter:28px;
  --text-xs:12px;
  --text-sm:13px;
  --text-base:15px;
  --text-md:17px;
  --text-lg:22px;
  --z-base:1;
  --z-carousel:10;
  --z-ticker:99;
  --z-nav:100;
  --z-overlay:199;
  --z-drawer:200;
  --z-noise:999;
}

html{scroll-behavior:smooth;color-scheme:dark}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-b);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  min-height:100dvh;
}

body::before{
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
  opacity:0.026;
  pointer-events:none;
  z-index:var(--z-noise);
}

a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button{cursor:pointer;font-family:var(--font-d);border:none;background:none}

.wrap{max-width:var(--max-width);margin:0 auto;padding:0 var(--gutter)}

::selection{background:var(--orange-dim);color:var(--text)}

::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--orange)}

:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:2px}