/* Настройки шрифта */


html {
    font-size: 18px;
    overflow-wrap: break-word;
    hyphens: manual;
}

@media screen and (max-width: 1680px) {

    html {
        font-size: 15px;
    }

}

@media screen and (max-width: 1280px) {

    html {
        font-size: 13px;
    }

}

@media screen and (max-width: 360px) {

    html {
        font-size: 11px;
    }

}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-BlackItalic.woff2') format('woff2');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-BoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-ExtraBold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-ExtraBoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-ExtraLightItalic.woff2') format('woff2');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-LightItalic.woff2') format('woff2');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-MediumItalic.woff2') format('woff2');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('../assets/fonts/subset-SourceSans3-SemiBoldItalic.woff2') format('woff2');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Source Sans 3", Helvetica, sans-serif !important;
    font-weight: 700;
}


body,
input,
select,
textarea {
    font-family: "Source Sans 3", Helvetica, sans-serif !important;
    font-weight: 400;
    font-size: 1rem;
}

input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
    font-family: "Source Sans 3", Helvetica, sans-serif;
    font-weight: bold;
}


input[type="radio"]+label,
input[type="checkbox"]+label {
    font-family: "Source Sans 3", Helvetica, sans-serif;
    font-weight: 400;
}

header>p {
    font-style: italic;
    font-weight: 300;
}


#navPanelToggle {
    border-radius: 12px;
}

#nav {
    border-radius: 12px 12px 0 0;
}

#nav ul.links {
    font-family: "Source Sans 3", Helvetica, sans-serif !important;
}

#nav ul.links li.active a {
    color: var(--text-primary);
    background-color: var(--bg-secondary);
}

#navPanel {
    background: var(--bg-card);
}

#navPanelToggle {
    background-color: color-mix(in srgb, var(--text-secondary) 87.5%, transparent);
    box-shadow: 0 0.125rem 0.75rem 0 color-mix(in srgb, var(--accent-glow) 25%, transparent);
    color: var(--text-primary);
}


#main {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}


#main>* {
    border-top: solid 2px var(--text-secondary);
}

@media screen and (max-width: 980px) {
    #main {
        border-radius: 12px 12px 0 0;
    }
}

/* Адаптация под большие экраны */
@media screen and (min-width: 1680px) {
    #main {
        width: calc(100% - 4rem);
        max-width: 70vw;
    }

    #nav {
        width: calc(100% - 4rem);
        max-width: 70vw;
    }
}


.box {
    border-color: var(--text-secondary);
}


#intro {
    justify-content: center;
}


#intro h1,
#intro h2,
#intro h3,
#intro h4,
#intro h5,
#intro h6 {
    background: linear-gradient(to right, var(--accent-primary), var(--accent-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

h1,
h2,
h3,
h4,
h5,
h6,
dt {
    color: var(--accent-secondary);
}

hr {
    border-bottom-color: var(--text-secondary)
}

table.alt tbody tr td {
    border-color: var(--text-secondary);
}

table thead {
    border-bottom-color: var(--text-secondary);
}

table tfoot {
    border-top-color: var(--text-secondary);
}

table tbody tr {
    border-color: var(--text-secondary);
}

blockquote {
    border-left-color: var(--text-secondary);
    ;
}

a {
    color: var(--accent-secondary);
    border-bottom-color: rgba(33, 41, 49, 0.5);
}

ul.icons.alt li .icon:before {
    box-shadow: inset 0 0 0 2px var(--accent-secondary);
}

table th {
    color: var(--accent-secondary);
}

table tbody tr:nth-child(2n + 1) {
    background-color: rgba(220, 220, 220, 0.07);
}

input[type="checkbox"]+label,
input[type="radio"]+label {
    color: var(--text-primary);
}

strong,
b,
#intro strong,
#intro b {
    color: var(--accent-secondary);
}

#header .logo {
    border: none;
    width: 500px;
    max-width: 90%;
    min-width: 300px;
    object-fit: contain;
    padding: 0%;
    /* border-image: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary)) 1;
    font-family: "Source Sans 3", Helvetica, sans-serif !important;
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text; */
}

#header .logo img {
    /* ← Добавить этот селектор */
    width: 100%;
    height: 100%;
    object-fit: contain;
}

input[type="submit"].primary,
input[type="reset"].primary,
input[type="button"].primary,
button.primary,
.button.primary {
    background-color: var(--accent-primary);
    box-shadow: none;
    color: #212931 !important;
}

input[type="submit"].primary:hover,
input[type="reset"].primary:hover,
input[type="button"].primary:hover,
button.primary:hover,
.button.primary:hover {
    background-color: #18bfef;
    color: #212931 !important;
}


input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
    background-color: transparent;
    box-shadow: inset 0 0 0 2px var(--accent-primary);
    color: var(--accent-primary) !important;
}


input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
button:hover,
.button:hover {
    box-shadow: inset 0 0 0 2px #18bfef;
    color: #18bfef !important;
}

a:hover {
    border-bottom-color: transparent;
    color: #18bfef !important;
}


input[type="text"],
input[type="password"],
input[type="email"],
input[type="checkbox"]+label:before,
input[type="radio"]+label:before,
select,
textarea {
    border-color: var(--text-secondary);
    color: var(--text-secondary);
}