@import url('./assets/css/nav.css');
@import url('./assets/css/footer.css');
@import url('./assets/css/prism.css');
@import url('./assets/css/pagination.css');
@import url('./assets/css/lessons.css');
@import url('./assets/css/c-arrow.css');

body {
    background-color: var(--black);
    color: var(--white);
    font-family: 'nhg', sans-serif;
    font-size: var(--x-lg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0 auto;
    transition: all 0.2s ease;
}

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

@font-face {
    font-family: 'nhg';
    src: url('/assets/fonts/NHaasGroteskTXPro-55Rg.woff2') format('woff2'),
         url('/assets/fonts/NHaasGroteskTXPro-55Rg.woff') format('woff');
    font-style: normal;
}

@font-face {
    font-family: 'iv';
    src: url('/assets/fonts/IvoryLLSub-Light.woff2') format('woff2'),
    url('/assets/fonts/IvoryLLSub-Light.woff') format('woff');
    unicode-range: U+0000-007F;
}

@font-face {
    font-family: 'iv';
    src: url('/assets/fonts/IvoryLLWeb-Light.woff2') format('woff2'),
    url('/assets/fonts/IvoryLLWeb-Light.woff') format('woff');
}

@font-face {
    font-family: 'space-mono';
    src: url('/assets/fonts/SpaceMono-Regular.woff2') format('woff2'),
         url('/assets/fonts/SpaceMono-Regular.woff') format('woff');
    font-style: normal;
}

:root {
    --black: #262626;
    --white: #fff;
    /* --course-bg: #FBFDF7; */
    --inactive: #b3b3b3;
    --border: #4d4d4d;
    --c-1: #5BC0EB;
    --c-1: #94B9FF;
    --c-1: #FF8EDC;
    --c-2: #FCA311;
    --c-2: #D2FF3C;
    --c-2: #ceff1a;
    --c-3: #FF8EDC;
    --c-3: #6afe62;
    --c-3: #5BC0EB;
    --c-4: #ceff1a;
    --c-4: #99DFFF;
    --c-4: #FCA311;
    --news: #edefe6;
    --news: #72d2ff;
    --news: #5BC0EB;
    --news: #e6e0d5;
    --link: #D2FF3C;
    --link: #FCA311;
    --link: #ceff1a;
    --tiny: 17.5px;
    --reg-sm: 18px;
    --reg: 19px;
    --lg: 19.5px;
    --x-lg: 20px;
    --code-bg: #1c1c1c;
    --keyword: #99DFFF; 
    --operator: #ffd452;
    --function: #d2ff3c;
    --property: #6afe62;
    --string: #94B9FF;
    --string: #b3cdff;
    --punctuation:#e8aa14;
    --scrollbar: #515661;

    /* --l-bg: #fefdf5;
    --l-font: #420016;
    --l-inactive: #7F7176;
    --l-soft-stroke: #c8c1c4;
    --d-bg: #05284C;
    --d-font: #fefdf5;
    --d-inactive: #8f96a3;
    --d-soft-stroke: #4d586f;
    --static-wht: #fefdf5;
    --accent: #A2C6E7; 
    --l-highlight: #e8ffb2;
    --neon: #d1ff66;
    --placeholder: #645d6a;
    --moon-color: #42001600;
    --l-code-bg: #f4f3eb;
    --l-keyword: #c54310;
    --l-operator: #7d6b54;
    --l-function: #ce0d8e;
    --l-property: #4763e1;
    --l-string: #527500;
    --l-punctuation: #bf4312;
    --l-scrollbar: #c4c2b5;
    --d-code-bg: #031c35;
    --d-keyword: #ed6935; 
    --d-operator: #9d886c;
    --d-function: #f45d7e;
    --d-property: #8093ea;
    --d-string: #d1ff66;
    --d-punctuation:#f4a585;
    --d-scrollbar: #515661;
    --d-link: #3dcbff;
    --l-link: #ce4712;
    --l-lesson-text: #683343;
    --l-lesson-text: #613d48;
    --l-lesson-text: #5c424a;
    --d-lesson-text: #c5ccce;
    --l-l-spacing: 0;
    --d-l-spacing: 0.005em; */
} 

/* body.light {
    --bg: var(--l-bg);
    --font: var(--l-font);
    --highlight: var(--l-highlight);
    --news-button: var(--d-font);
    --news-bg: var(--highlight);
    --inactive: var(--l-inactive);
    --lesson-bg: var(--l-lesson-bg);
    --soft-stroke: var(--l-soft-stroke);
    --c-arrow: var(--l-c-arrow);
    --code-bg: var(--l-code-bg);
    --keyword: var(--l-keyword);
    --operator: var(--l-operator);
    --function: var(--l-function);
    --property: var(--l-property);
    --string: var(--l-string);
    --comment: var(--l-comment);
    --punctuation: var(--l-punctuation);
    --scrollbar: var(--l-scrollbar);
    --link: var(--l-link);
    --lesson-text: var(--l-lesson-text);
    --letter-spacing: var(--l-l-spacing);
    --footer-bg: var(--d-bg);
} */

/* body.dark {
    --bg: var(--d-bg);
    --font: var(--d-font);
    --highlight: var(--code-bg);
    --news-button: var(--d-code-bg);
    --news-bg: var(--code-bg);
    --inactive: var(--d-inactive);
    --lesson-bg: var(--d-lesson-bg);
    --soft-stroke: var(--d-soft-stroke);
    --c-arrow: var(--d-c-arrow);
    --code-bg: var(--d-code-bg);
    --keyword: var(--d-keyword);
    --operator: var(--d-operator);
    --function: var(--d-function);
    --property: var(--d-property);
    --string: var(--d-string);
    --comment: var(--d-comment);
    --punctuation: var(--d-punctuation);
    --scrollbar: var(--d-scrollbar);
    --link: var(--d-link);
    --lesson-text: var(--d-lesson-text);
    --letter-spacing: var(--d-l-spacing);
    --footer-bg: var(--d-code-bg);
} */

.hidden {
    display: none !important;
}

a {
    text-decoration: none;
    color: var(--white);
}

ul {
    list-style: none;
    padding: 0;
}

h1, h3 {
    font-family: 'iv', serif;
    font-size: 91px;
    line-height: 1.1em;
    letter-spacing: -0.03em;
    font-weight: 300;
}

h3 {
    font-size: 25px;
    line-height: 1em;
}

h4, h5 {
    font-family: 'iv', serif;
    font-weight: 300;
    letter-spacing: -0.03em;
    line-height: 0.95em;
}

h4 {
    font-size: 57.2px;
}

h2 {
    font-family: 'iv', serif;
    font-weight: 300;
    font-size: 44px;
    letter-spacing: -0.03em; 
    line-height: 1.1;
    margin-bottom: 0.8rem;
    margin-top: 0.8rem;
}

p {
    font-family: 'nhg', sans-serif;
    font-weight: 400;
    font-size: var(--lg);
    line-height: 1.65;
    margin-bottom: 28px;
    /* letter-spacing: -0.005em; */
}

main, .nav-container, header#hero-header, .footer-contain {
    /* max-width: 1104px; */
    /* max-width: 1280px; */
    max-width: 1420px;
    margin: 0 auto;
}


/* main {
    min-height: 100vh;
} */

/* svg * {
    vector-effect: non-scaling-stroke;
} */

/* .viewport-clip {
    overflow: hidden;
} */

html, body {
  overscroll-behavior: none;
}

/* body.sale .footer-global {
    display: none !important;
}    */