@font-face {
    font-family: 'CustomFontHeadings';
    src: url('https://trezor.visualbook.pro/media/pages/design/cf1c1873b9-1786016149/tt-satoshi-demibold-1.otf') format('opentype');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'CustomFontBodyRegular';
    src: url('https://trezor.visualbook.pro/media/pages/design/35cfb0556a-1786016149/tt-satoshi-regular.otf') format('opentype');
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: 'CustomFontBodyBold';
    src: url('https://trezor.visualbook.pro/media/pages/design/529e17dfd3-1786016149/tt-satoshi-bold.otf') format('opentype');
    font-weight: bold;
    font-display: swap;
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-headings);
    font-weight: 700;
    font-feature-settings: normal;
    text-transform: none;
}
body, p, table, th, td, div, span, a, ul, ol, li, button, input, textarea, select {
    font-family: var(--font-family-body);
    font-weight: normal;
    font-feature-settings: normal;
}
strong, b {
    font-family: var(--font-family-body-bold);
    font-weight: bold;
    font-feature-settings: normal;
}
:root {
    --font-family-headings: 'CustomFontHeadings';
    --font-family-body: 'CustomFontBodyRegular';
    --font-family-body-bold: 'CustomFontBodyBold';
    --card-color-bg: #fbfbfb;
    --card-color-swatch1-color: #a4a8b8;
    --card-color-swatch2-color: #c3c6d4;
    --card-color-swatch3-color: #dddfe8;
}
@font-face {
    font-family: 'CustomFonttypography';
    src: url('https://trezor.visualbook.pro/media/pages/design/cf1c1873b9-1786016149/tt-satoshi-demibold-1.otf') format('opentype');
    font-display: swap;
}

.card-typography-typography {
    background-color: #062D16;
    color: #FFFFFF;
}
.card-typography-typography .custom-font-display {
    font-family: 'CustomFonttypography' !important;
    font-feature-settings: normal !important;
    
    position: relative;
    top: px;
    color: #FFFFFF;
    font-size: 100px !important;
    line-height: 1 !important;
    font-weight: normal !important;
    text-align: center !important;
    width: 100% !important;
    -webkit-font-feature-settings: normal !important;
    font-feature-settings: normal !important;
    font-variant-numeric: normal !important;
}
:root {
    --heading-scale: 1;
    --heading-kerning: 0em;
    --body-line-height: 1.5;
    --body-kerning: 0em;
    --base-font-size: 18px;
    --table-header-color-bg: #FAFAFA;
    --gray-100: #161616;
    --gray-90: #262626;
    --gray-80: #393939;
    --gray-70: #525252;
    --gray-60: #6F6F7E;
    --gray-50: #8D8D8D;
    --gray-40: #A8A8A8;
    --gray-30: #C6C6C6;
    --gray-20: #E0E0E0;
    --gray-15: #E8E8E8;
    --gray-10: #F4F4F4;
    --gray-00: #FBFBFB;
    --table-color-bg: white;
    --table-hover-bg: white;
    --card-bottom-bg-color: #FBFBFB;
    --card-bottom-hover-color: #FFFFFF;
    --card-bottom-heading-color: #262626;
    --card-bottom-text-color: #6B6F7E;
    --dynamic-web-bg-color: #FAFAFA;
    --dynamic-blocks-bg-color: #FFFFFF;
    --card-logo-bg: #ffffff;
    --card-color-bg: #fbfbfb;
    --card-color-swatch1-color: #a4a8b8;
    --card-color-swatch2-color: #c3c6d4;
    --card-color-swatch3-color: #dddfe8;
    --info-badge-text-color: #0F6148;
    --info-badge-bg-color: #D2F7C8;
    --info-box-text-color: #697077;
    --info-box-bg-color: #F3F3F6;
    --tooltip-text-color: #FBFBFB;
    --tooltip-bg-color: #6B6F7E;
    --visualbook-description-color: #A4A8B8;
    --header-color: #EFEFEF;
    --title-color: #000000;
    --headings-color: #000000;
    --text-color: #6B6F7E;
    --button-primary-color: #000000;
    --button-multibrand-color: #878d96;
    --button-multibrand-color-hover: #000000;
    --link-color: #4C4C4C;
    --scrollbar-color: #6B6F7E;
    --success-color: #60BA48;
    --danger-color: #FF0026;
    --logo-dark-bg: #141619;
    --logo-light-bg: white;
    --border-radius-card: 15px;
    --border-radius-button: 10px;
    --border-radius-header-button: 50px;
    --border-radius-badge: 16px;
    --border-radius-tooltip: 16px;
    --strikethrough-weight: 1px;
    --table-font-size: 0.9375rem;
}
h1, h2, h3, h4, h5, h6,
body h1, body h2, body h3, body h4, body h5, body h6,
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
section h1, section h2, section h3, section h4, section h5, section h6,
.container h1, .container h2, .container h3, .container h4, .container h5, .container h6 {
    letter-spacing: var(--heading-kerning) !important;
}
body, p, table, th, td, div, span, a, ul, ol, li, button, input, textarea, select {
    line-height: var(--body-line-height);
    letter-spacing: var(--body-kerning);
}
body {
    letter-spacing: var(--body-kerning);
}
p, span, div, td, th, li, a {
    letter-spacing: inherit;
}
