/* Start:/local/css/jur_razdel.css?178362622318164*/
/**
 * Стили страницы /jur_razdel/
 * Подключается через Asset::getInstance()->addCss() только на этой странице.
 * Префикс классов страницы: jur-
 * Глобальные: .btn, .section, .section__title, .container, .checklist, .b-*
 */

/* ═══════════════════════════════════════════════════
   ПРИМИТИВЫ (b-*)
   ═══════════════════════════════════════════════════ */
.b-round      { border-radius: var(--radius-xl); }
.b-shadow     { box-shadow: var(--shadow-md); }
.b-white      { background: var(--color-white); }
.b-blue-light { background: var(--color-bg-blue-light); }

/* ═══════════════════════════════════════════════════
   ОБЩИЕ ПЕРЕМЕННЫЕ СЕКЦИЙ
   ═══════════════════════════════════════════════════ */
.main.jur {
    min-height: 60vh;
    background-color: var(--color-white);
}

.jur-section {
    padding: var(--space-10) 0;
    background: var(--gradient-card-revers);
}

.jur-section--alt {
    background: var(--gradient-card);
}

/* ═══════════════════════════════════════════════════
   1. HERO
   ═══════════════════════════════════════════════════ */
.jur-hero {
    padding: var(--space-8) 0 var(--space-10);
    background: var(--color-white);
}

.jur-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
    align-items: center;
}

.jur-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-blue-mid);
    color: var(--color-blue);
    font-size: var(--fs-sm);
    font-weight: var(--fw-semibold);
    border-radius: var(--radius-full);
    padding: var(--space-1) var(--space-4);
    margin-bottom: var(--space-4);
}

.jur-hero__title {
    font-size: var(--fs-4xl);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
    color: var(--color-text);
    margin: 0 0 var(--space-4);
}

.jur-hero__subtitle {
    font-size: var(--fs-md);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin: 0 0 var(--space-6);
}

.jur-hero__checklist {
    margin-bottom: var(--space-8) !important;
}

.jur-hero__image {
    overflow: hidden;
}

.jur-hero__image img {
    width: 100%;
    height: auto;
    display: block;
}

/* ═══════════════════════════════════════════════════
   2. С ЧЕМ МЫ ПОМОГАЕМ — 6 карточек
   ═══════════════════════════════════════════════════ */
.jur-services__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
    margin-top: var(--space-10);
}

.jur-service-card {
    padding: var(--space-6);
    transition: var(--transition-base);
}

.jur-service-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-3px);
}

.jur-service-card__title {
    font-size: var(--fs-base);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: 0 0 var(--space-2);
}

.jur-service-card__desc {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin: 0;
}

/* ═══════════════════════════════════════════════════
   3. ПОЧЕМУ ВЫБИРАЮТ + ФОРМА
   ═══════════════════════════════════════════════════ */
.jur-why__inner .block {
    padding: var(--space-8);
}
.jur-why__inner .section__title {
    text-align:left;
    margin-bottom: var(--space-8);
}
.jur-why__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10);
    align-items: start;
}

.jur-why__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.jur-why__check {
    display: flex;
    gap: var(--space-4);
    align-items: flex-start;
}

.jur-why__check::before {
    content: '';
    display: inline-block;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%231B6FFF' d='M13.3 3.3a1 1 0 0 1 0 1.4l-6 6a1 1 0 0 1-1.4 0l-3-3a1 1 0 1 1 1.4-1.4L6.6 8.6l5.3-5.3a1 1 0 0 1 1.4 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: var(--space-1);
}

.jur-why__item-title {
    font-size: var(--fs-base);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: 0 0 var(--space-1);
}

.jur-why__item-text {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin: 0;
}

/* Правая колонка — форма/заглушка */
.jur-consult {
    padding: var(--space-8);
    position: relative;
    overflow: hidden;
    background-image: url('/img/jur_razdel_form_bg.jpeg');
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto 100%;
}

.jur-consult__title {
    font-size: var(--fs-xl);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-snug);
    margin: 0 0 var(--space-6);
}

.jur-consult__note {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    margin-top: var(--space-4);
}

/* ═══════════════════════════════════════════════════
   4. ПРАЙС — ценовые блоки
   ═══════════════════════════════════════════════════ */
.jur-pricing {
    padding: var(--space-10) 0;
}

.jur-pricing__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
    margin-top: var(--space-10);
}

.jur-pricing__block {
    padding: var(--space-8) var(--space-8) var(--space-20);
    position: relative;
}

.jur-pricing__block .btn__row {
    position: absolute;
    bottom: 0;
    margin-bottom: var(--space-8);
}

.jur-pricing__block-title {
    font-size: var(--fs-xl);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: 0 0 var(--space-4);
}

.jur-pricing__block-desc {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin: 0 0 var(--space-4);
}

.jur-pricing__list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.jur-pricing__list li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
}

.jur-pricing__list li::before {
    content: '✓';
    color: var(--color-blue);
    font-weight: var(--fw-bold);
    flex-shrink: 0;
    margin-top: 1px;
}

/* Таблица прайса */
.jur-price-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    font-size: var(--fs-sm);
    margin-bottom: var(--space-6);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-blue-mid);
}

.jur-price-table thead th {
    background: var(--color-blue-mid);
    color: var(--color-text);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: var(--space-3) var(--space-4);
    text-align: left;
    border-bottom: 2px solid var(--color-border-light);
}

.jur-price-table tbody tr {
    border-bottom: 1px solid var(--color-border-light);
    transition: var(--transition-fast);
}

.jur-price-table tbody tr:last-child {
    border-bottom: none;
}

.jur-price-table tbody tr:hover {
    background: var(--color-bg-blue-light);
}

.jur-price-table td {
    padding: var(--space-3) var(--space-4);
    color: var(--color-text);
    line-height: var(--lh-relaxed);
    vertical-align: top;
}

.jur-price-table td:nth-child(2) {
    font-weight: var(--fw-semibold);
    white-space: nowrap;
}

.jur-price-table--3col td:nth-child(3) {
    color: var(--color-text-muted);
    font-weight: var(--fw-normal);
    white-space: nowrap;
}

/* Блок на всю ширину (когда нечётный) */
.jur-pricing__block--full {
    grid-column: 1 / -1;
}

/* ═══════════════════════════════════════════════════
   8. ПОЛЕЗНЫЕ МАТЕРИАЛЫ
   ═══════════════════════════════════════════════════ */
.jur-materials__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
    margin-top: var(--space-10);
}

.jur-material-card {
    padding: var(--space-6);
    transition: var(--transition-base);
}

.jur-material-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-3px);
}

.jur-material-card__icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.advantages__top {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
}

.jur-material-card__icon .icon {
    width: 28px;
    height: 28px;
    fill: currentColor;
}

.jur-material-card__title {
    font-size: var(--fs-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: 0 0 var(--space-2) var(--space-4);
}

.jur-material-card__text {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
    margin: 0;
}

/* ═══════════════════════════════════════════════════
   5. МЫ НА СВЯЗИ
   ═══════════════════════════════════════════════════ */
.jur-contact {
    padding: var(--space-2) 0 var(--space-10);
}

.jur-contact__inner {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding: var(--space-4);
    margin: 0 var(--space-24);
}

.jur-contact__icon {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    background: var(--color-blue-mid);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-blue);
}

.jur-contact__title {
    font-size: var(--fs-lg);
    font-weight: var(--fw-semibold);
    margin: 0 0 var(--space-1);
}

.jur-contact__text {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.jur-contact__text a {
    color: var(--color-blue);
    font-weight: var(--fw-medium);
}

/* ═══════════════════════════════════════════════════
   6. ОТЗЫВЫ ПРЕДСЕДАТЕЛЕЙ (слайдер)
   ═══════════════════════════════════════════════════ */
.buh-section__title {
    font-size: var(--fs-2xl);
    font-weight: var(--fw-bold);
    color: var(--color-text);
    margin: 0 0 var(--space-8);
    text-align: center;
}

.jur-review-card {
    background: var(--color-white);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    height: 100%;
    position: relative;
}

.jur-review-card__quote {
    font-size: 3rem;
    line-height: 1;
    color: var(--color-blue);
    font-family: Georgia, serif;
    margin-bottom: calc(-1 * var(--space-2));
}

.jur-review-card__text {
    font-size: var(--fs-sm);
    color: var(--color-text);
    line-height: var(--lh-relaxed);
    margin: 0;
    flex: 1;
}

.jur-review-card__author {
    font-size: var(--fs-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: var(--space-2) 0 0;
}

.jur-review-card__snt {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    margin: 0;
}

.jur-review-card__link {
    font-size: var(--fs-xs);
    color: var(--color-blue);
    font-weight: var(--fw-medium);
    text-decoration: none;
    margin-top: var(--space-1);
}

.jur-review-card__link:hover {
    text-decoration: underline;
}

/* ═══════════════════════════════════════════════════
   7. FAQ — аккордеон
   ═══════════════════════════════════════════════════ */
.buh-section {
    padding: var(--space-8) 0;
}

.faq {
    text-align: center;
    margin-bottom: var(--space-10);
}

.buh-faq__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10);
}


@media screen and (max-width: 968px) {
    .jur-hero__inner {
        grid-template-columns: 1fr;
    }

    .jur-hero__image {
        display: none;
    }

    .jur-services__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .jur-why__inner {
        grid-template-columns: 1fr;
    }

    .jur-pricing__grid {
        grid-template-columns: 1fr;
    }

    .jur-materials__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .buh-faq__inner {
        grid-template-columns: 1fr;
        gap: 0;
    }

    /* Убираем большие боковые отступы — на мобиле нет места */
    .jur-contact__inner {
        margin: 0;
    }
}

@media screen and (max-width: 560px) {
    .jur-hero__title {
        font-size: var(--fs-3xl);
    }

    .jur-services__grid {
        grid-template-columns: 1fr;
    }

    .jur-materials__grid {
        grid-template-columns: 1fr;
    }

    .jur-pricing__block--full {
        grid-column: 1;
    }
}

/* ═══════════════════════════════════════════════════
   ТАБЛИЦЫ ПРАЙСА — мобильный вид (карточки)
   ═══════════════════════════════════════════════════ */
@media screen and (max-width: 640px) {
    /* Убираем горизонтальный скролл — превращаем таблицу в блоки */
    .jur-price-table,
    .jur-price-table tbody,
    .jur-price-table tr,
    .jur-price-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    /* Шапка скрыта — метки показываем через ::before */
    .jur-price-table thead {
        display: none;
    }

    /* Сама таблица — убираем рамку и скругление */
    .jur-price-table {
        border: none;
        border-radius: 0;
        margin-bottom: var(--space-4);
    }

    /* Каждая строка — карточка */
    .jur-price-table tbody tr {
        border: 1px solid var(--color-blue-mid);
        border-radius: var(--radius-md);
        margin-bottom: var(--space-3);
        padding: var(--space-3) var(--space-4);
        background: var(--color-white);
        transition: none;
    }

    .jur-price-table tbody tr:last-child {
        border-bottom: 1px solid var(--color-blue-mid);
        margin-bottom: 0;
    }

    /* Сбрасываем td */
    .jur-price-table td {
        padding: var(--space-1) 0;
        white-space: normal;
        vertical-align: top;
    }

    /* Услуга — основной текст, отделяем снизу */
    .jur-price-table td:nth-child(1) {
        font-size: var(--fs-sm);
        color: var(--color-text);
        padding-bottom: var(--space-2);
        margin-bottom: var(--space-2);
        border-bottom: 1px solid var(--color-border-light);
    }

    /* Стоимость — метка + значение */
    .jur-price-table td:nth-child(2) {
        white-space: normal;
        font-weight: var(--fw-semibold);
        color: var(--color-blue);
        display: flex;
        gap: var(--space-2);
        align-items: baseline;
    }

    .jur-price-table td:nth-child(2)::before {
        content: 'Стоимость:';
        font-weight: var(--fw-normal);
        color: var(--color-text-muted);
        font-size: var(--fs-xs);
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* Срок (только 3-колоночные) */
    .jur-price-table--3col td:nth-child(3) {
        white-space: normal;
        font-weight: var(--fw-normal);
        color: var(--color-text-muted);
        display: flex;
        gap: var(--space-2);
        align-items: baseline;
    }

    .jur-price-table--3col td:nth-child(3)::before {
        content: 'Срок:';
        color: var(--color-text-muted);
        font-size: var(--fs-xs);
        white-space: nowrap;
        flex-shrink: 0;
    }
}

/* End */


/* Start:/local/templates/main_site/css/accordion.css?17836262232997*/
/**
 * Accordion — переиспользуемый CSS-аккордеон на базе <details>/<summary>.
 * Без JavaScript. Анимация через grid-template-rows.
 *
 * Использование:
 *   Asset::getInstance()->addCss(SITE_TEMPLATE_PATH . '/css/accordion.css');
 *
 * Разметка:
 *   <div class="accordion">
 *     <details class="accordion__item">
 *       <summary class="accordion__question">Вопрос</summary>
 *       <div class="accordion__body">
 *         <div class="accordion__inner">Ответ...</div>
 *       </div>
 *     </details>
 *   </div>
 */

/* ─── Обёртка ─── */
.accordion {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ─── Элемент ─── */
.accordion__item {
    border-bottom: 1px solid var(--color-border-light);
}

.accordion__item:first-child {
    border-top: 1px solid var(--color-border-light);
}

/* Убираем стандартный маркер браузера */
.accordion__item summary {
    list-style: none;
}
.accordion__item summary::-webkit-details-marker {
    display: none;
}

/* ─── Вопрос (заголовок) ─── */
.accordion__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-6) 0;
    font-family: var(--font-body);
    font-size: var(--fs-base);
    font-weight: var(--fw-medium);
    color: var(--color-text);
    cursor: pointer;
    user-select: none;
    transition: color var(--transition-fast);
}

.accordion__question:hover {
    color: var(--color-blue);
}

/* Иконка «+» / «×» через CSS */
.accordion__question::after {
    content: '';
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 4v12M4 10h12' stroke='%231B6FFF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    transition: transform var(--transition-base);
}

.accordion__item[open] > .accordion__question::after {
    transform: rotate(45deg);
}

/* ─── Тело (ответ) — анимация через grid ─── */
.accordion__body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--transition-base);
    overflow: hidden;
}

.accordion__item[open] > .accordion__body {
    grid-template-rows: 1fr;
}

.accordion__inner {
    overflow: hidden;
    padding-bottom: var(--space-6);
    font-size: var(--fs-base);
    line-height: var(--lh-relaxed);
    color: var(--color-text-muted);
}

/* ─── Мобильная адаптация ─── */
@media (max-width: 768px) {
    .accordion__question {
        font-size: var(--fs-sm);
        padding: var(--space-5) 0;
    }

    .accordion__inner {
        font-size: var(--fs-sm);
    }
}

/* End */


/* Start:/local/templates/main_site/css/slider.css?17836262232334*/
/**
 * Slider — стили для нативного слайдера.
 * Файл: local/templates/main_site/css/slider.css
 */

/* ─── Обёртка ─── */
.slider {
    position: relative;
}

/* ─── Viewport — клипает трек ─── */
.slider__viewport {
    overflow: hidden;
    width: 100%;
}

/* ─── Трек ─── */
.slider__track {
    display: flex;
    /* transform управляется JS */
}

/* ─── Слайд ─── */
.slider__slide {
    flex-shrink: 0;
    /* width задаётся JS в пикселях: viewport.offsetWidth / visible */
    box-sizing: border-box;
    padding: var(--space-3);
}

/* ─── Кнопки пред/след ─── */
.slider__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: none;
    background: var(--color-white);
    box-shadow: var(--shadow-md);
    color: var(--color-blue);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-fast);
    z-index: 2;
}

.slider__btn:hover:not(:disabled) {
    background: var(--color-blue);
    color: var(--color-white);
}

.slider__btn:disabled {
    opacity: 0.3;
    cursor: default;
}

.slider__btn--prev { left: -8px; }
.slider__btn--next { right: -8px; }

/* ─── Точки ─── */
.slider__dots {
    display: flex;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
}

.slider__dot {
    width: 8px;
    height: 8px;
    border-radius: var(--radius-full);
    border: none;
    background: var(--color-border-light);
    cursor: pointer;
    padding: 0;
    transition: var(--transition-fast);
}

.slider__dot--active {
    background: var(--color-blue);
    width: 20px;
    border-radius: 4px;
}

/* ─── Адаптация ─── */
@media (max-width: 968px) {
    .slider__btn--prev { left: 0; }
    .slider__btn--next { right: 0; }
}

@media (max-width: 560px) {
    .slider__btn { display: none; }

    /* Переопределяем JS-ширину: 1 слайд на всю ширину */
    .slider__slide {
        width: 100% !important;
        min-width: 100%;
    }
}

/* End */
/* /local/css/jur_razdel.css?178362622318164 */
/* /local/templates/main_site/css/accordion.css?17836262232997 */
/* /local/templates/main_site/css/slider.css?17836262232334 */