/* ============================================================
   SCENERY — colors_and_type.css
   Terminal-noir / brutalist editorial. Drop this into any page
   and import the Google fonts or host locally.
   ============================================================ */

/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-greek-ext.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
  /* ── CORE NEUTRALS ─────────────────────────────── */
  --vh-black:         #000000;          /* page background */
  --vh-ink:           #0e0e0e;          /* elevated surface (cards, terminals) */
  --vh-ink-hover:     #161616;          /* hover surface */
  --vh-bg-panel:      #161616;          /* sidebars, panels */
  --vh-white:         #ffffff;          /* primary text on dark (pure white for contrast) */
  --vh-gray:          #b8b8b8;          /* secondary / body on dark — AA contrast on black */
  --vh-gray-2:        #8a8a8a;          /* tertiary / metadata */
  --vh-gray-dark:     #5a5a5a;          /* dim text, disabled */
  --vh-gray-border:   #2a2a2a;          /* hairline borders */
  --vh-gray-dashed:   rgba(255,255,255,.1); /* dashed list dividers */

  /* ── ACCENT PALETTE ────────────────────────────── */
  --vh-blue:          #0070f3;          /* primary action / link / demo */
  --vh-green:         #50e3c2;          /* gateway / success / safe */
  --vh-red:           #ff4444;          /* danger / strike / threat */
  --vh-red-dark:      #dc2626;          /* deeper red for critical */
  --vh-orange:        #f5a623;          /* credentials / warn */
  --vh-purple:        #a78bfa;          /* skillrunner / agent */
  --vh-yellow:        #facc15;          /* rare highlight */

  /* Dim / tint versions for backgrounds */
  --vh-blue-dim:      rgba(0,112,243,.12);
  --vh-green-dim:     rgba(80,227,194,.12);
  --vh-red-dim:       rgba(255,68,68,.12);
  --vh-orange-dim:    rgba(245,166,35,.12);
  --vh-purple-dim:    rgba(167,139,250,.12);

  /* ── SEMANTIC COLORS ───────────────────────────── */
  --vh-fg:            var(--vh-white);
  --vh-fg-muted:      var(--vh-gray);
  --vh-fg-dim:        var(--vh-gray-dark);
  --vh-bg:            var(--vh-black);
  --vh-bg-elevated:   var(--vh-ink);
  --vh-link:          var(--vh-blue);
  --vh-success:       var(--vh-green);
  --vh-danger:        var(--vh-red);
  --vh-warn:          var(--vh-orange);

  /* Tag / product category colors (from site nav) */
  --vh-cat-problem:   var(--vh-red);
  --vh-cat-demo:      var(--vh-blue);
  --vh-cat-gateway:   var(--vh-green);
  --vh-cat-runner:    var(--vh-purple);
  --vh-cat-registry:  var(--vh-blue);

  /* ── TYPOGRAPHY STACKS ─────────────────────────── */
  /* Body is Inter (proportional sans) — clean, high-read.
     Mono is reserved for code, terminal output, CVE IDs, timestamps. */
  --vh-font-mono:     'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --vh-font-display:  'Inter', ui-sans-serif, system-ui, sans-serif;
  --vh-font-body:     'Inter', ui-sans-serif, system-ui, sans-serif;

  /* Display weight is always 900. Body is 400/700. */
  --vh-fw-body:       400;
  --vh-fw-body-bold:  700;
  --vh-fw-display:    900;

  /* ── TYPE SCALE ────────────────────────────────── */
  /* Display — Inter 900, tight tracking, uppercase.
     Hero sizes fluid; section sizes fluid; all clamp()ed. */
  --vh-size-hero:     clamp(3.5rem, 10vw, 8rem);     /* 56 → 128 */
  --vh-size-hero-xl:  clamp(4rem, 12vw, 10rem);      /* 64 → 160 */
  --vh-size-h1:       clamp(2.2rem, 6vw, 4rem);      /* 35 → 64  */
  --vh-size-h2:       clamp(1.6rem, 4vw, 2.4rem);    /* 25 → 38  */
  --vh-size-h3:       1.15rem;                        /* 18.4    */
  --vh-size-h4:       1rem;                           /* 16      */

  /* Body sizes — monospace. Bumped from original site for readability. */
  --vh-size-lead:     1.35rem;      /* 21.6 — hero sub */
  --vh-size-body:     1.0625rem;    /* 17   — paragraph (up from 16) */
  --vh-size-body-sm:  .9375rem;     /* 15   */
  --vh-size-small:    .875rem;      /* 14   */
  --vh-size-micro:    .8125rem;     /* 13   — metadata (up from 11.5) */
  --vh-size-eyebrow:  .8125rem;     /* 13   — labels */
  --vh-size-nano:     .75rem;       /* 12   — tag / badge (up from 10.4) */

  /* Letter-spacing */
  --vh-ls-display:    -.03em;
  --vh-ls-display-tight: -.04em;
  --vh-ls-eyebrow:    .15em;        /* heavy tracking for UPPERCASE labels */
  --vh-ls-label:      .1em;
  --vh-ls-micro:      .08em;

  /* Line-heights */
  --vh-lh-display:    .92;
  --vh-lh-h1:         1;
  --vh-lh-body:       1.7;
  --vh-lh-tight:      1.5;

  /* ── BORDERS / RADII ───────────────────────────── */
  /* Corners are subtly softened — 4px default, not sharp 0.
     Large surfaces (cards, panels) use 6px. Dots/avatars stay round. */
  --vh-border-1:      1px solid var(--vh-gray-border);
  --vh-border-2:      2px solid var(--vh-gray-border);
  --vh-border-hair:   1px solid var(--vh-gray-dashed);
  --vh-border-accent-blue:   2px solid var(--vh-blue);
  --vh-border-accent-green:  2px solid var(--vh-green);
  --vh-border-accent-red:    2px solid var(--vh-red);
  --vh-border-dashed: 1px dashed var(--vh-gray-dashed);
  --vh-radius-0:      0;                    /* rare — hard sticker shadows */
  --vh-radius-sm:     4px;                  /* default — buttons, inputs, tags */
  --vh-radius-md:     6px;                  /* cards, panels, modals */
  --vh-radius-lg:     8px;                  /* hero cards, large containers */
  --vh-radius-dot:    50%;                  /* dots / avatars */

  /* ── SHADOW SYSTEM ─────────────────────────────── */
  /* Shadows are RARE and HARD-OFFSET (not soft).
     Used for stickers / inserts to feel physical. */
  --vh-shadow-sticker: 4px 6px 0 rgba(0,0,0,.5);
  --vh-shadow-lift:    6px 8px 0 var(--vh-gray-border);
  --vh-shadow-none:    none;

  /* ── SPACING (8pt-ish but raw) ─────────────────── */
  --vh-space-0:       0;
  --vh-space-1:       .25rem;       /* 4   */
  --vh-space-2:       .5rem;        /* 8   */
  --vh-space-3:       .75rem;       /* 12  */
  --vh-space-4:       1rem;         /* 16  */
  --vh-space-5:       1.5rem;       /* 24  */
  --vh-space-6:       2rem;         /* 32  */
  --vh-space-7:       2.5rem;       /* 40  */
  --vh-space-8:       3rem;         /* 48  */
  --vh-space-9:       4rem;         /* 64  */
  --vh-space-10:      6rem;         /* 96  — section padding */

  /* Section / container */
  --vh-container:     1200px;
  --vh-section-pad-y: 3rem;
  --vh-section-pad-x: 3rem;

  /* ── MOTION ────────────────────────────────────── */
  --vh-ease:          cubic-bezier(.25,.1,.25,1);
  --vh-dur-fast:      .15s;         /* hover / press */
  --vh-dur-base:      .3s;          /* accordion, reveal */
  --vh-dur-slow:      .5s;
  --vh-dur-carousel:  .4s;
}

/* ============================================================
   SEMANTIC ELEMENT STYLES
   Bare tags that, when these styles are applied, yield the
   correct brand look without extra classes.
   ============================================================ */

body {
  font-family: var(--vh-font-body);
  font-weight: var(--vh-fw-body);
  background: var(--vh-black);
  color: var(--vh-white);
  font-size: var(--vh-size-body);
  line-height: var(--vh-lh-tight);
  cursor: crosshair;                 /* signature pointer */
  overflow-x: hidden;
}

::selection { background: var(--vh-blue); color: var(--vh-white); }

h1, h2, h3, h4 {
  font-family: var(--vh-font-display);
  font-weight: var(--vh-fw-display);
  text-transform: uppercase;
  letter-spacing: var(--vh-ls-display);
  line-height: var(--vh-lh-h1);
}
h1 { font-size: var(--vh-size-hero);  letter-spacing: var(--vh-ls-display-tight); line-height: var(--vh-lh-display); }
h2 { font-size: var(--vh-size-h1); }
h3 { font-size: var(--vh-size-h3);  letter-spacing: .03em; }
h4 { font-size: var(--vh-size-h4);  letter-spacing: .05em; }

p { font-size: var(--vh-size-body); line-height: var(--vh-lh-body); color: var(--vh-white); }
p.vh-muted { color: var(--vh-gray); }

a {
  color: var(--vh-white);
  text-decoration: none;
  transition: color var(--vh-dur-fast);
}
a:hover { color: var(--vh-blue); }

code, pre, kbd, samp {
  font-family: var(--vh-font-mono);
  font-size: .88em;
}

hr { border: 0; border-top: var(--vh-border-2); }

/* ============================================================
   PRESENTATIONAL UTILITIES (optional — use as needed)
   ============================================================ */

/* Eyebrow — rotated sticker-style label above hero/sections */
.vh-eyebrow {
  font-family: var(--vh-font-mono);
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: var(--vh-ls-eyebrow);
  font-weight: var(--vh-fw-body-bold);
  background: var(--vh-gray-border);
  color: var(--vh-white);
  display: inline-block;
  padding: .3rem .8rem;
  border: 1px solid var(--vh-gray-dark);
  transform: rotate(-1deg);
}
.vh-eyebrow--blue   { background: var(--vh-blue);   border-color: var(--vh-blue);   color: var(--vh-white); }
.vh-eyebrow--green  { background: var(--vh-green);  border-color: var(--vh-green);  color: var(--vh-black); }
.vh-eyebrow--red    { background: var(--vh-red);    border-color: var(--vh-red);    color: var(--vh-white); }
.vh-eyebrow--purple { background: var(--vh-purple); border-color: var(--vh-purple); color: var(--vh-white); }
.vh-eyebrow--orange { background: var(--vh-orange); border-color: var(--vh-orange); color: var(--vh-black); }

/* Section number — small bordered pill with // vibe */
.vh-section-num {
  font-size: var(--vh-size-micro);
  font-family: var(--vh-font-mono);
  font-weight: var(--vh-fw-body-bold);
  text-transform: uppercase;
  letter-spacing: var(--vh-ls-eyebrow);
  display: inline-block;
  background: var(--vh-gray-border);
  color: var(--vh-white);
  padding: .2rem .7rem;
  border: 1px solid var(--vh-gray-dark);
}

/* Tag — bordered outline chip (takes currentColor) */
.vh-tag {
  font-size: var(--vh-size-nano);
  font-family: var(--vh-font-mono);
  font-weight: var(--vh-fw-body-bold);
  text-transform: uppercase;
  letter-spacing: var(--vh-ls-label);
  padding: .25rem .6rem;
  border: 1px solid currentColor;
  display: inline-block;
}

/* Strike / insert — headline treatment */
.vh-strike {
  text-decoration: line-through;
  text-decoration-color: var(--vh-red);
  text-decoration-thickness: 5px;
  opacity: .4;
}
.vh-insert {
  display: inline-block;
  background: var(--vh-red);
  color: var(--vh-white);
  padding: .08em .3em;
  line-height: 1;
  box-shadow: var(--vh-shadow-sticker);
  transform: rotate(-3deg);
}

/* Button — monospace, uppercase, sharp */
.vh-btn {
  font-family: var(--vh-font-mono);
  font-size: 1rem;
  font-weight: var(--vh-fw-body-bold);
  text-transform: uppercase;
  letter-spacing: var(--vh-ls-label);
  padding: 1.1rem 2.5rem;
  border: 2px solid var(--vh-white);
  background: var(--vh-white);
  color: var(--vh-black);
  cursor: pointer;
  transition: background var(--vh-dur-fast), color var(--vh-dur-fast);
  display: inline-block;
}
.vh-btn:hover { background: transparent; color: var(--vh-white); }
.vh-btn--ghost { background: transparent; color: var(--vh-white); }
.vh-btn--ghost:hover { background: var(--vh-white); color: var(--vh-black); }
.vh-btn--blue { background: var(--vh-blue); border-color: var(--vh-blue); color: var(--vh-white); }
.vh-btn--blue:hover { background: transparent; color: var(--vh-blue); }

/* List with // bullets (used on threat lists, features) */
.vh-list { list-style: none; padding: 0; margin: 0; }
.vh-list li {
  font-size: var(--vh-size-body-sm);
  line-height: 1.5;
  padding: .3rem 0;
  border-bottom: var(--vh-border-dashed);
}
.vh-list li::before {
  content: '//';
  font-weight: var(--vh-fw-body-bold);
  margin-right: .4rem;
  color: var(--vh-red);
}
html,body{margin:0;background:#05070c;scroll-behavior:smooth;}
*{box-sizing:border-box;}
a{color:#fff;text-decoration:none;}
a:hover{color:#f5a623;}
button{font:inherit;color:inherit;}
a:focus-visible,button:focus-visible{outline:2px solid #f5a623;outline-offset:3px;}
@keyframes scFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}html{scroll-behavior:auto;}}
.lead-in{width:100%;background:rgba(5,7,12,.7);border:1px solid rgba(255,255,255,.22);border-radius:8px;padding:13px 14px;font:inherit;font-size:15px;color:#f4f1ec;outline:none;transition:border-color .2s;}
.lead-in::placeholder{color:#6b6760;}
.lead-in:focus{border-color:#f5a623;}
.lead-hp{position:absolute !important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
.lead-btn:disabled{cursor:not-allowed;}