/*
Theme Name: Bizmaster Child
Theme URL: https://wpcoders.in/bizmaster/
Description: Bizmaster Digital Agency WordPress Theme
Author: wpcodersthemes
Author URI: https://themeforest.net/user/wpcodersthemes
Template: bizmaster
Version: 1.0.4
License: GNU General Public License v2 or later
License URL: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: bizmaster-child
*/

/* ============ Русская типографика ============ */
/* Тема капитализирует каждое слово (text-transform: capitalize).
   Для английского это норма, для русского — ошибка: «Полезные Статьи».
   Отключаем везде, кроме случаев, где капитализация задана осознанно. */
.navbar-area .custom-container .navbar-collapse .navbar-nav li,
.navbar-area .custom-container .navbar-collapse .navbar-nav li a,
.navbar-area .custom-container .nav-right-content ul li.nav-btn .btn-boxed,
.theme-section-title .title,
.breadcrumb-wrap .page-title,
.widget .widget-headline,
.theme-recent-post-wrap li.theme-recent-post-item .content .author a,
.wp-block-search__label,
.no-results.not-found .page-title,
h1, h2, h3, h4, h5, h6,
.global-btn,
.theme-btn{
    text-transform: none;
}

/* ============ Логотип ============ */
/* Слот под лого — 190x60. Задаём обе стороны и object-fit: contain,
   чтобы знак вписался целиком и не растянулся при смене файла.
   max-width снимаем — иначе тема ужимает картинку до нечитаемой. */
.logo-wrapper .custom-logo,
.logo-wrapper .site-logo img,
.navbar-area .logo-wrapper img{
    width: 190px;
    height: 60px;
    max-width: none;
    object-fit: contain;
    object-position: left center;
}
@media (max-width: 991px){
    .logo-wrapper .custom-logo,
    .logo-wrapper .site-logo img,
    .navbar-area .logo-wrapper img{ width: 150px; height: 48px; }
}

/* ============ Индикатор выпадающего меню ============ */
/* В теме «плюс» собран из двух полосок: :before — вертикальная, :after — горизонтальная.
   Селектор темы очень специфичный (.navbar.navbar-area.navbar-expand-lg.navigation-style-01
   .navbar-default ...), поэтому повторяем его целиком — иначе её height/width/background
   перебивают наши правила и вместо треугольника остаётся чёрточка. */
.navbar.navbar-area.navbar-expand-lg.navigation-style-01.navbar-default .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children:before{
    display: none;
}
.navbar.navbar-area.navbar-expand-lg.navigation-style-01.navbar-default .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children:after{
    content: "";
    position: absolute;
    right: 2px;
    top: 50%;
    height: 0;
    width: 0;
    background: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid var(--heading-color);
    transform: translateY(-50%);
    transition: transform .25s ease-in, border-top-color .25s ease-in;
    z-index: 1;
}
.navbar.navbar-area.navbar-expand-lg.navigation-style-01.navbar-default .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children:hover:after{
    /* Тема на наведение заливает :after фоном. У треугольника боковые границы
       прозрачные, фон проступает сквозь них — и вместо стрелки виден квадрат.
       Поэтому фон гасим и здесь, меняем только цвет и поворот. */
    background: none;
    transform: translateY(-50%) rotate(180deg);
    border-top-color: var(--main-color-one);
}
/* внутри выпадающего списка треугольник поменьше и ближе к краю */
.navbar.navbar-area.navbar-expand-lg.navigation-style-01.navbar-default .custom-container .navbar-collapse .navbar-nav .sub-menu li.menu-item-has-children:after{
    right: 14px;
    border-left-width: 3.5px;
    border-right-width: 3.5px;
    border-top-width: 4.5px;
}

/* ============ Шрифт Ubuntu ============ */
/* Тема держит всю типографику на трёх переменных — переопределяем их,
   этого достаточно, чтобы шрифт сменился по всему сайту.
   Файлы шрифта лежат локально в /fonts, внешних запросов нет. */
:root{
    --heading-font: "Ubuntu", sans-serif;
    --secondary-font: "Ubuntu", sans-serif;
    --body-font: "Ubuntu", sans-serif;
}
/* Elementor задаёт свою типографику отдельно от переменных темы */
.elementor-widget-container,
.elementor-widget-container h1, .elementor-widget-container h2,
.elementor-widget-container h3, .elementor-widget-container h4,
.elementor-widget-container h5, .elementor-widget-container h6,
.elementor-widget-container p, .elementor-widget-container li,
.elementor-widget-container a, .elementor-widget-container span{
    font-family: "Ubuntu", sans-serif;
}

/* ============ Выпадающее меню: направление и длинные пункты ============ */
/* Тема раскрывала вложенный уровень влево (left: -240px) — он уезжал
   за пределы родителя и налезал на соседние пункты. Открываем вправо. */
.navbar-area .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu{
    left: 100%;
    right: auto;
    top: 0;
}
/* третий уровень и глубже — тоже вправо */
.navbar-area .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu .sub-menu .sub-menu{
    left: 100%;
    right: auto;
}

/* Длинные названия («Сканирование плёнок и слайдов») не влезали в колонку
   и лезли на стрелку. Ограничиваем ширину и обрезаем многоточием. */
.navbar-area .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu{
    min-width: 260px;
    max-width: 300px;
}
.navbar-area .custom-container .navbar-collapse .navbar-nav li.menu-item-has-children .sub-menu li > a{
    display: block;
    max-width: 100%;
    padding-right: 26px;      /* место под стрелку у пунктов с вложением */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ============ Бежевая палитра ============ */
/* В теме ДВА независимых набора переменных:
     main-style.css — --main-color-one, --heading-color, --paragraph-color
                      (ими управляют настройки темы, там уже бежевые)
     master.css     — --theme-color, --title-color, --smoke-color и т.д.
                      именно они красят кнопки, подложки и большинство блоков
   Второй набор настройками не управляется, поэтому задаём его здесь. */
:root{
    --theme-color: #A98552;      /* акцент: приглушённое золото-беж */
    --theme-color2: #E4D2B0;     /* светлый акцент вместо лайма */
    --title-color: #2B2620;      /* заголовки: тёплый почти-чёрный */
    --body-color: #5A5148;       /* текст: тёплый серо-коричневый */
    --smoke-color: #F6F1E8;      /* основная светлая подложка: крем */
    --smoke-color2: #FAF6EF;
    --smoke-color3: #F7F3EB;
    --smoke-color4: #F4EFE6;
    --smoke-color5: #F1EBE0;
    --black-color: #1F1B16;
    --gray-color: #2B2620;
    --light-color: #A79C8D;
    --yellow-color: #C9A227;
    --border-color: #E6DDCE;
}

/* Кнопки: белый текст на бежевом читается плохо — берём тёмный */
.global-btn,
.global-btn:hover,
.theme-btn,
.btn-boxed,
.wp-block-button__link,
input[type="submit"]{
    color: #2B2620;
}

/* ============ Декор героя ============ */
/* Часть фигур в master.css залита цветом напрямую, мимо переменных:
   лаймовый треугольник (#C4F500) и бирюзовая рамка (#196164). */
.hero-1 .hero-image-wrapp .hero-shape4{
    background: #E4D2B0;
}
.hero-1 .hero-image-wrapp .hero-shape5{
    border-color: #C7B499;
}

/* ============ Иконки в карточках героя ============ */
/* Иконки Lucide (лицензия ISC) в фирменном золоте-беж.
   Ставим фоном: Icons_Manager в Elementor 4.x отрисовывает иконку этого
   виджета непредсказуемо, а свою вставку он перекрывает своей же. */
.hero-card_icon{
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    margin-bottom: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.hero-card_icon svg{ display: none; }   /* прячем иконку Elementor, чтобы не двоилось */
.hero-card:nth-child(1) .hero-card_icon{ background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNBOTg1NTIiIHN0cm9rZS13aWR0aD0iMS45IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiID4gPHBhdGggZD0iTTE0IDE4VjZhMiAyIDAgMCAwLTItMkg0YTIgMiAwIDAgMC0yIDJ2MTFhMSAxIDAgMCAwIDEgMWgyIiAvPiA8cGF0aCBkPSJNMTUgMThIOSIgLz4gPHBhdGggZD0iTTE5IDE4aDJhMSAxIDAgMCAwIDEtMXYtMy42NWExIDEgMCAwIDAtLjIyLS42MjRsLTMuNDgtNC4zNUExIDEgMCAwIDAgMTcuNTIgOEgxNCIgLz4gPGNpcmNsZSBjeD0iMTciIGN5PSIxOCIgcj0iMiIgLz4gPGNpcmNsZSBjeD0iNyIgY3k9IjE4IiByPSIyIiAvPiA8L3N2Zz4="); }
.hero-card:nth-child(2) .hero-card_icon{ background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNBOTg1NTIiIHN0cm9rZS13aWR0aD0iMS45IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiID4gPHBhdGggZD0iTTMgN1Y1YTIgMiAwIDAgMSAyLTJoMiIgLz4gPHBhdGggZD0iTTE3IDNoMmEyIDIgMCAwIDEgMiAydjIiIC8+IDxwYXRoIGQ9Ik0yMSAxN3YyYTIgMiAwIDAgMS0yIDJoLTIiIC8+IDxwYXRoIGQ9Ik03IDIxSDVhMiAyIDAgMCAxLTItMnYtMiIgLz4gPGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMSIgLz4gPHBhdGggZD0iTTE4Ljk0NCAxMi4zM2ExIDEgMCAwIDAgMC0uNjYgNy41IDcuNSAwIDAgMC0xMy44ODggMCAxIDEgMCAwIDAgMCAuNjYgNy41IDcuNSAwIDAgMCAxMy44ODggMCIgLz4gPC9zdmc+"); }
.hero-card{ align-items: flex-start; }

/* ============ Карточки в герое ============ */
/* Подложка и градиент зашиты в master.css мятным и бирюзовым. */
.hero-card_wrapper{
    background: #FBF8F3;      /* светлее прежнего #F3EADC */
}
.hero-card{
    background: transparent;  /* у самих карточек фона нет — только у обёртки */
}
.hero-card_wrapper:before,
.hero-card_wrapper:after{
    /* верхняя кромка была заметно темнее блока — ослабляем заливку */
    background-image: linear-gradient(180deg, rgba(169, 133, 82, 0.16) 0%, rgba(255, 255, 255, 0) 80%);
}

/* ============ Кнопки ============ */
/* Белый текст на светлом беже читается плохо, поэтому фон берём на тон
   темнее — контраст белого к #8F7043 около 4,5:1, это проходит по AA.
   На наведении уходим ещё темнее, но не в чёрный. */
.global-btn,
.global-btn-one,
.theme-btn,
.btn-boxed,
.wp-block-button__link,
input[type="submit"]{
    background-color: #8F7043;
    border-color: #8F7043;
    color: #FFFFFF;
}
.global-btn:hover,
.global-btn-one:hover,
.theme-btn:hover,
.btn-boxed:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover{
    background-color: #6F5836;
    border-color: #6F5836;
    color: #FFFFFF;
}
/* у темы бывает заливка через псевдоэлемент — красим и его */
.global-btn:after,
.global-btn:before,
.global-btn-one:after,
.global-btn-one:before{
    background-color: #6F5836;
}

/* ============ Шрифт в шапке и остальном master.css ============ */
/* У master.css свои переменные шрифтов, отдельные от настроек темы.
   --title-font осталась Inter — её используют 68 правил, включая меню шапки. */
:root{
    --title-font: "Ubuntu", sans-serif;
    --body-font: "Ubuntu", sans-serif;
}
/* меню и элементы шапки — на случай, если правило перебивается */
.main-menu a,
.navbar-area .custom-container .navbar-collapse .navbar-nav li a,
.navbar-area .custom-container .navbar-collapse .navbar-nav .sub-menu li a,
.header-links li,
.header-links span,
.nav-right-content li,
.nav-right-content a{
    font-family: "Ubuntu", sans-serif;
}
/* в теме один блок жёстко на Poppins */
[class*="header"] [class*="shape"],
.hero-style1 .hero-subtitle{
    font-family: "Ubuntu", sans-serif;
}

/* ============ Пункты меню шапки ============ */
/* Повторяем селектор темы целиком, чтобы совпасть по специфичности (0,4,2)
   и перебить её правило порядком подключения. */
.navbar-area .custom-container .navbar-collapse .navbar-nav li a{
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-size: 18px;
}

/* ============ Типографика заголовков ============ */
.hero-title{
    font-weight: 500;
}
.box-title{
    font-size: 24px;
    line-height: 1.417;
    font-weight: 500;
    margin-top: -0.3em;
}
.hero-card .box-title{
    font-size: 20px;
    margin-bottom: 5px;
}
.hero-card_text{
    font-size: 17px;
    margin-bottom: -0.4rem;
    color: var(--body-color);
}

.sec-title.style2{
    font-size: 60px;
    line-height: 70px;
    font-weight: 500;
}
.service-card_title{
    margin-top: -0.2em;
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 21px;
}
.service-card_text{
    font-size: 16.6px;
    font-family: var(--title-font);
    margin-bottom: 18px;
    color: var(--body-color);
}

/* ============ Фото в карточке услуги ============ */
.service-card_img{
    /* Ширину фиксируем: контейнер во флексе растягивался и тянул картинку.
       height: 100% из темы во флекс-строке считается от auto-высоты родителя
       и ломает штатное растягивание — заменяем на align-self: stretch. */
    max-width: 270px;
    min-width: 0;
    flex: 0 0 270px;
    height: auto;
    align-self: stretch;
}
/* Elementor задаёт .elementor img{height:auto} и перебивает правило темы —
   поэтому селектор берём специфичнее (0,3,1). */
.service-card .service-card_img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============ Заголовки секций ============ */
/* Русские заголовки длиннее английских, под которые вёрстан шаблон: на 60px
   они разъезжаются на четыре строки. Расширяем блок и уменьшаем кегль.
   Селектор с тегом (0,2,1) специфичнее правила .sec-title.style2 (0,2,0)
   выше, поэтому перебивает его. */
.title-area,
.title-area.text-center,
.theme-section-title.text-center{
    max-width: 1050px;
    margin-left: auto;
    margin-right: auto;
}
.title-area .sec-title{
    max-width: none;
}
.theme-section-title .title,
h2.sec-title.style2{
    font-size: 40px;
    line-height: 1.22;
}
@media (max-width: 1199px){
    h2.sec-title.style2{ font-size: 34px; }
}
@media (max-width: 767px){
    h2.sec-title.style2{ font-size: 28px; }
}

/* ============ Заголовок блока «о студии» ============ */
.about-content-wrap .sec-title{
    font-size: 48px;
    line-height: 60px;
    font-weight: 500;
    margin-bottom: 30px;
    margin-right: 0;
}

/* ============ Карточки «четыре шага» ============ */
/* В теме карточка — это padding 50/40/44 с маленькой иконкой и номером в строке.
   Перестраиваем: фото занимает верхние ~65% на всю ширину, номер ложится
   поверх карточки в правом нижнем углу. */
.process-card{
    position: relative;
    display: flex;
    flex-direction: column;
    height: 400px;
    padding: 0;
    overflow: hidden;
    border-radius: 20px;
}
/* верхний блок с фото */
.process-card_wrapp{
    position: relative;      /* точка отсчёта для номера — сам блок с фото */
    flex: 0 0 65%;
    display: block;
    margin-bottom: 0;
    min-height: 0;
}
.process-card-icon{
    width: 100%;
    height: 100%;
}
/* селектор с родителем — Elementor задаёт .elementor img{height:auto} */
.process-card .process-card-icon img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
}
/* текст под фото */
.process-card_content{
    flex: 1 1 auto;
    padding: 22px 28px 26px;
}
/* номер поверх карточки */
/* номер лежит в углу фотографии, а не всей карточки */
.process-card_number{
    position: absolute;
    right: 18px;
    bottom: 12px;
    margin: 0;
    z-index: 2;
    font-size: 52px;
    line-height: 1;
    color: #FFFFFF;
    opacity: .9;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .45);
    pointer-events: none;
}

/* ============ Карточки услуг на мобильных ============ */
/* На узких экранах карточка перестраивается в колонку, и фиксированные
   270px по ширине и растяжка по высоте только мешают — отпускаем размеры. */
@media (max-width: 991px){
    .service-card_img{
        max-width: none;
        width: auto;
        height: auto;
        flex: 0 0 auto;
        align-self: auto;
    }
    .service-card .service-card_img img{
        width: 100%;
        height: auto;
        object-fit: cover;
    }
}

/* ============ Кнопки аккордеона в FAQ ============ */
/* Плашка «+» залита лаймом (#C4F500) прямо в master.css, мимо переменных. */
.accordion-card .accordion-button:after{
    background: #E4D2B0;
    color: #2B2620;
}
.accordion-card .accordion-button:not(.collapsed):after{
    background: #A98552;
    color: #FFFFFF;
}

/* ============ Карточка услуги: планшет ============ */
/* Тема на ≤1199px жёстко задаёт height: 300px !important — из-за этого
   картинка не подстраивается под карточку. Снимаем, скругление оставляем. */
@media (max-width: 1199px){
    .service-card .service-card_img{
        height: auto !important;
    }
}