/*
====================================================================

Typography

Site-wide font families, weights and text rhythm.

Fonts ship with the theme. Nothing here depends on the WordPress
Font Library, so a fresh clone renders correctly on any site.

Both families are variable: one file per family per subset covers
the whole weight range. Only cyrillic and latin subsets are shipped.

    Nunito  200-800  headings and interface
    Onest   100-900  body text

====================================================================
*/


@font-face {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("../fonts/nunito-cyrillic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("../fonts/nunito-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;
}

@font-face {
    font-family: "Nunito";
    font-style: italic;
    font-weight: 200 800;
    font-display: swap;
    src: url("../fonts/nunito-cyrillic-italic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Nunito";
    font-style: italic;
    font-weight: 200 800;
    font-display: swap;
    src: url("../fonts/nunito-latin-italic.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;
}

@font-face {
    font-family: "Onest";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/onest-cyrillic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Onest";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/onest-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;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/montserrat-cyrillic.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/montserrat-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 {
    --dd-font-body: "Onest", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --dd-font-heading: "Nunito", var(--dd-font-body);
    --dd-font-ui: "Nunito", var(--dd-font-body);

    --dd-font-weight-light: 300;
    --dd-font-weight-regular: 400;
    --dd-font-weight-medium: 500;
    --dd-font-weight-semibold: 600;
    --dd-font-weight-bold: 700;

    --dd-line-height-body: 1.6;
    --dd-line-height-heading: 1.2;
    --dd-line-height-ui: 1.25;

    --dd-em-color: var(--dd-text-light);
}

/*
 * Цвет курсивного выделения зависит от цвета текста контекста:
 *
 *     текст --dd-text, тёмный по светлому   ->  --dd-text-light
 *     текст белый, по тёмному или цветному  ->  --dd-primary-light
 *
 * Вывести это из currentColor нельзя: осветление белого даёт белый.
 * Поэтому контексты со светлым текстом перечислены явно. Новая
 * секция с тёмным или цветным фоном добавляется сюда же.
 */
.dd-footer,
.dd-bottom-bar,
.dd-front-cta-hero {
    --dd-em-color: var(--dd-primary-light);
}

html,
body {
    font-family: var(--dd-font-body);
    letter-spacing: 0;
}

body {
    font-size: 1.0625rem;
    font-weight: var(--dd-font-weight-regular);
    line-height: var(--dd-line-height-body);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.wp-block-heading {
    font-family: var(--dd-font-heading);
    font-weight: var(--dd-font-weight-bold);
    line-height: var(--dd-line-height-heading);
    letter-spacing: 0;
}

h1,
.h1 {
    font-size: var(--dd-display-sm-size);
}

h2,
.h2 {
    font-size: var(--dd-title-size);
}

h3,
.h3 {
    font-size: var(--dd-card-title);
}

h4,
.h4 {
    font-size: 1.25rem;
}

h5,
.h5 {
    font-size: 1.125rem;
}

h6,
.h6 {
    font-size: 1rem;
}

p,
li,
dt,
dd,
blockquote,
figcaption,
caption,
td,
th {
    font-family: var(--dd-font-body);
}

/*
 * Меню навбара наследует интерфейсный шрифт от .dd-navbar, но
 * правило выше матчит каждый li напрямую и переопределяет
 * наследование. .dd-breadcrumbs выводит trail через <span>
 * (Breadcrumb NavXT), а .dd-bottom-bar состоит из <div> — ни там,
 * ни там списков нет, фикс им не нужен.
 */
.dd-navbar li {
    font-family: var(--dd-font-ui);
}

strong,
b {
    font-weight: var(--dd-font-weight-bold);
}

/*
 * Курсив означает смену интонации, а не усиление: выделенная часть
 * легче окружающего текста и уходит в приглушённый тон, тогда как
 * strong и b наоборот тяжелее.
 *
 * Цвет берётся из контекстного токена. Вывести его из currentColor
 * нельзя: на цветном фоне текст белый, а нужный тон является
 * самостоятельным цветом палитры, а не осветлённым белым.
 *
 * Правило намеренно не распространяется на <i>: этот тег занят
 * иконочными шрифтами.
 */
em {
    color: var(--dd-em-color);
    font-style: italic;
    font-weight: var(--dd-font-weight-light);
}

button,
input,
select,
textarea,
.button,
.btn,
.wp-element-button,
.wp-block-button__link,
.dd-navbar,
.dd-breadcrumbs,
.dd-bottom-bar {
    font-family: var(--dd-font-ui);
    letter-spacing: 0;
}

button,
.button,
.btn,
.wp-element-button,
.wp-block-button__link,
.dd-navbar__menu-list a,
.dd-navbar__mobile-menu-list a,
.dd-navbar__phone-link {
    font-weight: var(--dd-font-weight-semibold);
    line-height: var(--dd-line-height-ui);
}

/*
 * ЕДИНАЯ ШКАЛА ТИПОГРАФИКИ. Один источник размеров для всего сайта:
 * шесть ролей + карточные производные. В блоках размеры напрямую не
 * задаются - только эти токены (или утилити-классы .dd-t-* ниже).
 * Все значения относительные (rem + плавный clamp).
 *
 * Аудитория возрастная, места много - базовые размеры на ступень
 * крупнее типовых (текст 18, ярлыки 15).
 *
 *   display     80->38  Montserrat 800  баннерные заголовки секций
 *   display-sm  60->32  Montserrat 700  длинные заголовки страниц (имя врача)
 *   title       40->24  Nunito 700      заголовки внутри блоков
 *   subtitle    24->20  Nunito 500      слоган CTA, подзаголовки
 *   card-title  21      по контексту    имя в карточке, вопрос, цена
 *   text        18/1.7  Onest 400       весь текст
 *   label       15 caps Nunito 600      ярлыки, красные лиды
 */
:root {
    --dd-font-display: "Montserrat", var(--dd-font-heading);
    --dd-display-weight: 800;
    --dd-display-size: clamp(2.375rem, 4.2vw, 5rem);
    --dd-display-sm-weight: 700;
    --dd-display-sm-size: clamp(2rem, 3.15vw, 3.75rem);

    --dd-title-size: clamp(1.5rem, 2.1vw, 2.5rem);
    --dd-subtitle-size: clamp(1.25rem, 1.25vw, 1.5rem);

    --dd-card-title-lg: var(--dd-title-size);
    --dd-card-title: 1.3125rem;
    --dd-card-text: 1.125rem;
    --dd-card-text-lh: 1.7;
    --dd-card-label: .9375rem;
    --dd-card-price: 1.3125rem;
}

/*
 * Ссылки без подчёркивания ГЛОБАЛЬНО (решение Эда): никакой
 * text-decoration нигде; явное подчёркивание разрешено только
 * контрастному режиму (accessibility.css, там !important).
 * Локальные text-decoration в блоках/страницах не пишем.
 */
a,
a:hover,
a:focus,
a:focus-visible {
    text-decoration: none;
}

/*
 * <strong>/<b> в контенте - СЕО-разметка, а не визуальный акцент:
 * по решению Эда выглядят как обычный текст (цвет и начертание
 * наследуются). Контрастный режим со своим правилом не трогаем.
 */
strong,
b {
    color: inherit;
    font-weight: inherit;
}

/*
 * Исключение: стронги, которые ДОЛЖНЫ быть видны (названия брендов,
 * технологий), помечаются в контенте классом show.
 */
strong.show,
b.show {
    font-weight: var(--dd-font-weight-bold);
}

/* Утилити-классы тех же ролей - для контента из Gutenberg. */
.dd-t-display {
    font-family: var(--dd-font-display);
    font-weight: var(--dd-display-weight);
    font-size: var(--dd-display-size);
    line-height: 1.1;

    /* Длинные одиночные слова («Рентгенодиагностика») на узких
       экранах переносятся, а не распирают страницу вбок. */
    hyphens: auto;
    overflow-wrap: break-word;
}

.dd-t-display-sm {
    font-family: var(--dd-font-display);
    font-weight: var(--dd-display-sm-weight);
    font-size: var(--dd-display-sm-size);
    line-height: 1.15;
    hyphens: auto;
    overflow-wrap: break-word;
}

.dd-t-title {
    font-family: var(--dd-font-heading);
    font-weight: var(--dd-font-weight-bold);
    font-size: var(--dd-title-size);
}

.dd-t-subtitle {
    font-family: var(--dd-font-heading);
    font-weight: var(--dd-font-weight-medium);
    font-size: var(--dd-subtitle-size);
}

.dd-t-label {
    font-family: var(--dd-font-ui);
    font-weight: var(--dd-font-weight-semibold);
    font-size: var(--dd-card-label);
    letter-spacing: .08em;
    text-transform: uppercase;
}