/* ==========================================================================
   21Рехаб — шаблон услуги «Taiga»: стили страницы
   ГЕНЕРИРУЕМЫЙ ФАЙЛ. Не править вручную.

   Источник:  assets/css/src-taiga/{tokens,taiga,page}.css
   Сборка:    node tools/scope-css-service.mjs

   Все селекторы заскоуплены под .svc-taiga, чтобы reset и типографика
   Taiga UI не задевали header.php / footer.php темы. Тёмная палитра
   включается атрибутом .svc-taiga[data-tui-theme="dark"] — его ставит
   assets/js/service-taiga.js.
   ========================================================================== */

/* ===== tokens.css ======================================================== */
/* ==========================================================================
   Taiga UI — design tokens
   Ported 1:1 from taiga-ui/projects/styles/mixins/theme/{variables,palette}.less
   (v5.17.0). Brand accents are remapped to 21Rehab colours taken from the
   donor page; every other token keeps its upstream value.
   ========================================================================== */
.svc-taiga {
    /* ------------------------------- Fonts -------------------------------- */
    --tui-typography-family-text: 'Manrope', system-ui, sans-serif;
    --tui-typography-family-display: 'Manrope', system-ui, sans-serif;
    --tui-font-offset: calc(var(--t-font-offset, 0) * 1px);
    --tui-font-scale: calc((22 + var(--t-font-offset, 0)) / 22);

    /* ------------------------------ Headings ------------------------------ */
    --tui-typography-heading-h1: bold calc(var(--tui-font-offset) + 3.125rem) / calc(56 / 50) var(--tui-typography-family-display);
    --tui-typography-heading-h2: bold calc(var(--tui-font-offset) + 2.75rem) / calc(48 / 44) var(--tui-typography-family-display);
    --tui-typography-heading-h3: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-typography-family-display);
    --tui-typography-heading-h4: bold calc(var(--tui-font-offset) + 1.75rem) / calc(32 / 28) var(--tui-typography-family-display);
    --tui-typography-heading-h5: bold calc(var(--tui-font-offset) + 1.5rem) / calc(28 / 24) var(--tui-typography-family-display);
    --tui-typography-heading-h6: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-typography-family-display);

    /* -------------------------------- Body -------------------------------- */
    --tui-typography-body-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-typography-family-text);
    --tui-typography-body-m: normal calc(var(--tui-font-offset) + 1rem) / calc(24 / 16) var(--tui-typography-family-text);
    --tui-typography-body-s: normal calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-typography-family-text);
    --tui-typography-body-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(16 / 12) var(--tui-typography-family-text);

    /* ------------------------------ Reduced ------------------------------- */
    --tui-typography-ui-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-typography-family-text);
    --tui-typography-ui-m: normal calc(var(--tui-font-offset) + 1rem) / calc(20 / 16) var(--tui-typography-family-text);
    --tui-typography-ui-s: normal calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-typography-family-text);
    --tui-typography-ui-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-typography-family-text);
    --tui-typography-ui-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(12 / 11) var(--tui-typography-family-text);

    /* -------------------------------- Radii ------------------------------- */
    --tui-radius-xs: 0.25rem;
    --tui-radius-s: 0.5rem;
    --tui-radius-m: 0.625rem;
    --tui-radius-l: 0.75rem;
    --tui-radius-xl: 1.5rem;

    /* -------------------------------- Sizes ------------------------------- */
    --tui-height-xs: 1.5rem;
    --tui-height-s: 2rem;
    --tui-height-m: 2.75rem;
    --tui-height-l: 3.5rem;

    --tui-padding-s: 0.625rem;
    --tui-padding-m: 0.75rem;
    --tui-padding-l: 1rem;

    /* -------------------------------- Misc -------------------------------- */
    --tui-stroke-width: 0.125rem;
    --tui-duration: 0.3s;
    --tui-disabled-opacity: 0.56;
    --tui-lh: 1.4em;
    --tui-inline-start: left;
    --tui-inline-end: right;
    --tui-inline: 1;

    --tui-duration-slowest: calc(var(--tui-duration) / 0.429);
    --tui-duration-slow: calc(var(--tui-duration) / 0.6);
    --tui-duration-fast: calc(var(--tui-duration) / 2);
    --tui-duration-fastest: calc(var(--tui-duration) / 4);
}

@supports (font-size: 1lh) {

    .svc-taiga {
        --tui-lh: 1lh;
    }

}

/* ==========================================================================
   Light theme (default)
   ========================================================================== */
.svc-taiga {
    /* --------------------------- 21Rehab brand ---------------------------- */
    --brand-primary: #2b7094;
    /* deep medical blue — donor #2B7094      */
    --brand-accent: #d53646;
    /* CTA red — как в page-na-dom (--red)    */
    --brand-accent-hover: #e14c5b;
    --brand-accent-pressed: #bd2c3a;
    /* донорский --red-dark                 */
    --brand-accent-light: #ff5f6d;
    /* акцентный текст на тёмном фоне: #d53646
                                      даёт лишь 2.9:1 к navy, этот — 4.6:1  */
    --brand-emergency: var(--brand-accent);
    --brand-sky: #5fa8d3;
    /* light blue — donor #5FA8D3             */
    --brand-navy: #1f3a5f;
    /* dark surface — donor #1F3A5F           */
    --brand-navy-deep: #142942;

    /* ----------------------------- Backgrounds ---------------------------- */
    --tui-background-base: #fff;
    --tui-background-base-alt: #f5f8fa;
    --tui-background-neutral-1: rgba(31, 58, 95, 0.05);
    --tui-background-neutral-1-hover: rgba(31, 58, 95, 0.09);
    --tui-background-neutral-1-pressed: rgba(31, 58, 95, 0.13);
    --tui-background-neutral-2: rgba(31, 58, 95, 0.09);
    --tui-background-neutral-2-hover: rgba(31, 58, 95, 0.11);
    --tui-background-neutral-2-pressed: rgba(31, 58, 95, 0.15);
    --tui-background-accent-1: var(--brand-primary);
    --tui-background-accent-1-hover: #35819f;
    --tui-background-accent-1-pressed: #1f5670;
    --tui-background-accent-2: var(--brand-accent);
    --tui-background-accent-2-hover: var(--brand-accent-hover);
    --tui-background-accent-2-pressed: var(--brand-accent-pressed);
    --tui-background-accent-opposite: #1b1f3b;
    --tui-background-accent-opposite-hover: #333;
    --tui-background-accent-opposite-pressed: #808080;
    --tui-background-elevation-1: #fff;
    --tui-background-elevation-2: #fff;
    --tui-background-elevation-3: #fff;

    /* -------------------------------- Other ------------------------------- */
    --tui-service-autofill-background: #fff5c0;
    --tui-service-selection-background: rgba(95, 168, 211, 0.16);
    --tui-service-backdrop: rgba(20, 41, 66, 0.72);
    --tui-border-normal: rgba(31, 58, 95, 0.12);
    --tui-border-hover: rgba(31, 58, 95, 0.2);
    --tui-border-focus: rgba(43, 112, 148, 0.64);

    /* ------------------------------- Statuses ----------------------------- */
    --tui-status-negative: #ff291a;
    --tui-status-negative-pale: rgba(245, 34, 34, 0.08);
    --tui-status-negative-pale-hover: rgba(245, 34, 34, 0.16);
    --tui-status-positive: rgba(74, 201, 155, 1);
    --tui-status-positive-pale: rgba(74, 201, 155, 0.12);
    --tui-status-positive-pale-hover: rgba(74, 201, 155, 0.24);
    --tui-status-warning: rgba(255, 199, 0, 1);
    --tui-status-warning-pale: rgba(255, 199, 0, 0.12);
    --tui-status-warning-pale-hover: rgba(255, 199, 0, 0.24);
    --tui-status-info: rgba(112, 182, 246, 1);
    --tui-status-info-pale: rgba(112, 182, 246, 0.12);
    --tui-status-info-pale-hover: rgba(112, 182, 246, 0.24);
    --tui-status-neutral: rgb(121, 129, 140);

    /* --------------------------------- Text ------------------------------- */
    --tui-text-primary: rgba(27, 31, 59, 1);
    --tui-text-secondary: rgba(27, 31, 59, 0.65);
    --tui-text-tertiary: rgba(27, 31, 59, 0.4);
    --tui-text-primary-on-accent-1: #fff;
    --tui-text-primary-on-accent-2: #fff;
    --tui-text-action: #24657f;
    --tui-text-action-hover: #35819f;
    --tui-text-positive: #3aa981;
    --tui-text-positive-hover: #7ac5aa;
    --tui-text-negative: #ff291a;
    --tui-text-negative-hover: #ff4d4d;

    /* ------------------------------- Shadows ------------------------------ */
    --tui-shadow-small: 0 0.25rem 1.25rem rgba(20, 41, 66, 0.1);
    --tui-shadow-small-hover: 0 1rem 2.5rem rgba(20, 41, 66, 0.14);
    --tui-shadow-medium: 0 0.375rem 2rem rgba(20, 41, 66, 0.12);
    --tui-shadow-medium-hover: 0 1.25rem 4rem rgba(20, 41, 66, 0.18);
    --tui-shadow-popup: 0 1.25rem 3rem rgba(20, 41, 66, 0.2);

    color-scheme: light;
}

/* ==========================================================================
   Dark theme — upstream .tui-theme-dark() with brand accents kept legible
   ========================================================================== */
.svc-taiga[data-tui-theme='dark'] {
    --brand-primary: #4b9dc4;
    --brand-accent: #e2495a;
    --brand-accent-hover: #ef5f70;
    --brand-accent-pressed: #c93a4a;
    --brand-accent-light: #ff7d89;
    --brand-emergency: var(--brand-accent);
    --brand-sky: #7cc0e6;
    --brand-navy: #1b2a3d;
    --brand-navy-deep: #131f2e;

    --tui-background-base: #16202c;
    --tui-background-base-alt: #1c2836;
    --tui-background-neutral-1: rgba(255, 255, 255, 0.08);
    --tui-background-neutral-1-hover: rgba(255, 255, 255, 0.16);
    --tui-background-neutral-1-pressed: rgba(255, 255, 255, 0.24);
    --tui-background-neutral-2: rgba(255, 255, 255, 0.24);
    --tui-background-neutral-2-hover: rgba(255, 255, 255, 0.32);
    --tui-background-neutral-2-pressed: rgba(255, 255, 255, 0.4);
    --tui-background-accent-1: var(--brand-primary);
    --tui-background-accent-1-hover: #5cb0d8;
    --tui-background-accent-1-pressed: #3c86a9;
    --tui-background-accent-2: var(--brand-accent);
    --tui-background-accent-2-hover: var(--brand-accent-hover);
    --tui-background-accent-2-pressed: var(--brand-accent-pressed);
    --tui-background-accent-opposite: #fff;
    --tui-background-accent-opposite-hover: #f6f6f6;
    --tui-background-accent-opposite-pressed: #ededed;
    --tui-background-elevation-1: #1b2634;
    --tui-background-elevation-2: #202d3d;
    --tui-background-elevation-3: #263447;

    --tui-service-autofill-background: rgb(85, 74, 42);
    --tui-service-selection-background: rgba(112, 182, 246, 0.24);
    --tui-service-backdrop: rgba(0, 0, 0, 0.75);
    --tui-border-normal: rgba(255, 255, 255, 0.14);
    --tui-border-hover: rgba(255, 255, 255, 0.6);
    --tui-border-focus: rgba(255, 255, 255, 0.64);

    --tui-status-negative: #ff4d4d;
    --tui-status-negative-pale: rgba(255, 77, 77, 0.24);
    --tui-status-negative-pale-hover: rgba(255, 77, 77, 0.32);
    --tui-status-positive: rgb(74, 201, 155);
    --tui-status-positive-pale: rgba(74, 201, 155, 0.32);
    --tui-status-positive-pale-hover: rgba(74, 201, 155, 0.4);
    --tui-status-warning: rgb(255, 199, 0);
    --tui-status-warning-pale: rgba(255, 199, 0, 0.32);
    --tui-status-warning-pale-hover: rgba(255, 199, 0, 0.4);
    --tui-status-info: rgb(112, 182, 246);
    --tui-status-info-pale: rgba(112, 182, 246, 0.32);
    --tui-status-info-pale-hover: rgba(112, 182, 246, 0.4);
    --tui-status-neutral: rgb(149, 155, 164);

    --tui-text-primary: rgba(255, 255, 255, 1);
    --tui-text-secondary: rgba(255, 255, 255, 0.72);
    --tui-text-tertiary: rgba(255, 255, 255, 0.6);
    --tui-text-primary-on-accent-1: #0f1a24;
    --tui-text-primary-on-accent-2: #fff;
    --tui-text-action: #7cc0e6;
    --tui-text-action-hover: #a3d4ef;
    --tui-text-positive: #44c596;
    --tui-text-positive-hover: #3aa981;
    --tui-text-negative: #ff4d4d;
    --tui-text-negative-hover: #ff6666;

    --tui-shadow-small: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.4);
    --tui-shadow-small-hover: 0 1rem 2.5rem rgba(0, 0, 0, 0.5);
    --tui-shadow-medium: 0 0.375rem 2rem rgba(0, 0, 0, 0.45);
    --tui-shadow-medium-hover: 0 1.25rem 4rem rgba(0, 0, 0, 0.55);
    --tui-shadow-popup: 0 1.25rem 3rem rgba(0, 0, 0, 0.6);

    color-scheme: dark;
}

/* ===== taiga.css ========================================================= */
/* ==========================================================================
   Taiga UI — component layer, ported to plain CSS
   Source: taiga-ui/projects/styles/{components,theme/appearance}/*.less
   Selector contract is kept identical to upstream so markup written against
   Taiga docs works as-is: [tuiButton], [tuiAppearance][data-appearance],
   [tuiBadge], [tuiChip], [tuiNotification], [tuiTitle]/[tuiSubtitle], …
   ========================================================================== */

/* --------------------------------- Reset ---------------------------------- */
.svc-taiga,
.svc-taiga *,
.svc-taiga *::before,
.svc-taiga *::after {
    box-sizing: border-box;
}

.svc-taiga {
    margin: 0;
    background: var(--tui-background-base);
    color: var(--tui-text-primary);
    font: var(--tui-typography-body-m);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.svc-taiga img,
.svc-taiga svg,
.svc-taiga picture,
.svc-taiga video {
    display: block;
    max-inline-size: 100%;
}

/* Component `display` declarations would otherwise beat the attribute. */
.svc-taiga [hidden] {
    display: none !important;
}

.svc-taiga button,
.svc-taiga input,
.svc-taiga select,
.svc-taiga textarea {
    font: inherit;
    color: inherit;
}

.svc-taiga ::selection {
    background: var(--tui-service-selection-background);
}

.svc-taiga :focus-visible {
    outline: 2px solid var(--tui-border-focus);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {

    .svc-taiga,
    .svc-taiga *,
    .svc-taiga *::before,
    .svc-taiga *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

}

/* ------------------------------- Typography ------------------------------- */
.svc-taiga .tui-h1 {
    font: var(--tui-typography-heading-h1);
    margin: 0;
    letter-spacing: -0.02em;
}

.svc-taiga .tui-h2 {
    font: var(--tui-typography-heading-h2);
    margin: 0;
    letter-spacing: -0.015em;
}

.svc-taiga .tui-h3 {
    font: var(--tui-typography-heading-h3);
    margin: 0;
    letter-spacing: -0.01em;
}

.svc-taiga .tui-h4 {
    font: var(--tui-typography-heading-h4);
    margin: 0;
}

.svc-taiga .tui-h5 {
    font: var(--tui-typography-heading-h5);
    margin: 0;
}

.svc-taiga .tui-h6 {
    font: var(--tui-typography-heading-h6);
    margin: 0;
}

.svc-taiga .tui-body-l {
    font: var(--tui-typography-body-l);
}

.svc-taiga .tui-body-m {
    font: var(--tui-typography-body-m);
}

.svc-taiga .tui-body-s {
    font: var(--tui-typography-body-s);
}

.svc-taiga .tui-body-xs {
    font: var(--tui-typography-body-xs);
}

@media (max-width: 60rem) {

    .svc-taiga .tui-h1 {
        font-size: calc(var(--tui-font-offset) + 2.375rem);
        line-height: 1.14;
    }

    .svc-taiga .tui-h2 {
        font-size: calc(var(--tui-font-offset) + 1.875rem);
        line-height: 1.16;
    }

    .svc-taiga .tui-h3 {
        font-size: calc(var(--tui-font-offset) + 1.5rem);
        line-height: 1.2;
    }

    .svc-taiga .tui-h4 {
        font-size: calc(var(--tui-font-offset) + 1.3125rem);
    }

}

@media (max-width: 30rem) {

    .svc-taiga .tui-h1 {
        font-size: calc(var(--tui-font-offset) + 1.875rem);
    }

    .svc-taiga .tui-h2 {
        font-size: calc(var(--tui-font-offset) + 1.5rem);
    }

}

/* ------------------------- Title / Subtitle blocks ------------------------ */
.svc-taiga [tuiTitle] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-inline-size: 0;
}

.svc-taiga [tuiSubtitle] {
    font: var(--tui-typography-body-s);
    font-weight: normal;
    color: var(--tui-text-secondary);
}

/* --------------------------------- Link ----------------------------------- */
.svc-taiga [tuiLink] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--tui-text-action);
    text-decoration: none;
    border-block-end: 1px solid transparent;
    transition: color var(--tui-duration-fast), border-color var(--tui-duration-fast);
    cursor: pointer;
}

.svc-taiga [tuiLink]:hover {
    color: var(--tui-text-action-hover);
    border-block-end-color: currentColor;
}

.svc-taiga [tuiLink][data-appearance='grayscale'] {
    color: var(--tui-text-primary);
}

/* ==========================================================================
   button-base() — shared by Button / Badge / Chip
   ========================================================================== */
.svc-taiga [tuiButton],
.svc-taiga [tuiIconButton],
.svc-taiga [tuiBadge],
.svc-taiga [tuiChip] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: var(--t-gap, 0.25rem);
    box-sizing: border-box;
    margin: 0;
    border: none;
    text-decoration: none;
    white-space: nowrap;
    vertical-align: middle;
    transition:
        background var(--tui-duration-fast),
        color var(--tui-duration-fast),
        box-shadow var(--tui-duration-fast),
        opacity var(--tui-duration-fast),
        transform var(--tui-duration-fast);
    -webkit-appearance: none;
    appearance: none;
}

.svc-taiga [tuiButton]>.tui-icon,
.svc-taiga [tuiIconButton]>.tui-icon,
.svc-taiga [tuiChip]>.tui-icon,
.svc-taiga [tuiBadge]>.tui-icon {
    flex: none;
    margin-block: var(--t-margin, -0.25rem);
}

/* --------------------------------- Button --------------------------------- */
.svc-taiga [tuiButton],
.svc-taiga [tuiIconButton] {
    --t-size: var(--tui-height-l);
    --t-radius: var(--tui-radius-l);
    --t-gap: 0.375rem;
    --t-padding: 0.5rem 1.25rem;
    --t-margin: -0.25rem;

    min-block-size: fit-content;
    block-size: var(--t-size);
    justify-content: center;
    border-radius: var(--t-radius);
    padding: var(--t-padding);
    user-select: none;
    cursor: pointer;
    font: var(--tui-typography-body-m);
    font-weight: bold;
}

.svc-taiga [tuiButton][data-size='xs'] {
    --t-size: var(--tui-height-xs);
    --t-radius: var(--tui-radius-xs);
    --t-gap: 0.125rem;
    --t-padding: 0 0.375rem;
    --t-margin: -0.125rem;

    font: var(--tui-typography-body-s);
    font-weight: bold;
}

.svc-taiga [tuiButton][data-size='s'],
.svc-taiga [tuiIconButton][data-size='s'] {
    --t-size: var(--tui-height-s);
    --t-radius: var(--tui-radius-m);
    --t-gap: 0.25rem;
    --t-padding: 0.125rem 0.625rem;
    --t-margin: -0.125rem;

    font: var(--tui-typography-body-s);
    font-weight: bold;
}

.svc-taiga [tuiButton][data-size='m'],
.svc-taiga [tuiIconButton][data-size='m'] {
    --t-size: var(--tui-height-m);
    --t-radius: var(--tui-radius-m);
    --t-gap: 0.375rem;
    --t-padding: 0.375rem 1rem;
    --t-margin: -0.375rem;

    font: var(--tui-typography-body-m);
    font-weight: bold;
}

.svc-taiga [tuiIconButton] {
    gap: 0;
    inline-size: var(--t-size);
    min-inline-size: var(--t-size);
    padding: 0;
}

.svc-taiga [tuiButton]:disabled,
.svc-taiga [tuiButton][aria-disabled='true'],
.svc-taiga [tuiIconButton]:disabled {
    opacity: var(--tui-disabled-opacity);
    pointer-events: none;
}

.svc-taiga [tuiButton]._loading {
    pointer-events: none;
    color: transparent !important;
}

.svc-taiga [tuiButton]._loading::after {
    content: '';
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    inline-size: 1.125rem;
    block-size: 1.125rem;
    margin: -0.5625rem 0 0 -0.5625rem;
    border: 2px solid currentColor;
    border-block-start-color: transparent;
    border-radius: 50%;
    color: var(--tui-text-primary-on-accent-1);
    animation: tui-spin 0.7s linear infinite;
}

@keyframes tui-spin {
    to {
        transform: rotate(1turn);
    }
}

/* ---------------------------------- Badge --------------------------------- */
.svc-taiga [tuiBadge] {
    --t-icon-size: 1rem;
    --t-padding: 0.5rem;
    --t-size: var(--tui-height-xs);
    --t-margin: -0.25rem;
    --t-gap: 0.25rem;

    border-radius: 6rem;
    justify-content: center;
    background: var(--tui-status-neutral);
    color: var(--tui-background-base);
    padding: 0.0625rem var(--t-padding);
    block-size: var(--t-size);
    min-block-size: calc(var(--tui-lh) + 0.125rem);
    inline-size: fit-content;
    font: var(--tui-typography-ui-s);
    font-weight: 600;
}

.svc-taiga [tuiBadge][data-size='m'] {
    --t-padding: 0.375rem;
    --t-size: 1.25rem;
    --t-icon-size: 0.75rem;
    --t-margin: -0.125rem;
}

.svc-taiga [tuiBadge][data-size='xl'] {
    --t-margin: -0.25rem;
    --t-padding: 0.75rem;
    --t-size: var(--tui-height-s);

    font: var(--tui-typography-ui-m);
    font-weight: 600;
}

/* ---------------------------------- Chip ---------------------------------- */
.svc-taiga [tuiChip] {
    --t-gap: 0.25rem;
    --t-margin: -0.125rem;
    --t-icon-size: 1rem;
    --t-padding: 0.625rem;
    --t-size: var(--tui-height-s);

    font: var(--tui-typography-ui-s);
    font-weight: 500;
    border-radius: var(--tui-radius-m);
    padding: 0.125rem var(--t-padding);
    block-size: var(--t-size);
    min-block-size: calc(var(--tui-lh) + 0.25rem);
    inline-size: fit-content;
    max-inline-size: 100%;
    isolation: isolate;
}

.svc-taiga [tuiChip][data-size='xs'] {
    --t-padding: 0.375rem;
    --t-size: var(--tui-height-xs);

    border-radius: var(--tui-radius-xs);
}

.svc-taiga [tuiChip][data-size='m'] {
    --t-margin: -0.375rem;
    --t-icon-size: 1.5rem;
    --t-padding: 1rem;
    --t-size: var(--tui-height-m);

    font: var(--tui-typography-ui-m);
    font-weight: 500;
}

.svc-taiga a[tuiChip] {
    text-decoration: none;
    cursor: pointer;
}

/* ---------------------------------- Block --------------------------------- */
.svc-taiga [tuiBlock] {
    --t-height: var(--tui-height-l);
    --t-radius: var(--tui-radius-l);

    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--tui-text-primary);
    border-radius: var(--t-radius);
    min-block-size: var(--t-height);
    margin: 0;
    cursor: pointer;
    overflow: hidden;
    font: var(--tui-typography-body-m);
    padding: var(--tui-padding-l);
    isolation: isolate;
}

.svc-taiga [tuiBlock][data-size='m'] {
    --t-height: var(--tui-height-m);
    --t-radius: var(--tui-radius-m);

    gap: 0.625rem;
    font: var(--tui-typography-ui-m);
    padding: var(--tui-padding-m);
}

.svc-taiga [tuiBlock][data-size='s'] {
    --t-height: var(--tui-height-s);
    --t-radius: var(--tui-radius-m);

    gap: 0.5rem;
    font: var(--tui-typography-ui-s);
    padding: 0.5rem;
}

.svc-taiga [tuiBlock] [tuiTitle] {
    flex: 1;
    gap: 0;
    font: inherit;
}

/* ------------------------------ Notification ------------------------------ */
.svc-taiga [tuiNotification] {
    --t-height: var(--tui-height-l);
    --t-offset: calc((var(--t-height) - var(--tui-lh)) / 2);

    position: relative;
    display: flex;
    gap: 0.75rem;
    max-block-size: 100%;
    color: var(--tui-text-primary);
    padding: var(--t-offset) var(--tui-padding-l);
    font: var(--tui-typography-body-m);
    border-radius: var(--tui-radius-l);
    text-align: start;
    text-decoration: none;
}

.svc-taiga [tuiNotification][data-size='m'] {
    --t-height: var(--tui-height-m);

    padding: var(--t-offset) var(--tui-padding-m);
    font: var(--tui-typography-body-s);
    border-radius: var(--tui-radius-m);
}

.svc-taiga [tuiNotification][data-size='s'] {
    --t-height: var(--tui-height-s);

    padding: var(--t-offset) 0.5rem;
    font: var(--tui-typography-body-s);
    border-radius: var(--tui-radius-m);
}

.svc-taiga [tuiNotification]>.tui-icon {
    flex: none;
    margin-block-start: 0.0625rem;
}

.svc-taiga [tuiNotification] [tuiTitle] {
    gap: 0.125rem;
    font: var(--tui-typography-ui-l);
    font-weight: bold;
}

.svc-taiga [tuiNotification] [tuiSubtitle] {
    font: var(--tui-typography-body-m);
    font-weight: normal;
}

/* ==========================================================================
   Appearances — theme/appearance/*.less
   ========================================================================== */
.svc-taiga [tuiAppearance][data-appearance='primary'] {
    --t-bg: var(--tui-background-accent-1);

    background: var(--t-bg);
    color: var(--tui-text-primary-on-accent-1);
}

.svc-taiga [tuiAppearance][data-appearance='primary']:hover {
    --t-bg: var(--tui-background-accent-1-hover);
}

.svc-taiga [tuiAppearance][data-appearance='primary']:active {
    --t-bg: var(--tui-background-accent-1-pressed);
}

.svc-taiga [tuiAppearance][data-appearance='accent'] {
    background: var(--tui-background-accent-2);
    color: var(--tui-text-primary-on-accent-2);
}

.svc-taiga [tuiAppearance][data-appearance='accent']:hover {
    background: var(--tui-background-accent-2-hover);
}

.svc-taiga [tuiAppearance][data-appearance='accent']:active {
    background: var(--tui-background-accent-2-pressed);
}

.svc-taiga [tuiAppearance][data-appearance='primary-destructive'] {
    color: #fff;
    background: var(--brand-emergency);
}

.svc-taiga [tuiAppearance][data-appearance='primary-destructive']:hover {
    filter: saturate(1) brightness(1.12);
}

.svc-taiga [tuiAppearance][data-appearance='primary-destructive']:active {
    filter: saturate(0.9) brightness(0.98);
}

.svc-taiga [tuiAppearance][data-appearance='primary-grayscale'] {
    background: var(--tui-background-accent-opposite);
    color: var(--tui-background-base);
}

.svc-taiga [tuiAppearance][data-appearance='primary-grayscale']:hover {
    background: var(--tui-background-accent-opposite-hover);
}

.svc-taiga [tuiAppearance][data-appearance='secondary'],
.svc-taiga [tuiAppearance][data-appearance='secondary-grayscale'],
.svc-taiga [tuiAppearance][data-appearance='secondary-destructive'] {
    background: var(--tui-background-neutral-1);
    color: var(--tui-text-action);
}

.svc-taiga [tuiAppearance][data-appearance='secondary']:hover,
.svc-taiga [tuiAppearance][data-appearance='secondary-grayscale']:hover,
.svc-taiga [tuiAppearance][data-appearance='secondary-destructive']:hover {
    background: var(--tui-background-neutral-1-hover);
}

.svc-taiga [tuiAppearance][data-appearance='secondary']:active,
.svc-taiga [tuiAppearance][data-appearance='secondary-grayscale']:active,
.svc-taiga [tuiAppearance][data-appearance='secondary-destructive']:active {
    background: var(--tui-background-neutral-1-pressed);
}

.svc-taiga [tuiAppearance][data-appearance='secondary-grayscale'] {
    color: var(--tui-text-primary);
}

.svc-taiga [tuiAppearance][data-appearance='secondary-destructive'] {
    color: var(--tui-text-negative);
}

.svc-taiga [tuiAppearance][data-appearance='outline'],
.svc-taiga [tuiAppearance][data-appearance='outline-grayscale'] {
    --t-bs: var(--tui-border-normal);

    background: transparent;
    color: var(--tui-text-action);
    box-shadow: inset 0 0 0 1px var(--t-bs);
}

.svc-taiga [tuiAppearance][data-appearance='outline-grayscale'] {
    color: var(--tui-text-primary);
}

.svc-taiga [tuiAppearance][data-appearance='outline']:hover,
.svc-taiga [tuiAppearance][data-appearance='outline-grayscale']:hover {
    --t-bs: var(--tui-border-hover);

    cursor: pointer;
}

.svc-taiga [tuiAppearance][data-appearance='outline']:active,
.svc-taiga [tuiAppearance][data-appearance='outline-grayscale']:active {
    --t-bs: var(--tui-border-hover);

    background: var(--tui-background-neutral-1);
}

.svc-taiga [tuiAppearance][data-appearance='flat'],
.svc-taiga [tuiAppearance][data-appearance='flat-grayscale'] {
    background: transparent;
    color: var(--tui-text-action);
}

.svc-taiga [tuiAppearance][data-appearance='flat-grayscale'] {
    color: var(--tui-text-primary);
}

.svc-taiga [tuiAppearance][data-appearance='flat']:hover,
.svc-taiga [tuiAppearance][data-appearance='flat-grayscale']:hover {
    background: var(--tui-background-neutral-1-hover);
}

.svc-taiga [tuiAppearance][data-appearance='flat']:active,
.svc-taiga [tuiAppearance][data-appearance='flat-grayscale']:active {
    background: var(--tui-background-neutral-1-pressed);
}

.svc-taiga [tuiAppearance][data-appearance='floating'] {
    background-color: var(--tui-background-elevation-2);
    color: var(--tui-text-primary);
    box-shadow: var(--tui-shadow-small);
}

.svc-taiga [tuiAppearance][data-appearance='floating']:hover {
    box-shadow: var(--tui-shadow-small-hover);
}

.svc-taiga [tuiAppearance][data-appearance='floating']:active {
    background-color: var(--tui-background-base-alt);
    box-shadow: var(--tui-shadow-small);
}

.svc-taiga [tuiAppearance][data-appearance='icon'] {
    background: transparent;
    color: var(--tui-text-primary);
}

.svc-taiga [tuiAppearance][data-appearance='icon']:hover {
    background: var(--tui-background-neutral-1);
}

/* Status appearances */
.svc-taiga [tuiAppearance][data-appearance='negative'],
.svc-taiga [tuiAppearance][data-appearance='positive'],
.svc-taiga [tuiAppearance][data-appearance='warning'],
.svc-taiga [tuiAppearance][data-appearance='info'],
.svc-taiga [tuiAppearance][data-appearance='neutral'] {
    background: var(--t-bg);
    color: var(--tui-text-primary);
}

.svc-taiga [tuiAppearance][data-appearance='negative'] {
    --t-bg: var(--tui-status-negative-pale);
}

.svc-taiga [tuiAppearance][data-appearance='positive'] {
    --t-bg: var(--tui-status-positive-pale);
}

.svc-taiga [tuiAppearance][data-appearance='warning'] {
    --t-bg: var(--tui-status-warning-pale);
}

.svc-taiga [tuiAppearance][data-appearance='info'] {
    --t-bg: var(--tui-status-info-pale);
}

.svc-taiga [tuiAppearance][data-appearance='neutral'] {
    --t-bg: var(--tui-background-neutral-1);
}

.svc-taiga [tuiAppearance][data-appearance='negative']>.tui-icon {
    color: var(--tui-status-negative);
}

.svc-taiga [tuiAppearance][data-appearance='positive']>.tui-icon {
    color: var(--tui-status-positive);
}

.svc-taiga [tuiAppearance][data-appearance='warning']>.tui-icon {
    color: #b98600;
}

.svc-taiga [tuiAppearance][data-appearance='info']>.tui-icon {
    color: var(--brand-primary);
}

.svc-taiga [tuiAppearance][data-appearance='neutral']>.tui-icon {
    color: var(--tui-status-neutral);
}

.svc-taiga [tuiBadge][data-appearance='negative'] {
    background: var(--tui-status-negative);
    color: #fff;
}

.svc-taiga [tuiBadge][data-appearance='positive'] {
    background: var(--tui-status-positive);
    color: #fff;
}

.svc-taiga [tuiBadge][data-appearance='warning'] {
    background: var(--tui-status-warning);
    color: #2a2200;
}

.svc-taiga [tuiBadge][data-appearance='info'] {
    background: var(--brand-primary);
    color: #fff;
}

.svc-taiga [tuiBadge][data-appearance='primary'] {
    background: var(--tui-background-accent-1);
    color: var(--tui-text-primary-on-accent-1);
}

.svc-taiga [tuiBadge][data-appearance='accent'] {
    background: var(--tui-background-accent-2);
    color: var(--tui-text-primary-on-accent-2);
}

/* ==========================================================================
   Textfield — components/textfield.less + appearance/textfield.less
   ========================================================================== */
.svc-taiga .tui-textfield {
    --t-height: var(--tui-height-l);
    --t-radius: var(--tui-radius-l);
    --t-shadow: 0 0.125rem 0.1875rem rgba(20, 41, 66, 0.1);

    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    inline-size: 100%;
    block-size: var(--t-height);
    padding-inline: var(--tui-padding-l);
    border-radius: var(--t-radius);
    background-color: var(--tui-background-base);
    box-shadow: var(--t-shadow);
    outline: 1px solid var(--tui-border-normal);
    outline-offset: -1px;
    color: var(--tui-text-tertiary);
    transition:
        box-shadow var(--tui-duration-fast),
        background-color var(--tui-duration-fast),
        outline-color var(--tui-duration-fast),
        color var(--tui-duration-fast);
}

.svc-taiga .tui-textfield[data-size='m'] {
    --t-height: var(--tui-height-m);
    --t-radius: var(--tui-radius-m);

    padding-inline: var(--tui-padding-m);
}

.svc-taiga .tui-textfield:hover {
    --t-shadow: 0 0.125rem 0.3125rem rgba(20, 41, 66, 0.16);

    color: var(--tui-text-secondary);
}

.svc-taiga .tui-textfield:focus-within {
    box-shadow: none;
    outline: 0.125rem solid var(--tui-background-accent-1);
    outline-offset: -0.125rem;
}

.svc-taiga .tui-textfield[data-invalid='true'] {
    outline-color: var(--tui-status-negative);
}

.svc-taiga .tui-textfield__input {
    flex: 1;
    min-inline-size: 0;
    border: none;
    background: transparent;
    outline: none;
    color: var(--tui-text-primary);
    font: var(--tui-typography-body-m);
}

.svc-taiga .tui-textfield__input::placeholder {
    color: var(--tui-text-tertiary);
}

.svc-taiga .tui-textfield>.tui-icon {
    flex: none;
    color: var(--tui-text-tertiary);
}

.svc-taiga textarea.tui-textfield {
    --t-height: auto;

    display: block;
    min-block-size: 6rem;
    padding: 0.875rem var(--tui-padding-l);
    color: var(--tui-text-primary);
    font: var(--tui-typography-body-m);
    resize: vertical;
    border: none;
}

.svc-taiga .tui-error {
    display: block;
    margin-block-start: 0.375rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-negative);
}

/* ------------------------------- Checkbox --------------------------------- */
.svc-taiga .tui-checkbox {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
    cursor: pointer;
}

.svc-taiga .tui-checkbox input {
    flex: none;
    inline-size: 1.25rem;
    block-size: 1.25rem;
    margin: 0.0625rem 0 0;
    border-radius: var(--tui-radius-xs);
    border: 1px solid var(--tui-border-hover);
    background: var(--tui-background-base);
    appearance: none;
    cursor: pointer;
    transition: background var(--tui-duration-fast), border-color var(--tui-duration-fast);
}

.svc-taiga .tui-checkbox input:checked {
    background: var(--tui-background-accent-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 0.875rem no-repeat;
    border-color: var(--tui-background-accent-1);
}

/* --------------------------------- Icons ---------------------------------- */
.svc-taiga .tui-icon {
    display: inline-block;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    flex: none;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.svc-taiga .tui-icon--s {
    inline-size: 1rem;
    block-size: 1rem;
}

.svc-taiga .tui-icon--m {
    inline-size: 1.25rem;
    block-size: 1.25rem;
}

.svc-taiga .tui-icon--l {
    inline-size: 2rem;
    block-size: 2rem;
}

.svc-taiga .tui-icon--xl {
    inline-size: 2.5rem;
    block-size: 2.5rem;
}

/* --------------------------------- Avatar --------------------------------- */
.svc-taiga [tuiAvatar] {
    --t-size: 3rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    inline-size: var(--t-size);
    block-size: var(--t-size);
    border-radius: 100%;
    overflow: hidden;
    background: var(--tui-background-neutral-1);
    color: var(--tui-text-secondary);
    font: var(--tui-typography-ui-m);
    font-weight: bold;
    text-transform: uppercase;
}

.svc-taiga [tuiAvatar] img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.svc-taiga [tuiAvatar][data-size='s'] {
    --t-size: 2rem;
    font: var(--tui-typography-ui-s);
}

.svc-taiga [tuiAvatar][data-size='l'] {
    --t-size: 4rem;
    font: var(--tui-typography-heading-h6);
}

/* --------------------------------- Card ----------------------------------- */
.svc-taiga .tui-card {
    background: var(--tui-background-elevation-1);
    border-radius: var(--tui-radius-xl);
    box-shadow: var(--tui-shadow-small);
    padding: 1.5rem;
}

.svc-taiga .tui-card--outline {
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

/* -------------------------------- Utilities ------------------------------- */
.svc-taiga .tui-visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.svc-taiga .tui-space-top-l {
    margin-block-start: 1.5rem;
}

/* ===== page.css ========================================================== */
/* ==========================================================================
   21Rehab — «Нарколог на дом в Москве» page layout
   Built on the Taiga UI token + component layers (tokens.css, taiga.css).
   ========================================================================== */

/* --------------------------------- Layout --------------------------------- */
.svc-taiga .container {
    inline-size: 100%;
    max-inline-size: 75rem;
    margin-inline: auto;
    padding-inline: 1.25rem;
}

.svc-taiga .container--narrow {
    max-inline-size: 52rem;
}

.svc-taiga .section {
    padding-block: 4.5rem;
}

.svc-taiga .section--tight {
    padding-block: 2.5rem;
}

.svc-taiga .section--bg {
    background: var(--tui-background-base-alt);
}

.svc-taiga .section__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-block-end: 2.5rem;
}

.svc-taiga .section__title {
    max-inline-size: 44rem;
}

.svc-taiga .section__lead {
    margin: 0.75rem 0 0;
    font: var(--tui-typography-body-l);
    color: var(--tui-text-secondary);
    max-inline-size: 44rem;
}

.svc-taiga .section__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-block-end: 0.875rem;
    font: var(--tui-typography-ui-s);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--brand-primary);
}

@media (max-width: 48rem) {

    .svc-taiga .section {
        padding-block: 3rem;
    }

    .svc-taiga .section__head {
        margin-block-end: 1.75rem;
    }

}

/* ------------------------------ Reveal on scroll -------------------------- */
.svc-taiga .reveal {
    opacity: 0;
    transform: translateY(1.25rem);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.svc-taiga .reveal.is-visible {
    opacity: 1;
    transform: none;
}

.svc-taiga .reveal--d1 {
    transition-delay: 0.08s;
}

.svc-taiga .reveal--d2 {
    transition-delay: 0.16s;
}

.svc-taiga .reveal--d3 {
    transition-delay: 0.24s;
}

@media (prefers-reduced-motion: reduce) {

    .svc-taiga .reveal {
        opacity: 1;
        transform: none;
    }

}

/* ================================== Header ================================ */
.svc-taiga .topbar {
    background: var(--brand-navy);
    color: rgba(255, 255, 255, 0.78);
    font: var(--tui-typography-body-s);
}

.svc-taiga .topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-block-size: 2.5rem;
}

.svc-taiga .topbar__group {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    min-inline-size: 0;
}

.svc-taiga .topbar__item {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
    white-space: nowrap;
    color: inherit;
    text-decoration: none;
}

.svc-taiga .topbar__item .tui-icon {
    color: var(--brand-sky);
}

.svc-taiga a.topbar__item:hover {
    color: #fff;
}

.svc-taiga .topbar__dot {
    inline-size: 0.5rem;
    block-size: 0.5rem;
    border-radius: 50%;
    background: var(--tui-status-positive);
    box-shadow: 0 0 0 0.25rem rgba(74, 201, 155, 0.24);
}

.svc-taiga .theme-toggle {
    color: rgba(255, 255, 255, 0.72);
}

.svc-taiga .theme-toggle:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.svc-taiga .theme-toggle__off {
    display: none;
}

.svc-taiga[data-tui-theme='dark'] .theme-toggle__on {
    display: none;
}

.svc-taiga[data-tui-theme='dark'] .theme-toggle__off {
    display: block;
}

.svc-taiga .header {
    position: sticky;
    inset-block-start: 0;
    z-index: 60;
    background: var(--tui-background-base);
    border-block-end: 1px solid var(--tui-border-normal);
    transition: box-shadow var(--tui-duration-fast);
}

.svc-taiga .header.is-stuck {
    box-shadow: var(--tui-shadow-small);
}

.svc-taiga .header__inner {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    min-block-size: 4.75rem;
}

.svc-taiga .header__logo {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: inherit;
}

.svc-taiga .header__logo img {
    block-size: 2.75rem;
    inline-size: auto;
}

/* The donor ships two logo files: dark-on-light and the white footer variant. */
.svc-taiga .header__logo-img--dark {
    display: none;
}

.svc-taiga[data-tui-theme='dark'] .header__logo-img--light {
    display: none;
}

.svc-taiga[data-tui-theme='dark'] .header__logo-img--dark {
    display: block;
}

.svc-taiga .header__logo-text {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.svc-taiga .header__logo-name {
    font: var(--tui-typography-heading-h6);
    letter-spacing: -0.01em;
}

.svc-taiga .header__logo-tag {
    font: var(--tui-typography-ui-2xs);
    color: var(--tui-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.svc-taiga .header__spacer {
    flex: 1;
}

.svc-taiga .header__actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.svc-taiga .header__phone {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.125rem;
    text-decoration: none;
    color: inherit;
}

.svc-taiga .header__phone-num {
    font: var(--tui-typography-heading-h6);
    letter-spacing: -0.01em;
    white-space: nowrap;
}

.svc-taiga .header__phone:hover .header__phone-num {
    color: var(--brand-primary);
}

.svc-taiga .header__phone-note {
    font: var(--tui-typography-ui-2xs);
    color: var(--tui-text-secondary);
}

.svc-taiga .header__burger {
    display: none;
}

/* ------------------------------- Mega menu -------------------------------- */
.svc-taiga .nav {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.svc-taiga .nav__item {
    position: relative;
}

.svc-taiga .nav__link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem;
    border-radius: var(--tui-radius-m);
    font: var(--tui-typography-ui-m);
    font-weight: 600;
    color: var(--tui-text-primary);
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--tui-duration-fast), color var(--tui-duration-fast);
}

.svc-taiga .nav__link:hover,
.svc-taiga .nav__item.is-open>.nav__link {
    background: var(--tui-background-neutral-1);
    color: var(--brand-primary);
}

.svc-taiga .nav__link .tui-icon {
    transition: transform var(--tui-duration-fast);
}

.svc-taiga .nav__item.is-open>.nav__link .tui-icon {
    transform: rotate(180deg);
}

.svc-taiga .megamenu {
    position: absolute;
    inset-block-start: calc(100% + 0.625rem);
    inset-inline-start: -1rem;
    z-index: 70;
    inline-size: min(58rem, calc(100vw - 2.5rem));
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-3);
    box-shadow: var(--tui-shadow-popup);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem 2rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-0.5rem);
    transition: opacity var(--tui-duration-fast), transform var(--tui-duration-fast), visibility var(--tui-duration-fast);
}

.svc-taiga .nav__item.is-open>.megamenu {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.svc-taiga .megamenu__group-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.625rem;
    padding-block-end: 0.625rem;
    border-block-end: 1px solid var(--tui-border-normal);
    font: var(--tui-typography-ui-s);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--brand-primary);
}

.svc-taiga .megamenu__list {
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.svc-taiga .megamenu__link {
    display: block;
    padding: 0.3125rem 0.5rem;
    margin-inline: -0.5rem;
    border-radius: var(--tui-radius-s);
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
    text-decoration: none;
    transition: background var(--tui-duration-fastest), color var(--tui-duration-fastest);
}

.svc-taiga .megamenu__link:hover {
    background: var(--tui-background-neutral-1);
    color: var(--brand-primary);
}

.svc-taiga .megamenu__link--current {
    color: var(--brand-primary);
    font-weight: 700;
}

/* ------------------ Header/nav responsive (after .nav rules) -------------- */
@media (max-width: 78rem) {

    .svc-taiga .nav {
        display: none;
    }

    .svc-taiga .header__burger {
        display: inline-flex;
    }

    .svc-taiga .header__inner {
        min-block-size: 4.25rem;
    }

}

@media (max-width: 48rem) {

    .svc-taiga .header__logo-text,
    .svc-taiga .header__phone-note {
        display: none;
    }

    .svc-taiga .header__phone-num {
        font: var(--tui-typography-ui-m);
        font-weight: 700;
    }

    .svc-taiga .header__actions>[tuiButton] {
        display: none;
    }

    /* Drop the address, then the licence line — both would overflow the row. */
    .svc-taiga .topbar__group:first-child .topbar__item:last-child,
    .svc-taiga .topbar__group:last-child .topbar__item {
        display: none;
    }

    .svc-taiga .topbar__inner {
        gap: 0.75rem;
    }

}

@media (max-width: 34rem) {

    .svc-taiga .header__phone {
        display: none;
    }

    .svc-taiga .topbar {
        font: var(--tui-typography-body-xs);
    }

}

/* ----------------------------- Mobile drawer ------------------------------ */
.svc-taiga .drawer {
    position: fixed;
    inset: 0;
    z-index: 200;
    visibility: hidden;
}

.svc-taiga .drawer.is-open {
    visibility: visible;
}

.svc-taiga .drawer__backdrop {
    position: absolute;
    inset: 0;
    background: var(--tui-service-backdrop);
    opacity: 0;
    transition: opacity var(--tui-duration);
}

.svc-taiga .drawer.is-open .drawer__backdrop {
    opacity: 1;
}

.svc-taiga .drawer__panel {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    inline-size: min(24rem, 100%);
    background: var(--tui-background-base);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform var(--tui-duration);
}

.svc-taiga .drawer.is-open .drawer__panel {
    transform: none;
}

.svc-taiga .drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-block-end: 1px solid var(--tui-border-normal);
}

.svc-taiga .drawer__body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem 2rem;
    overscroll-behavior: contain;
}

.svc-taiga .drawer__foot {
    padding: 1rem 1.25rem;
    border-block-start: 1px solid var(--tui-border-normal);
    display: grid;
    gap: 0.625rem;
}

.svc-taiga .acc {
    border-block-end: 1px solid var(--tui-border-normal);
}

.svc-taiga .acc__trigger {
    inline-size: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.875rem 0;
    background: none;
    border: none;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
    color: var(--tui-text-primary);
    text-align: start;
    cursor: pointer;
}

.svc-taiga .acc__trigger .tui-icon {
    color: var(--tui-text-tertiary);
    transition: transform var(--tui-duration-fast);
}

.svc-taiga .acc.is-open .acc__trigger .tui-icon {
    transform: rotate(180deg);
}

.svc-taiga .acc__panel {
    display: none;
    padding-block-end: 0.875rem;
}

.svc-taiga .acc.is-open .acc__panel {
    display: block;
}

.svc-taiga .acc__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

/* =================================== Hero ================================= */
.svc-taiga .hero {
    position: relative;
    padding-block: 2rem 4rem;
    background: var(--brand-navy-deep);
    color: #fff;
    overflow: hidden;
    isolation: isolate;
}

.svc-taiga .hero__bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: var(--hero-bg);
    background-size: cover;
    background-position: center 30%;
    opacity: 0.42;
}

.svc-taiga .hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(135deg, rgb(13 32 53 / 74%) 0%, rgb(27 59 92 / 38%) 55%, rgb(26 72 118 / 7%) 100%) !important;
}

.svc-taiga .breadcrumbs {
    margin-block-end: 2.25rem;
}

.svc-taiga .breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font: var(--tui-typography-body-s);
    color: rgba(255, 255, 255, 0.62);
}

.svc-taiga .breadcrumbs__item:not(:last-child)::after {
    content: '/';
    margin-inline-start: 0.5rem;
    color: rgba(255, 255, 255, 0.34);
}

.svc-taiga .breadcrumbs__link {
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
}

.svc-taiga .breadcrumbs__link:hover {
    color: #fff;
    text-decoration: underline;
}

.svc-taiga .hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: 3.5rem;
    align-items: center;
}

.svc-taiga .hero__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-block-end: 1.25rem;
}

.svc-taiga .hero__badge {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    backdrop-filter: blur(6px);
}

.svc-taiga .hero__badge--live {
    background: rgba(74, 201, 155, 0.2);
    color: #b9f0da;
}

.svc-taiga .hero__title {
    margin: 0;
    text-wrap: balance;
}

.svc-taiga .hero__subtitle {
    margin: 1.125rem 0 0;
    font: var(--tui-typography-body-l);
    color: rgba(255, 255, 255, 0.8);
    max-inline-size: 34rem;
}

.svc-taiga .hero__price {
    display: flex;
    align-items: baseline;
    gap: 0.625rem;
    margin-block-start: 1.75rem;
}

.svc-taiga .hero__price-value {
    font: var(--tui-typography-heading-h3);
    /* На тёмном hero используем осветлённый акцент: базовый #d53646
       даёт к navy лишь 2.9:1, этот — 4.6:1. */
    color: var(--brand-accent-light);
    letter-spacing: -0.01em;
}

.svc-taiga .hero__price-note {
    font: var(--tui-typography-body-s);
    color: rgba(255, 255, 255, 0.62);
}

.svc-taiga .hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-block-start: 1.75rem;
}

.svc-taiga .hero__actions [tuiButton] {
    min-inline-size: 13rem;
}

.svc-taiga .hero__note {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-block-start: 1.25rem;
    font: var(--tui-typography-body-s);
    color: rgba(255, 255, 255, 0.6);
}

.svc-taiga .hero__note .tui-icon {
    color: var(--brand-sky);
}

/* Hero side card with trust metrics */
.svc-taiga .hero__aside {
    display: grid;
    gap: 1rem;
}

.svc-taiga .hero-trust {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.875rem;
}

.svc-taiga .hero-trust__item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.25rem;
    border-radius: var(--tui-radius-xl);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
}

.svc-taiga .hero-trust__item .tui-icon {
    color: var(--brand-sky);
}

.svc-taiga .hero-trust__num {
    font: var(--tui-typography-heading-h5);
    letter-spacing: -0.01em;
}

.svc-taiga .hero-trust__label {
    font: var(--tui-typography-body-s);
    color: rgba(255, 255, 255, 0.7);
}

.svc-taiga .hero-trust__item--wide {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    gap: 0.875rem;
}

@media (max-width: 64rem) {

    .svc-taiga .hero__inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 2.5rem;
    }

    .svc-taiga .hero__subtitle {
        max-inline-size: none;
    }

}

@media (max-width: 34rem) {

    .svc-taiga .hero {
        padding-block-end: 3rem;
    }

    .svc-taiga .hero__actions [tuiButton] {
        min-inline-size: 100%;
    }

    .svc-taiga .hero__price {
        flex-direction: column;
        gap: 0.25rem;
    }

    .svc-taiga .hero__price-value {
        white-space: nowrap;
    }

    .svc-taiga .breadcrumbs {
        margin-block-end: 1.5rem;
    }

}

/* ============================== E-E-A-T strip ============================= */
.svc-taiga .eeat {
    padding-block: 1.75rem;
    border-block-end: 1px solid var(--tui-border-normal);
    background: var(--tui-background-base-alt);
}

.svc-taiga .eeat__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem 2rem;
    align-items: center;
}

.svc-taiga .eeat__person {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-inline-size: 0;
}

.svc-taiga .eeat__role {
    display: block;
    font: var(--tui-typography-ui-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--brand-primary);
    margin-block-end: 0.1875rem;
}

.svc-taiga .eeat__name {
    display: block;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
}

.svc-taiga a.eeat__name {
    color: inherit;
    text-decoration: none;
}

.svc-taiga a.eeat__name:hover {
    color: var(--brand-primary);
}

.svc-taiga .eeat__meta {
    display: block;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .eeat__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .eeat__fact {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.svc-taiga .eeat__fact .tui-icon {
    color: var(--tui-text-tertiary);
}

.svc-taiga .eeat__fact b {
    color: var(--tui-text-primary);
    font-weight: 600;
}

/* ==================== «Главное за 30 секунд» (AEO/GEO) ==================== */
.svc-taiga .quick {
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .quick__head {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-block-end: 1.5rem;
}

.svc-taiga .quick__head .tui-icon {
    color: var(--brand-accent);
}

.svc-taiga .quick__title {
    margin: 0;
    font: var(--tui-typography-heading-h5);
}

.svc-taiga .quick__grid {
    display: grid;
    /* 14rem, чтобы четыре ответа гарантированно вставали в один ряд на
       десктопе: при 16rem последний срывался на вторую строку. */
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem 2rem;
    margin: 0;
}

.svc-taiga .quick__item {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.svc-taiga .quick__q {
    display: flex;
    align-items: center;
    gap: 0.4375rem;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
    color: var(--tui-text-primary);
}

.svc-taiga .quick__q .tui-icon {
    color: var(--brand-primary);
}

.svc-taiga .quick__a {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

/* ========================= Территория обслуживания ======================== */
.svc-taiga .areas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.svc-taiga .areas__col {
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: var(--tui-shadow-small);
}

.svc-taiga .areas__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .areas__title .tui-icon {
    color: var(--brand-primary);
}

.svc-taiga .areas__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.svc-taiga .areas__note {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-status-info-pale);
}

.svc-taiga .areas__note>.tui-icon {
    color: var(--brand-primary);
}

.svc-taiga .areas__note p {
    flex: 1 1 20rem;
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

@media (max-width: 48rem) {

    .svc-taiga .areas {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ================================== TOC =================================== */
.svc-taiga .toc {
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-2);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .toc__title {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0 0 1rem;
    font: var(--tui-typography-heading-h6);
}

.svc-taiga .toc__title .tui-icon {
    color: var(--brand-primary);
}

.svc-taiga .toc__list {
    counter-reset: toc;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.25rem 1.5rem;
}

.svc-taiga .toc__link {
    counter-increment: toc;
    display: flex;
    align-items: baseline;
    gap: 0.625rem;
    padding: 0.5rem;
    margin-inline: -0.5rem;
    border-radius: var(--tui-radius-s);
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
    text-decoration: none;
    transition: background var(--tui-duration-fastest), color var(--tui-duration-fastest);
}

.svc-taiga .toc__link::before {
    content: counter(toc);
    flex: none;
    inline-size: 1.375rem;
    block-size: 1.375rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--tui-background-neutral-1);
    color: var(--brand-primary);
    font: var(--tui-typography-ui-2xs);
    font-weight: 700;
}

.svc-taiga .toc__link:hover,
.svc-taiga .toc__link.is-active {
    background: var(--tui-background-neutral-1);
    color: var(--brand-primary);
}

.svc-taiga .toc__link.is-active::before {
    background: var(--tui-background-accent-1);
    color: var(--tui-text-primary-on-accent-1);
}

/* =============================== Prose text =============================== */
.svc-taiga .prose {
    max-inline-size: 48rem;
}

/* One reset, one rhythm rule — keep both at the same specificity as the
   element rules below so cascade order (not specificity) decides. */
.svc-taiga .prose>* {
    margin: 0;
}

.svc-taiga .prose>*+* {
    margin-block-start: 1.125rem;
}

.svc-taiga .prose>h2+p {
    margin-block-start: 1.25rem;
}

.svc-taiga .prose p {
    font: var(--tui-typography-body-l);
    color: var(--tui-text-secondary);
}

.svc-taiga .prose h2,
.svc-taiga .prose h3 {
    color: var(--tui-text-primary);
}

.svc-taiga .prose strong {
    color: var(--tui-text-primary);
    font-weight: 700;
}

.svc-taiga .prose a {
    color: var(--tui-text-action);
}

.svc-taiga .checklist {
    list-style: none;
    margin: 1.5rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.svc-taiga .checklist--2col {
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: 0.75rem 2rem;
}

.svc-taiga .checklist li {
    position: relative;
    padding-inline-start: 2rem;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .checklist li::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0.0625rem;
    inline-size: 1.375rem;
    block-size: 1.375rem;
    border-radius: 50%;
    background: var(--tui-status-positive-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233aa981' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 0.75rem no-repeat;
}

.svc-taiga .callout-list li::before {
    background: var(--tui-status-info-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b7094' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8h.01M11 12h1v4h1'/%3E%3C/svg%3E") center / 0.875rem no-repeat;
}

.svc-taiga .text-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 22rem);
    gap: 3rem;
    align-items: start;
}

@media (max-width: 64rem) {

    .svc-taiga .text-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 2rem;
    }

}

.svc-taiga .aside-card {
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
    display: grid;
    gap: 0.875rem;
}

.svc-taiga .aside-card__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .aside-card__title .tui-icon {
    color: var(--brand-emergency);
}

.svc-taiga .aside-card p {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

/* ================================= Process ================================ */
.svc-taiga .steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    counter-reset: step;
}

.svc-taiga .step {
    counter-increment: step;
    position: relative;
    padding: 1.75rem 1.5rem 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: var(--tui-shadow-small);
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    transition: transform var(--tui-duration-fast), box-shadow var(--tui-duration-fast);
}

.svc-taiga .step:hover {
    transform: translateY(-0.25rem);
    box-shadow: var(--tui-shadow-small-hover);
}

.svc-taiga .step__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.svc-taiga .step__icon {
    inline-size: 3rem;
    block-size: 3rem;
    border-radius: var(--tui-radius-l);
    display: grid;
    place-items: center;
    background: var(--tui-status-info-pale);
    color: var(--brand-primary);
}

.svc-taiga .step__num {
    font: var(--tui-typography-heading-h3);
    color: var(--tui-border-normal);
    letter-spacing: -0.02em;
}

.svc-taiga .step__num::before {
    content: '0' counter(step);
}

.svc-taiga .step__title {
    margin: 0;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .step__text {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .step__action {
    margin-block-start: auto;
    padding-block-start: 0.5rem;
}

@media (max-width: 62rem) {

    .svc-taiga .steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 40rem) {

    .svc-taiga .steps {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* =============================== Phone CTA ================================ */
.svc-taiga .phone-cta {
    position: relative;
    padding: 3rem;
    align-items: normal;
    border-radius: var(--tui-radius-xl);
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(95, 168, 211, 0.35) 0%, transparent 55%),
        linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-navy-deep) 100%);
    color: #fff;
    overflow: hidden;
}

.svc-taiga .phone-cta__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2.5rem;
    align-items: center;
}

.svc-taiga .phone-cta__title {
    margin: 0;
    max-inline-size: 34rem;
}

.svc-taiga .phone-cta__text {
    margin: 0.75rem 0 0;
    font: var(--tui-typography-body-m);
    color: rgba(255, 255, 255, 0.72);
    max-inline-size: 32rem;
}

.svc-taiga .phone-cta__side {
    display: grid;
    gap: 0.875rem;
    justify-items: stretch;
    min-inline-size: 17rem;
}

.svc-taiga .phone-cta__phone {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding-left: 0;
    font: var(--tui-typography-heading-h4);
    background: transparent;
    color: #fff;
    text-decoration: none;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

.svc-taiga .phone-cta__phone .tui-icon {
    color: var(--brand-sky);
}

.svc-taiga .phone-cta__phone:hover {
    color: var(--brand-sky);
}

.svc-taiga .messengers {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.svc-taiga .messenger {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
    padding: 0.5rem 0.875rem;
    border-radius: var(--tui-radius-m);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    font: var(--tui-typography-ui-s);
    font-weight: 600;
    text-decoration: none;
    transition: background var(--tui-duration-fast), transform var(--tui-duration-fast);
}

.svc-taiga .messenger:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-1px);
}

.svc-taiga .messenger--tg:hover {
    background: #229ed9;
    border-color: #229ed9;
}

.svc-taiga .messenger--wa:hover {
    background: #25d366;
    border-color: #25d366;
    color: #06331a;
}

.svc-taiga .messenger--max:hover {
    background: var(--brand-accent);
    border-color: var(--brand-accent);
}

@media (max-width: 62rem) {

    .svc-taiga .phone-cta {
        padding: 2rem;
    }

    .svc-taiga .phone-cta__inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.75rem;
    }

    .svc-taiga .phone-cta__side {
        min-inline-size: 0;
    }

}

/* ================================= Prices ================================= */
.svc-taiga .price-table {
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: var(--tui-shadow-small);
    overflow: hidden;
}

.svc-taiga .price-table__scroll {
    overflow-x: auto;
}

.svc-taiga .price-table table {
    inline-size: 100%;
    min-inline-size: 40rem;
    border-collapse: collapse;
}

.svc-taiga .price-table th {
    padding: 1.125rem 1.5rem;
    text-align: start;
    font: var(--tui-typography-ui-s);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--tui-text-secondary);
    background: var(--tui-background-base-alt);
    border-block-end: 1px solid var(--tui-border-normal);
    white-space: nowrap;
}

.svc-taiga .price-table td {
    padding: 1.125rem 1.5rem;
    border-block-end: 1px solid var(--tui-border-normal);
    vertical-align: middle;
}

.svc-taiga .price-table tbody tr:last-child td {
    border-block-end: none;
}

.svc-taiga .price-table tbody tr {
    transition: background var(--tui-duration-fastest);
}

.svc-taiga .price-table tbody tr:hover {
    background: var(--tui-background-neutral-1);
}

.svc-taiga .price-table__name {
    font: var(--tui-typography-body-m);
    font-weight: 600;
    color: var(--tui-text-primary);
}

.svc-taiga .price-table__hint {
    display: block;
    margin-block-start: 0.1875rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-tertiary);
}

.svc-taiga .price-table__price {
    white-space: nowrap;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
    color: var(--brand-primary);
}

.svc-taiga .price-table__price small {
    display: block;
    font: var(--tui-typography-body-xs);
    font-weight: 500;
    color: var(--tui-text-tertiary);
}

.svc-taiga .price-table__action {
    text-align: end;
    white-space: nowrap;
}

.svc-taiga .price-table__foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.5rem;
    align-items: center;
    padding: 1.5rem;
    background: var(--tui-background-base-alt);
    border-block-start: 1px solid var(--tui-border-normal);
}

.svc-taiga .price-table__foot p {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .price-table__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    margin-block-start: 0.875rem !important;
}

.svc-taiga .price-table__meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
}

.svc-taiga .price-table__meta .tui-icon {
    color: var(--brand-primary);
    flex: none;
}

@media (max-width: 48rem) {

    .svc-taiga .price-table__foot {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ============================== Advantages ================================ */
.svc-taiga .adv-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.svc-taiga .adv {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
    transition: box-shadow var(--tui-duration-fast), transform var(--tui-duration-fast);
}

.svc-taiga .adv:hover {
    box-shadow: var(--tui-shadow-small);
    transform: translateY(-0.1875rem);
}

.svc-taiga .adv__icon {
    flex: none;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border-radius: var(--tui-radius-l);
    display: grid;
    place-items: center;
    background: var(--tui-status-info-pale);
    color: var(--brand-primary);
}

.svc-taiga .adv__icon--accent {
    background: color-mix(in srgb, var(--brand-accent) 12%, transparent);
    color: var(--brand-accent);
}

.svc-taiga .adv__title {
    margin: 0 0 0.25rem;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
}

.svc-taiga .adv__text {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

/* Четыре карточки: 3 колонки оставляли бы сироту на второй строке. */
.svc-taiga .adv-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 78rem) {

    .svc-taiga .adv-grid--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 62rem) {

    .svc-taiga .adv-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 40rem) {

    .svc-taiga .adv-grid,
    .svc-taiga .adv-grid--4 {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* =============================== License ================================== */
.svc-taiga .license {
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 2.5rem;
    align-items: center;
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .license__img {
    position: relative;
    display: block;
    border-radius: var(--tui-radius-l);
    overflow: hidden;
    background: #fff;
    box-shadow: var(--tui-shadow-small);
    transition: box-shadow var(--tui-duration-fast), transform var(--tui-duration-fast);
}

.svc-taiga .license__img img {
    inline-size: 100%;
    block-size: auto;
}

.svc-taiga a.license__img:hover {
    box-shadow: var(--tui-shadow-medium-hover);
    transform: translateY(-0.125rem);
}

.svc-taiga .license__zoom {
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.625rem;
    background: rgba(20, 41, 66, 0.82);
    color: #fff;
    font: var(--tui-typography-ui-s);
    font-weight: 600;
    opacity: 0;
    transform: translateY(100%);
    transition: opacity var(--tui-duration-fast), transform var(--tui-duration-fast);
}

.svc-taiga a.license__img:hover .license__zoom,
.svc-taiga a.license__img:focus-visible .license__zoom {
    opacity: 1;
    transform: none;
}

.svc-taiga .license__title {
    margin: 0 0 0.875rem;
}

.svc-taiga .license__text {
    margin: 0;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .license__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-block-start: 1.25rem;
}

@media (max-width: 48rem) {

    .svc-taiga .license {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
        padding: 1.5rem;
    }

    .svc-taiga .license__img {
        max-inline-size: 14rem;
    }

}

/* ================================ Doctors ================================= */
.svc-taiga .doctors {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap: 1.5rem;
}

.svc-taiga .doctor {
    display: grid;
    grid-template-columns: 10rem minmax(0, 1fr);
    gap: 1.5rem;
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: var(--tui-shadow-small);
    transition: box-shadow var(--tui-duration-fast);
}

.svc-taiga .doctor:hover {
    box-shadow: var(--tui-shadow-small-hover);
}

.svc-taiga .doctor__photo {
    border-radius: var(--tui-radius-l);
    overflow: hidden;
    background: var(--tui-background-neutral-1);
    aspect-ratio: 3 / 4;
}

.svc-taiga .doctor__photo img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.svc-taiga .doctor__body {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-inline-size: 0;
}

.svc-taiga .doctor__name {
    margin: 0;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .doctor__name a {
    color: inherit;
    text-decoration: none;
}

.svc-taiga .doctor__name a:hover {
    color: var(--brand-primary);
}

.svc-taiga .doctor__role {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--brand-primary);
    font-weight: 600;
}

.svc-taiga .doctor__exp {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .doctor__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-block-start: auto;
    padding-block-start: 0.75rem;
}

/* Фото в медиатеке нет — карточка без колонки под изображение. */
.svc-taiga .doctor--no-photo {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 30rem) {

    .svc-taiga .doctor {
        grid-template-columns: minmax(0, 1fr);
    }

    .svc-taiga .doctor__photo {
        max-inline-size: 10rem;
    }

}

/* ================================== FAQ =================================== */
.svc-taiga .faq {
    display: grid;
    gap: 0.75rem;
    max-inline-size: 52rem;
}

.svc-taiga .faq__item {
    border-radius: var(--tui-radius-l);
    background: var(--tui-background-elevation-1);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
    overflow: hidden;
    transition: box-shadow var(--tui-duration-fast);
}

.svc-taiga .faq__item.is-open {
    box-shadow: inset 0 0 0 1px transparent, var(--tui-shadow-small);
}

.svc-taiga .faq__trigger {
    inline-size: 100%;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: none;
    border: none;
    text-align: start;
    cursor: pointer;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
    color: var(--tui-text-primary);
}

.svc-taiga .faq__trigger:hover {
    color: var(--brand-primary);
}

.svc-taiga .faq__trigger .tui-icon {
    margin-inline-start: auto;
    flex: none;
    color: var(--tui-text-tertiary);
    transition: transform var(--tui-duration-fast);
}

.svc-taiga .faq__item.is-open .faq__trigger .tui-icon {
    transform: rotate(180deg);
    color: var(--brand-primary);
}

.svc-taiga .faq__panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--tui-duration);
}

.svc-taiga .faq__item.is-open .faq__panel {
    grid-template-rows: 1fr;
}

.svc-taiga .faq__panel>div {
    overflow: hidden;
}

.svc-taiga .faq__panel p {
    margin: 0;
    padding: 0 1.5rem 1.5rem;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .faq__expert {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-block-start: 1.5rem;
    padding: 1rem 1.25rem;
    border-radius: var(--tui-radius-l);
    background: var(--tui-background-base-alt);
    max-inline-size: 52rem;
}

.svc-taiga .faq__expert-label {
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .faq__expert-name {
    display: block;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
    color: var(--tui-text-primary);
}

/* =============================== Consult CTA ============================== */
.svc-taiga .consult {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: center;
    padding: 2.25rem 2.5rem;
    border-radius: var(--tui-radius-xl);
    background: linear-gradient(135deg, var(--brand-emergency) 0%, #a72433 100%);
    color: #fff;
}

.svc-taiga .consult__eyebrow {
    font: var(--tui-typography-ui-s);
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.78);
}

.svc-taiga .consult__title {
    margin: 0.5rem 0 0;
    font: var(--tui-typography-heading-h4);
    max-inline-size: 34rem;
}

.svc-taiga .consult__side {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}

.svc-taiga .consult__phone {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font: var(--tui-typography-heading-h5);
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}

.svc-taiga .consult__phone:hover {
    text-decoration: underline;
}

.svc-taiga .consult [tuiButton][data-appearance='primary-grayscale'] {
    background: #fff;
    color: var(--brand-emergency);
}

.svc-taiga .consult [tuiButton][data-appearance='primary-grayscale']:hover {
    background: rgba(255, 255, 255, 0.88);
}

@media (max-width: 56rem) {

    .svc-taiga .consult {
        grid-template-columns: minmax(0, 1fr);
        padding: 1.75rem;
    }

}

/* ================================ Reviews ================================= */
.svc-taiga .reviews__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(21rem, 1fr);
    gap: 1.25rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    /* Arrows drive the track on desktop, swipe on touch — no visible bar. */
    scrollbar-width: none;
}

.svc-taiga .reviews__track::-webkit-scrollbar {
    display: none;
}

.svc-taiga .review {
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .review__stars {
    display: flex;
    gap: 0.1875rem;
    color: #f5a623;
}

.svc-taiga .review__stars .tui-icon {
    inline-size: 1.125rem;
    block-size: 1.125rem;
    fill: currentColor;
    stroke: none;
}

.svc-taiga .review__stars .tui-icon.is-empty {
    color: var(--tui-border-hover);
}

.svc-taiga .review__text {
    margin: 0;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
    flex: 1;
}

.svc-taiga .review__author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-block-start: 1rem;
    border-block-start: 1px solid var(--tui-border-normal);
}

.svc-taiga .review__name {
    font: var(--tui-typography-ui-m);
    font-weight: 700;
}

.svc-taiga .review__meta {
    font: var(--tui-typography-body-s);
    color: var(--tui-text-tertiary);
}

.svc-taiga .slider-nav {
    display: flex;
    gap: 0.5rem;
}

/* ============================ Related services ============================ */
.svc-taiga .services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.svc-taiga .service {
    display: flex;
    flex-direction: column;
    border-radius: var(--tui-radius-xl);
    overflow: hidden;
    background: var(--tui-background-elevation-1);
    box-shadow: var(--tui-shadow-small);
    text-decoration: none;
    color: inherit;
    transition: transform var(--tui-duration-fast), box-shadow var(--tui-duration-fast);
}

.svc-taiga .service:hover {
    transform: translateY(-0.25rem);
    box-shadow: var(--tui-shadow-medium-hover);
}

.svc-taiga .service__media {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--tui-background-neutral-1);
}

.svc-taiga .service__media img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    transition: transform var(--tui-duration-slow);
}

.svc-taiga .service:hover .service__media img {
    transform: scale(1.05);
}

.svc-taiga .service__body {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1.375rem 1.5rem 1.5rem;
    flex: 1;
}

.svc-taiga .service__title {
    margin: 0;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .service__excerpt {
    margin: 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.svc-taiga .service__more {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-block-start: auto;
    padding-block-start: 0.5rem;
    font: var(--tui-typography-ui-s);
    font-weight: 700;
    color: var(--brand-primary);
}

.svc-taiga .service__more .tui-icon {
    transition: transform var(--tui-duration-fast);
}

.svc-taiga .service:hover .service__more .tui-icon {
    transform: translateX(0.25rem);
}

@media (max-width: 62rem) {

    .svc-taiga .services {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 40rem) {

    .svc-taiga .services {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ================================ Sources ================================= */
.svc-taiga .sources {
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .sources__head {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-block-end: 0.875rem;
}

.svc-taiga .sources__head .tui-icon {
    color: var(--brand-primary);
}

.svc-taiga .sources__title {
    margin: 0;
    font: var(--tui-typography-heading-h5);
}

.svc-taiga .sources__note {
    margin: 0 0 1.5rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
    max-inline-size: 48rem;
}

.svc-taiga .sources__list {
    list-style: none;
    counter-reset: src;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.svc-taiga .sources__list li {
    counter-increment: src;
    display: flex;
    gap: 0.875rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .sources__list li::before {
    content: counter(src);
    flex: none;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    display: grid;
    place-items: center;
    border-radius: var(--tui-radius-xs);
    background: var(--tui-background-neutral-2);
    color: var(--tui-text-primary);
    font: var(--tui-typography-ui-2xs);
    font-weight: 700;
}

/* =============================== Author box =============================== */
.svc-taiga .authors {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap: 1.25rem;
}

.svc-taiga .author {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.25rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-1);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .author__label {
    display: block;
    font: var(--tui-typography-ui-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--brand-primary);
    margin-block-end: 0.25rem;
}

.svc-taiga .author__name {
    margin: 0;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
}

.svc-taiga .author__role {
    margin: 0.125rem 0 0.5rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

/* ============================== Error report ============================== */
.svc-taiga .error-report {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 2.5rem;
    align-items: start;
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

.svc-taiga .error-report__title {
    margin: 0 0 0.75rem;
}

.svc-taiga .error-report__text {
    margin: 0;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .form-grid {
    display: grid;
    gap: 0.875rem;
}

.svc-taiga .form-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.875rem;
}

@media (max-width: 56rem) {

    .svc-taiga .error-report {
        grid-template-columns: minmax(0, 1fr);
        padding: 1.5rem;
    }

}

@media (max-width: 34rem) {

    .svc-taiga .form-row {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ================================ Final CTA =============================== */
.svc-taiga .final-cta {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 24rem);
    gap: 3rem;
    align-items: center;
    padding: 3rem;
    border-radius: var(--tui-radius-xl);
    background:
        radial-gradient(100% 140% at 0% 0%, rgba(95, 168, 211, 0.3) 0%, transparent 60%),
        linear-gradient(135deg, var(--brand-primary) 0%, #1c5570 100%);
    color: #fff;
    overflow: hidden;
}

.svc-taiga .final-cta__title {
    margin: 0;
}

.svc-taiga .final-cta__text {
    margin: 0.875rem 0 0;
    font: var(--tui-typography-body-l);
    color: rgba(255, 255, 255, 0.8);
}

.svc-taiga .final-cta__phone {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    margin-block-start: 1.5rem;
    font: var(--tui-typography-heading-h4);
    color: #fff;
    text-decoration: none;
}

.svc-taiga .final-cta__phone:hover {
    color: var(--brand-sky);
}

.svc-taiga .final-cta__form {
    padding: 1.75rem;
    border-radius: var(--tui-radius-xl);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(10px);
    display: grid;
    gap: 0.875rem;
}

.svc-taiga .final-cta__form-title {
    margin: 0;
    font: var(--tui-typography-ui-l);
    font-weight: 700;
}

.svc-taiga .final-cta__form .tui-checkbox {
    color: rgba(255, 255, 255, 0.72);
}

.svc-taiga .final-cta__form .tui-checkbox a {
    color: #fff;
}

@media (max-width: 62rem) {

    .svc-taiga .final-cta {
        grid-template-columns: minmax(0, 1fr);
        padding: 2rem;
        gap: 2rem;
    }

}

/* ================================= Footer ================================= */
.svc-taiga .footer {
    background: var(--brand-navy-deep);
    color: rgba(255, 255, 255, 0.7);
}

.svc-taiga .footer__accent {
    block-size: 0.25rem;
    background: linear-gradient(90deg, var(--brand-primary), var(--brand-sky), var(--brand-accent));
}

.svc-taiga .footer__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.2fr);
    gap: 2.5rem;
    padding-block-end: 2.5rem;
}

.svc-taiga .footer__logo {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    margin-block-end: 1rem;
}

.svc-taiga .footer__logo img {
    block-size: 2.75rem;
    inline-size: auto;
}

.svc-taiga .footer__about {
    margin: 0 0 1.25rem;
    font: var(--tui-typography-body-s);
    color: rgba(255, 255, 255, 0.6);
    max-inline-size: 22rem;
}

.svc-taiga .footer__title {
    margin: 0 0 1rem;
    font: var(--tui-typography-ui-m);
    font-weight: 700;
    color: #fff;
}

.svc-taiga .footer__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.5rem;
}

.svc-taiga .footer__link {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font: var(--tui-typography-body-s);
    transition: color var(--tui-duration-fastest);
}

.svc-taiga .footer__link:hover {
    color: #fff;
}

.svc-taiga .footer__contact {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-block-end: 0.75rem;
    color: rgba(255, 255, 255, 0.82);
    text-decoration: none;
    font: var(--tui-typography-body-s);
}

.svc-taiga .footer__contact .tui-icon {
    color: var(--brand-sky);
    flex: none;
}

.svc-taiga a.footer__contact:hover {
    color: #fff;
}

.svc-taiga .footer__contact--phone {
    font: var(--tui-typography-heading-h6);
    color: #fff;
}

.svc-taiga .footer__legal {
    padding-block: 1.5rem;
    border-block-start: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    font: var(--tui-typography-body-xs);
    color: rgba(255, 255, 255, 0.5);
}

.svc-taiga .footer__policies {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    padding-block-end: 1.5rem;
}

.svc-taiga .footer__bottom {
    padding-block: 1.25rem;
    border-block-start: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem;
    font: var(--tui-typography-body-xs);
    color: rgba(255, 255, 255, 0.45);
}

.svc-taiga .footer__bottom a {
    color: rgba(255, 255, 255, 0.65);
}

@media (max-width: 62rem) {

    .svc-taiga .footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2rem;
    }

}

@media (max-width: 34rem) {

    .svc-taiga .footer__grid {
        grid-template-columns: minmax(0, 1fr);
    }

}

/* ============================ Sticky mobile bar =========================== */
.svc-taiga .mobile-bar {
    position: fixed;
    inset-block-end: 0;
    inset-inline: 0;
    z-index: 90;
    display: none;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem calc(0.625rem + env(safe-area-inset-bottom));
    background: var(--tui-background-elevation-3);
    border-block-start: 1px solid var(--tui-border-normal);
    box-shadow: 0 -0.5rem 1.5rem rgba(20, 41, 66, 0.14);
    transform: translateY(110%);
    transition: transform var(--tui-duration);
}

.svc-taiga .mobile-bar.is-visible {
    transform: none;
}

.svc-taiga .mobile-bar [tuiButton] {
    flex: 1;
}

@media (max-width: 62rem) {

    .svc-taiga .mobile-bar {
        display: flex;
    }

    .svc-taiga {
        padding-block-end: 4.5rem;
    }

}

/* ================================= Modals ================================= */
.svc-taiga .modal {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: grid;
    place-items: center;
    padding: 1.25rem;
    visibility: hidden;
}

.svc-taiga .modal.is-open {
    visibility: visible;
}

.svc-taiga .modal__backdrop {
    position: absolute;
    inset: 0;
    background: var(--tui-service-backdrop);
    opacity: 0;
    transition: opacity var(--tui-duration-fast);
}

.svc-taiga .modal.is-open .modal__backdrop {
    opacity: 1;
}

.svc-taiga .modal__dialog {
    position: relative;
    inline-size: min(30rem, 100%);
    max-block-size: calc(100vh - 2.5rem);
    overflow-y: auto;
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-3);
    box-shadow: var(--tui-shadow-popup);
    transform: scale(0.96) translateY(0.75rem);
    opacity: 0;
    transition: transform var(--tui-duration-fast), opacity var(--tui-duration-fast);
}

.svc-taiga .modal.is-open .modal__dialog {
    transform: none;
    opacity: 1;
}

.svc-taiga .modal__close {
    position: absolute;
    inset-block-start: 0.875rem;
    inset-inline-end: 0.875rem;
}

.svc-taiga .modal__eyebrow {
    display: block;
    font: var(--tui-typography-ui-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--brand-accent);
    margin-block-end: 0.5rem;
}

.svc-taiga .modal__title {
    margin: 0 0 0.5rem;
    font: var(--tui-typography-heading-h5);
}

.svc-taiga .modal__text {
    margin: 0 0 1.5rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .modal__success {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
    padding-block: 1rem;
}

.svc-taiga .modal__success .tui-icon {
    color: var(--tui-status-positive);
}

.svc-taiga .modal.is-sent .modal__success {
    display: flex;
}

.svc-taiga .modal.is-sent .modal__body {
    display: none;
}

/* ============================== Cookie banner ============================= */
.svc-taiga .cookie {
    position: fixed;
    inset-block-end: 1.25rem;
    inset-inline-start: 1.25rem;
    z-index: 120;
    inline-size: min(28rem, calc(100vw - 2.5rem));
    padding: 1.25rem 1.5rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-elevation-3);
    box-shadow: var(--tui-shadow-popup);
    display: none;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.svc-taiga .cookie.is-visible {
    display: flex;
}

.svc-taiga .cookie p {
    margin: 0;
    flex: 1 1 14rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

@media (max-width: 62rem) {

    .svc-taiga .cookie {
        inset-block-end: 5.25rem;
    }

}

/* ===== page-extra.css ==================================================== */
/* ==========================================================================
   Дополнения к page.css, которых нет в статичном макете.

   Статичный макет — одна страница с фиксированным контентом. В шаблоне тот же
   контент приходит из ACF и умеет то, чего в макете не было: строки-группы в
   прайсе, выделенные позиции, переключатель темы без своей шапки.

   Файл проходит через ту же сборку, что и остальные: селекторы скоупятся
   под .svc-taiga.
   ========================================================================== */

/* ----------------------------- Текстовый блок ---------------------------- */

/* В макете у .prose всегда стояло ограничение по ширине: там текст соседствовал
   с врезкой справа. Когда врезки нет, колонка ни с чем не делит место —
   растягиваем на весь контейнер. Класс ставит партиал, а не медиазапрос:
   решает наличие врезки, а не ширина экрана. */
.svc-taiga .prose--full {
    max-inline-size: none;
}

/* Выноска-нотификация шла инлайновым стилем с фиксированной шириной. Теперь
   следует за текстом: в секции с врезкой её ограничивает колонка сетки, без
   врезки — контейнер. */
.svc-taiga .section__notice {
    margin-block-start: 2rem;
}

/* ------------------- Противопоказания и анонимность ---------------------- */

/* Этих блоков в статичном макете не было, поэтому собраны по грамматике
   соседних: корпус — как у .sources и .aside-card (нейтральный фон, радиус,
   волосяная рамка), цвет статуса — только плиткой под иконкой, как у
   .adv__icon и .step__icon. Заливать цветом всю карточку дизайн-система
   нигде не делает: три подряд цветных блока читались бы как ошибка страницы,
   а не как её часть. */
.svc-taiga .notice-card {
    --nc-accent: var(--brand-primary);
    --nc-chip: var(--tui-status-info-pale);
    padding: 2rem;
    border-radius: var(--tui-radius-xl);
    background: var(--tui-background-base-alt);
    box-shadow: inset 0 0 0 1px var(--tui-border-normal);
}

/* Статусные токены Taiga светлые: #ffc700 и #4ac99b на почти белой плитке
   дают около 2:1 — иконка теряется. Подмешиваем цвет текста: получается
   3.5:1+ (порог для нефонового содержимого), и оттенок остаётся токенным,
   то есть переживает смену темы. Так же поступает сама дизайн-система —
   маркеры .checklist нарисованы затемнённым зелёным, а не токеном статуса. */
.svc-taiga .notice-card--warning {
    --nc-accent: color-mix(in srgb, var(--tui-status-warning) 60%, var(--tui-text-primary));
    --nc-chip: var(--tui-status-warning-pale);
}

.svc-taiga .notice-card--positive {
    --nc-accent: color-mix(in srgb, var(--tui-status-positive) 65%, var(--tui-text-primary));
    --nc-chip: var(--tui-status-positive-pale);
}

/* Предупреждение о веществах — на фирменном красном, а не на системном
   негативном: это акцент клиники, тот же, что у CTA. */
.svc-taiga .notice-card--negative {
    --nc-accent: var(--brand-accent);
    --nc-chip: color-mix(in srgb, var(--brand-accent) 12%, transparent);
}

.svc-taiga .notice-card__head {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-block-end: 1rem;
}

.svc-taiga .notice-card__icon {
    flex: none;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border-radius: var(--tui-radius-l);
    display: grid;
    place-items: center;
    background: var(--nc-chip);
    color: var(--nc-accent);
}

.svc-taiga .notice-card__phones {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem 1.25rem;
}

.svc-taiga .notice-card__phone {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font: var(--tui-typography-heading-h6);
    color: var(--tui-text-primary);
    text-decoration: none;
}

.svc-taiga .notice-card__phone .tui-icon {
    color: var(--nc-accent);
}

.svc-taiga .notice-card__phone:hover {
    color: var(--nc-accent);
}

.svc-taiga .notice-card__phone--muted {
    font: var(--tui-typography-ui-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .notice-card__phone-note {
    font: var(--tui-typography-body-s);
    color: var(--tui-text-tertiary);
}

/* Тот же размер, что у .sources__title — карточки стоят рядом и должны
   читаться как один уровень. */
.svc-taiga .notice-card__title {
    margin: 0;
    font: var(--tui-typography-heading-h5);
    color: var(--tui-text-primary);
}

.svc-taiga .notice-card__intro {
    margin: 0;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
    max-inline-size: 48rem;
}

.svc-taiga .notice-card .checklist {
    margin-block-start: 1rem;
}

/* Маркер противопоказаний — восклицательный знак вместо галочки: галочка
   рядом со списком запретов читается как «можно». */
.svc-taiga .checklist--warning li::before {
    background: var(--tui-background-base) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dfa000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v6M12 16.5h.01'/%3E%3C/svg%3E") center / 0.875rem no-repeat;
}

.svc-taiga .notice-card__extra {
    margin-block-start: 1.25rem;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-secondary);
}

.svc-taiga .notice-card__note {
    margin: 1.25rem 0 0;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

.svc-taiga .notice-card__legal {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 0 0;
    padding-block-start: 1rem;
    border-block-start: 1px solid var(--tui-border-normal);
    font: var(--tui-typography-body-s);
    font-weight: 600;
    color: var(--tui-text-primary);
}

.svc-taiga .notice-card__legal-list {
    margin-block-start: 1.5rem;
    padding-block-start: 1rem;
    border-block-start: 1px solid var(--tui-border-normal);
}

.svc-taiga .notice-card__legal-label {
    display: block;
    margin-block-end: 0.5rem;
    font: var(--tui-typography-ui-s);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tui-text-tertiary);
}

.svc-taiga .notice-card__legal-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.375rem;
    font: var(--tui-typography-body-s);
    color: var(--tui-text-secondary);
}

/* Паддинг не уменьшается на узких экранах намеренно: у .sources, с которым
   эти карточки стоят в одном ряду, его тоже не уменьшают. */

/* -------------------------------- Отзывы --------------------------------- */

/* Ширина колонки в дизайн-системе была константой (minmax(21rem, 1fr)), из-за
   чего число карточек на экране определяла ширина окна, а не настройка блока.
   Теперь считаем от --rv-per-view, которую ставит партиал из ACF-поля
   «Слайдов на экране».

   --rv-cap ограничивает выбор на узких экранах: четыре карточки в 375px
   нечитаемы, какое бы число ни выбрал администратор. min() берёт меньшее из
   выбранного и допустимого, так что выбор «1» остаётся единицей везде.

   Размер трека задаётся одним значением, без minmax(): с `minmax(0, …)` грид
   считает верхнюю границу необязательной и ужимает колонки под контейнер
   вместо того, чтобы дать им переполниться и прокручиваться. */
.svc-taiga .reviews__track {
    --rv-per-view: 3;
    --rv-cap: 4;
    --rv-gap: 1.25rem;
    --rv-n: min(var(--rv-per-view), var(--rv-cap));
    grid-auto-columns: calc((100% - (var(--rv-n) - 1) * var(--rv-gap)) / var(--rv-n));
}

@media (max-width: 62rem) {

    .svc-taiga .reviews__track {
        --rv-cap: 2;
    }

}

@media (max-width: 48rem) {

    .svc-taiga .reviews__track {
        --rv-cap: 1;
    }

}

/* Обрезка длинного отзыва. Включается классом от JS: без скрипта кнопка
   «Показать полностью» не появится, и обрезанный текст стало бы негде дочитать. */
.svc-taiga .reviews__track.is-clamped .review__text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--rv-lines, 9);
    overflow: hidden;
    flex: none;
}

.svc-taiga .review__more {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font: var(--tui-typography-ui-s);
    font-weight: 600;
    color: var(--brand-primary);
}

.svc-taiga .review__more:hover {
    color: var(--brand-accent);
}

/* Подпись автора прижата к низу — карточки выравниваются независимо от того,
   появилась кнопка «Показать полностью» или текст поместился целиком. */
.svc-taiga .reviews__track.is-clamped .review__author {
    margin-block-start: auto;
}

/* Внутри модалки отзыв показывается целиком. */
.svc-taiga .modal .review__text,
.svc-taiga .modal__text {
    -webkit-line-clamp: none;
    overflow: visible;
}

.svc-taiga .modal [data-review-modal-text] {
    margin-block: 0.75rem 1.25rem;
    font: var(--tui-typography-body-m);
    color: var(--tui-text-primary);
    white-space: pre-line;
}

.svc-taiga .modal .review__author {
    margin: 0;
}

/* --------------------------------- FAQ ----------------------------------- */

/* В макете аккордеон и карточка эксперта были уже остальных секций — 52rem.
   Ширина поднята до 92rem: контейнер всё равно ограничен 75rem, так что это
   фактически снимает ограничение и выравнивает FAQ с соседними блоками. */
.svc-taiga .faq,
.svc-taiga .faq__expert {
    max-inline-size: 92rem;
}

/* ------------------------ Совместимость с темой -------------------------- */

/* main.css темы красит элементы напрямую: `h1…h6 { color: var(--brand-color) }`.
   Дизайн-система задаёт цвет заголовков наследованием (свой цвет есть только у
   .prose h2/h3), а правило на элементе бьёт наследование при любой
   специфичности — поэтому все заголовки внутри контейнера уезжали в тёмно-синий
   темы, и H1 на тёмном hero становился нечитаемым. Возвращаем наследование.

   Сюда же letter-spacing из design-upgrade.css: в макете его не было. */
.svc-taiga h1,
.svc-taiga h2,
.svc-taiga h3,
.svc-taiga h4,
.svc-taiga h5,
.svc-taiga h6 {
    color: inherit;
    letter-spacing: normal;
}

/* Единственное место, где приходится отвечать на !important тем же.
   В design-upgrade.css лежит патч `.phone-cta__text { color: var(--brand-color)
   !important }` — его добавляли, потому что в main.css у этого текста цвет из
   несуществующей переменной. На Taiga-шаблоне блок тёмный, и тёмно-синий текст
   на нём не читается. Специфичностью !important не перебить, а снимать
   design-upgrade.css целиком нельзя: на нём держатся шапка и подвал.

   Прогнал остальные !important темы по классам этого слоя — пересечений больше
   нет: они все про .header / .footer / .section--trust-ratings, а те живут
   вне контейнера. */
.svc-taiga .phone-cta__text {
    color: rgba(255, 255, 255, 0.72) !important;
}

/* Тема снимает маркеры у всех списков (`ul, ol { list-style: none }`).
   Там, где макет на них рассчитывал — нумерованные и обычные списки в тексте
   услуги, — возвращаем. У .checklist и .sources__list маркеры сняты самой
   дизайн-системой, их не трогаем. */
.svc-taiga .prose ol {
    list-style: decimal;
    padding-inline-start: 1.5rem;
}

.svc-taiga .prose ul:not(.checklist) {
    list-style: disc;
    padding-inline-start: 1.5rem;
}

/* --------------------------- Появление секций ---------------------------- */

/* В макете `.reveal` изначально прозрачен, и без JS страница остаётся пустой.
   Здесь стартовое состояние включается классом, который ставит скрипт: не
   загрузился или упал — контент просто виден сразу. */
.svc-taiga .reveal {
    opacity: 1;
    transform: none;
}

.svc-taiga.has-reveal .reveal:not(.is-visible) {
    opacity: 0;
    transform: translateY(1.25rem);
}

/* ------------------------------ Прайс ----------------------------------- */

/* Строка-группа (item_row_type = group): подзаголовок внутри таблицы. */
.svc-taiga .price-table__group td {
    padding-block: 1rem 0.5rem;
    background: var(--tui-background-neutral-1);
}

.svc-taiga .price-table__group .price-table__name {
    font: var(--tui-font-text-s);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tui-text-secondary);
}

/* Выделенная позиция (item_highlight): бледная подложка, а не акцентная —
   на насыщенной красная цена и серая подсказка теряют контраст. */
.svc-taiga .price-table__row--hl td {
    background: var(--tui-status-info-pale);
}

.svc-taiga .price-table__row--hl .price-table__price {
    color: var(--brand-accent);
}

.svc-taiga .price-table__name [tuiBadge] {
    margin-inline-start: 0.5rem;
    vertical-align: middle;
}

/* --------------------------- Переключатель темы -------------------------- */

/* В макете кнопка жила в тёмном топбаре. Здесь шапка принадлежит теме, поэтому
   переключатель висит отдельной плашкой у правого края — над липкой панелью,
   чтобы не перекрывать её кнопки. */
.svc-taiga .theme-toggle {
    position: fixed;
    inset-inline-end: 1rem;
    inset-block-end: 1rem;
    z-index: 80;
    color: var(--tui-text-secondary);
    background: var(--tui-background-elevation-3);
    border: 1px solid var(--tui-border-normal);
    box-shadow: var(--tui-shadow-small);
}

.svc-taiga .theme-toggle:hover {
    background: var(--tui-background-neutral-1);
    color: var(--tui-text-primary);
}

@media (max-width: 62rem) {

    /* Липкая панель занимает низ экрана — уводим кнопку выше неё. */
    .svc-taiga .theme-toggle {
        inset-block-end: 5.25rem;
    }

}

/* ------------------------------- Лицензия -------------------------------- */

/* Скан открывается в полном размере: оверлей появляется при наведении. */
.svc-taiga .license__img a {
    position: relative;
    display: block;
}

.svc-taiga .license__img .license__zoom {
    position: absolute;
    inset-block-end: 0;
    inset-inline: 0;
    padding: 0.625rem;
    font: var(--tui-font-text-s);
    text-align: center;
    color: #fff;
    background: rgba(20, 41, 66, 0.72);
    opacity: 0;
    transition: opacity var(--tui-duration-fast);
}

.svc-taiga .license__img a:hover .license__zoom,
.svc-taiga .license__img a:focus-visible .license__zoom {
    opacity: 1;
}

/* -------------------------------- Формы ---------------------------------- */

/* .field — только контейнер поля и подписи об ошибке. */
.svc-taiga .field {
    display: grid;
    gap: 0.375rem;
}

.svc-taiga .form-status {
    padding: 0.75rem 1rem;
    border-radius: var(--tui-radius-m);
    font: var(--tui-font-text-s);
}

.svc-taiga .form-status--success {
    color: var(--tui-status-positive);
    background: var(--tui-status-positive-pale);
}

.svc-taiga .form-status--error {
    color: var(--tui-status-negative);
    background: var(--tui-status-negative-pale);
}

.svc-taiga [id] {
    scroll-margin-block-start: 7rem;
}

/* Липкую панель отдаёт шаблон (.mobile-bar) — своя от footer.php была бы второй. */
body.svc-taiga-page .sticky-cta {
    display: none !important;
}

@media (max-width: 62rem) {

    /* Место под .mobile-bar: она fixed и иначе перекроет конец страницы. */
    body.svc-taiga-page {
        padding-block-end: 4.5rem;
    }
}