/* =============================================================================
   allwidgets.ru: свои стили поверх замороженного elementor.css.

   elementor.css сгенерирован из CSS прежнего сайта и руками не правится.
   Всё, что сайту понадобилось сверх него, живёт здесь: шрифты с собственного
   домена, состояния, которые раньше ставили скрипты Elementor и SmartMenus
   (подменю, мобильное меню, оглавление, липкая колонка статьи), и просмотр
   скриншотов.
   ========================================================================== */

/* --- Шрифты -----------------------------------------------------------------
   Прежде шли с Google Fonts. Теперь свои файлы: без внешнего запроса на
   каждой странице и без передачи IP посетителя в Google. Оба семейства
   переменные (один файл на все начертания), поэтому диапазон весов.
   ⚠ Имена файлов обязаны совпадать с preload в inc/layout.php. */

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 100 900;
    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: 100 900;
    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;
}
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/montserrat-italic-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: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/montserrat-italic-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: 'Exo 2';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/exo2-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Exo 2';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/exo2-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: 'Exo 2';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/exo2-italic-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Exo 2';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/exo2-italic-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;
}

/* Иконочный шрифт Linearicons (загружен в Elementor как свой набор иконок):
   бургер в шапке, галочки в списках, пара иконок в блоках. block: пока
   шрифт не пришёл, вместо иконки пусто, а не символ из чужого шрифта. */
@font-face {
    font-family: 'Linearicons-Free';
    font-style: normal;
    font-weight: normal;
    font-display: block;
    src: url('../fonts/linearicons-free.woff2') format('woff2'),
         url('../fonts/linearicons-free.woff') format('woff');
}

/* --- Меню шапки (замена SmartMenus) -----------------------------------------
   Подменю открывает site.js классом highlighted на ссылке-родителе. Размеры и
   положение: то, что SmartMenus писал подменю в атрибут style. */

.elementor-nav-menu a.highlighted + .sub-menu {
    display: block;
}
.elementor-nav-menu--main .elementor-nav-menu > li > .sub-menu {
    width: auto;
    min-width: 10em;
    max-width: 1000px;
    top: auto;
    left: 0;
    margin-left: 0;
    margin-top: 0;
}
.elementor-nav-menu--main .sm-nowrap > li > a {
    white-space: nowrap;
}
/* Закрытие подменю шапки: затухание 200 мс, как у SmartMenus. */
.elementor-nav-menu--main .sub-menu.aw-fading {
    opacity: 0;
    transition: opacity .2s;
}
/* Пункт «Виджеты» без адреса: курсор как у ссылки (SmartMenus вешал обработчик). */
.elementor-nav-menu a.has-submenu {
    cursor: pointer;
}

/* --- Мобильное меню (попап Elementor 1922) ----------------------------------
   ⚠ `.elementor-popup-modal { display: flex }` из Elementor перебивает
   атрибут hidden: прячем явно. Анимация входа slideInRight и выход ею же в
   обратную сторону (класс reverse), как у Elementor. */

.elementor-popup-modal[hidden] {
    display: none !important;
}
/* Без скрипта бургер ведёт на #elementor-popup-modal-1922: меню открывается
   переходом по якорю, крестик (href="#") его закрывает. Как только скрипт
   запустился (класс aw-js), окном управляет он: иначе :target держал бы меню
   открытым мимо него. */
html:not(.aw-js) .elementor-popup-modal:target {
    display: flex !important;
}
.elementor-popup-modal.aw-closing,
.elementor-popup-modal.aw-closing * {
    pointer-events: none !important;
}
.elementor-popup-modal .dialog-close-button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

/* --- Статья -----------------------------------------------------------------
   Колонка «Рубрика / Опубликовано / Изменено» слева от текста липнет к верху
   экрана на десктопе. На прежнем сайте это делал скрипт The Plus
   (topSpacing 20, только desktop) и писал колонке align-self: flex-start в
   style: без этого колонка тянется на всю высоту ряда (правило
   .elementor-element { align-self: var(--align-self) } идёт позже и
   перебивает такое же у The Plus) и липнуть ей некуда. */

@media (min-width: 1025px) {
    .plus-sticky-column-sticky {
        position: sticky;
        top: 20px;
        align-self: flex-start;
    }
}

/* Хлебные крошки (статьи, рубрики, служебные страницы): стрелка между
   звеньями. Размер, цвет (#95A1AB) и отступ 12 px слева задал ещё дизайн
   Elementor у ::before, но иконка была из шрифта iconsmind, который на сайт
   не подключался, и стрелок не было видно. Здесь та же стрелка маской SVG:
   красится цветом из того правила, рисуется только в области содержимого
   (у ::before там есть padding). 1.25em от заданных 8px = 10px. */
.pt_plus_breadcrumbs_bar #breadcrumbs i.bread-sep-icon::before {
    content: "";
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    background-color: currentColor;
    background-clip: content-box;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h17M14 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat content-box;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h17M14 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat content-box;
}

/* «Поделиться»: у Elementor это были div, здесь ссылки. */
a.elementor-share-btn,
a.elementor-share-btn:hover,
a.elementor-share-btn:focus {
    text-decoration: none;
}

/* Карточки-ссылки (The Plus «ссылка на колонку») ведут по щелчку в любом
   месте карточки; курсор задан в разметке. */
[data-tp-sc-link]:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* --- Лайтбокс скриншотов ----------------------------------------------------
   Замена лайтбокса Elementor (любая ссылка на картинку в статьях). Размеры и
   цвета из его стилей: затемнение .8, поля 70 px (на телефоне только сверху
   и снизу), крестик 20 px, подпись 16 px внизу. */

html.aw-noscroll,
html.aw-noscroll body {
    overflow: hidden;
}
.aw-lb {
    position: fixed;
    inset: 0;
    z-index: 10001;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .8);
    padding: 70px;
    box-sizing: border-box;
    color: hsla(0, 0%, 93%, .9);
}
.aw-lb[hidden] {
    display: none;
}
.aw-lb__img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 2px;
    box-shadow: 0 0 30px rgba(0, 0, 0, .3), 0 0 8px -5px rgba(0, 0, 0, .3);
}
/* Специфичность (0,3,0): сброс темы Hello красит [type=button]:hover и
   :focus в #c36 с правилом (0,2,0), а фокус на крестик ставится сразу. */
.aw-lb .aw-lb__close,
.aw-lb .aw-lb__close:hover,
.aw-lb .aw-lb__close:focus {
    position: absolute;
    top: 0;
    right: .75em;
    margin-top: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    padding: .25em;
    background: none;
    box-shadow: none;
    transition: none;
    color: hsla(0, 0%, 93%, .9);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}
.aw-lb .aw-lb__close:hover {
    color: #fff;
}
.aw-lb .aw-lb__close:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
/* Специфичность (0,2,0): у набора Elementor .elementor-kit-13 p даёт абзацам
   нижний отступ 1.5em (0,1,1). */
.aw-lb .aw-lb__title {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: hsla(0, 0%, 93%, .9);
}
.aw-lb .aw-lb__title:empty {
    display: none;
}
@media (max-width: 767px) {
    .aw-lb { padding: 70px 0; }
}
