:root {
  /* palet */
  --blue-dark: #061628;
  --violet:    #6059A7;
  --gray-dark: #222B3B;
  --white:     #B3BACC;

  /* tokens */
  --radius: 16px;
  --gap: 1rem;
  --maxw: 1100px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
img { display:block; max-width:100%; height:auto; }
a { color: var(--violet); text-decoration: none; }
a:hover { text-decoration: underline; }
:focus-visible { outline: 2px solid var(--violet); outline-offset: 2px; }

body {
  background: var(--gray-dark);
  color: var(--white);
  font-family: myriadPro; /*"Myriad Pro", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;*/
  line-height: 1.5;
}
@font-face {
    font-family: myriadPro;
    src: url(../fonts/myriad-pro/MYRIADPRO-REGULAR.OTF);
}
@font-face {
    font-family: myriadPro;
    src: url(../fonts/myriad-pro/MYRIADPRO-BOLD.OTF);
    font-weight: bold;
}