/* =========================================================
   Site Toolkit — Service cards (2 layouts) v3
   Optimized: absolute-positioned actions (no layout shift),
              minimal transitions, no CSS bloat.
   ========================================================= */

/* Общий glass-ef */
.glass-ef {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.035);
    backdrop-filter: blur(3px) saturate(130%);
    -webkit-backdrop-filter: blur(4px) saturate(130%);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.6),
        inset 0 -1px 1px rgba(255, 255, 255, 0.15),
        0 8px 30px rgba(0, 0, 0, 0.08);
}
.glass-ef::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.025) 35%,
        rgba(255, 255, 255, 0.01) 100%
    );
    z-index: 0;
}

/* =========================================================
   Wrapper + grid
   ========================================================= */
.loco-services {
    box-sizing: border-box;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    font-family: var(--ltk-font, "Gilroy", "Inter", system-ui, sans-serif);
}
.loco-services *,
.loco-services *::before,
.loco-services *::after { box-sizing: border-box; }

.loco-services__grid {
    display: grid;
    gap: 32px;
}
.loco-services--home .loco-services__grid    { grid-template-columns: repeat(3, 1fr); }
.loco-services--catalog .loco-services__grid { grid-template-columns: repeat(4, 1fr); }

/* =========================================================
   A) HOME CARD
   ========================================================= */
.loco-svc-card {
    padding-top: 44px; /* иконка торчит на 50% (88/2) */
    position: relative;
    display: block;
    text-decoration: none !important;
    color: inherit;
}

/* Иконка-плитка glass-ef */
.loco-svc-card__icon {
    position: absolute;
    top: 0;
    left: 32px;
    z-index: 3;
    width: 88px;
    height: 88px;
    padding: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--icon-radius, 24px);
    transition: transform .25s ease;
}
.loco-svc-card__icon svg,
.loco-svc-card__icon img {
    width: 40px !important;
    height: 40px !important;
    display: block;
    position: relative;
    z-index: 1;
}
.loco-svc-card__icon svg [fill]:not([fill="none"])     { fill: var(--ltk-primary, #1F65E9); }
.loco-svc-card__icon svg [stroke]:not([stroke="none"]) { stroke: var(--ltk-primary, #1F65E9); }

/* Body */
.loco-svc-card__body {
    position: relative;
    background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%);
    box-shadow: 2px 0 9px -2px rgba(30, 86, 195, 0.60);
    border-radius: 24px;
    padding: 24px 32px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-end;
    transition: background .3s ease;
}

/* Badge (правий верх) */
.loco-svc-card__badge {
    padding: 4px 8px;
    background: #FFFFFF;
    border-radius: 8px;
    color: #6687BE !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    font-family: inherit !important;
    text-transform: uppercase !important;
    align-self: flex-end;
}

.loco-svc-card__row {
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    gap: 8px;
    /* Резервируем справа место чтобы chevron (absolute 56px + right:32px)
       не наезжал на текст meta */
    padding-right: 64px;
}
.loco-svc-card__text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.loco-svc-card .loco-svc-card__title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ltk-blue-600, #1E56C3) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    font-family: inherit !important;
    text-transform: none !important;
    text-decoration: none !important;
    word-wrap: break-word;
}
.loco-svc-card .loco-svc-card__desc {
    margin: 0 !important;
    color: var(--ltk-neutral-600, #415170) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    font-family: inherit !important;
}
.loco-svc-card .loco-svc-card__meta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    color: var(--ltk-neutral-900, #1E1E1E) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    font-family: inherit !important;
    line-height: 1 !important;
}
.loco-svc-card__meta svg { width: 20px; height: 20px; flex: 0 0 auto; }
.loco-svc-card__meta svg [fill]:not([fill="none"]) { fill: var(--ltk-neutral-900, #1E1E1E); }

/* Chevron — absolute в правом нижнем углу карточки.
   Стоит на месте actions, при hover скрывается. */
.loco-svc-card__cta {
    position: absolute;
    right: 32px;
    bottom: 24px;
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: transparent;
    outline: 1px solid var(--ltk-primary, #1F65E9);
    outline-offset: -1px;
    color: var(--ltk-blue-600, #1E56C3);
    text-decoration: none !important;
    transition: opacity .2s ease;
    z-index: 2;
}
.loco-svc-card__cta svg { width: 32px; height: 32px; display: block; }
.loco-svc-card__cta svg [fill]:not([fill="none"]) { fill: var(--ltk-blue-600, #1E56C3); }

/* ============ ACTIONS (2 кнопки) ============
   В ПОТОКЕ карточки, но резервируем место ЗАРАНЕЕ через margin-top:16px
   + фиксированную высоту 56px. Default: visibility hidden + opacity 0
   (место занято, но не видны). На hover — становятся видимы.
   Chevron в default state стоит ПОВЕРХ actions (absolute), скрывается при hover.
   Высота карточки от hover НЕ меняется — соседи не двигаются. */
.loco-svc-card__actions {
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
    height: 56px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
}

/* Замовити — чёрная → синий градиент на hover */
.loco-svc-card__btn-primary {
    flex: 1;
    height: 56px;
    padding: 12px 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ltk-dark, #1E1E1E) !important;
    color: #FFFFFF !important;
    border-radius: 16px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    font-family: inherit !important;
    border: 0;
    cursor: pointer;
    transition: background .2s ease;
}
.loco-svc-card__btn-primary:hover {
    background: var(--ltk-grad-primary, linear-gradient(90deg, #034DCF 0%, #3074F9 100%)) !important;
}

/* Детальніше — outline blue */
.loco-svc-card__btn-outlined {
    height: 56px;
    padding: 12px 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: transparent;
    outline: 1px solid var(--ltk-primary, #1F65E9);
    outline-offset: -1px;
    color: #303030 !important;
    border-radius: 16px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    font-family: inherit !important;
    transition: background .2s ease;
}
.loco-svc-card__btn-outlined:hover {
    background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #E8F2FD 100%);
}
.loco-svc-card__btn-outlined svg { width: 18px; height: 18px; }
.loco-svc-card__btn-outlined svg [fill]:not([fill="none"]) { fill: var(--ltk-primary, #1F65E9); }

/* ============ Desktop HOVER STATE ============
   При hover:
     • меняется bg body
     • иконка чуть приподнимается
     • chevron скрывается (opacity 0)
     • actions появляются absolute (НЕ меняют высоту карточки)
     • row `justify-content: space-between` меняем на flex-start чтобы chevron ушёл влево при opacity 0 не создавал баг */
@media (hover: hover) and (pointer: fine) {
    .loco-svc-card:hover .loco-svc-card__body {
        background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #B4D5FA 0%, #FEFDFF 79%, #DAE7F8 100%);
    }
    .loco-svc-card:hover .loco-svc-card__icon {
        transform: translateY(-2px);
    }
    /* Chevron уезжает */
    .loco-svc-card:hover .loco-svc-card__cta {
        opacity: 0;
        pointer-events: none;
    }
    /* Actions становятся видимы (место уже занято, высота не меняется) */
    .loco-svc-card:hover .loco-svc-card__actions {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        transition: opacity .25s ease, transform .25s ease, visibility 0s;
    }
}

/* ============ Touch / mobile / tablet ============
   Actions ВСЕГДА видны (место уже зарезервировано в потоке).
   Chevron скрыт. */
@media (hover: none), (pointer: coarse), (max-width: 1024px) {
    .loco-svc-card__cta { display: none; }
    .loco-svc-card__row { padding-right: 0; } /* убираем резерв под chevron */

    .loco-svc-card__actions {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
}

/* =========================================================
   B) CATALOG CARD (только одна кнопка Замовити)
   ========================================================= */
.loco-svc-card--catalog {
    padding-top: 0;
    background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%);
    box-shadow: 2px 0 9px -2px rgba(30, 86, 195, 0.60);
    border-radius: 32px;
    padding-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow: hidden;
    transition: background .3s ease, transform .25s ease, box-shadow .25s ease;
}
@media (hover: hover) and (pointer: fine) {
    .loco-svc-card--catalog:hover {
        background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #B4D5FA 0%, #FEFDFF 79%, #DAE7F8 100%);
        transform: translateY(-4px);
        box-shadow: 4px 8px 20px -2px rgba(30, 86, 195, 0.40);
    }
}
.loco-svc-card--catalog .loco-svc-card__image {
    width: 100%;
    height: 192px;
    display: block;
    object-fit: cover;
    border-radius: 24px;
    background: #EAF3FF;
}
.loco-svc-card--catalog .loco-svc-card__inner {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
}
.loco-svc-card--catalog .loco-svc-card__content {
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-self: stretch;
}
.loco-svc-card--catalog .loco-svc-card__title { color: var(--ltk-blue-600, #1E56C3) !important; }
.loco-svc-card--catalog .loco-svc-card__desc  { color: #6C7484 !important; }

.loco-svc-card__catalog-meta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    color: #414143 !important;
    font-size: 12px !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    line-height: 1;
}
.loco-svc-card__catalog-meta .loco-svc-card__meta { color: #414143 !important; }
.loco-svc-card__catalog-meta .loco-svc-card__meta svg [fill]:not([fill="none"]) { fill: #000; }
.loco-svc-card__catalog-dot {
    width: 4px;
    height: 4px;
    border-radius: 1px;
    background: var(--ltk-blue-600, #1E56C3);
    flex: 0 0 4px;
}
.loco-svc-card__price sup { font-size: 10px; }

/* Row кнопок в каталоге — ОДНА кнопка full-width */
.loco-svc-card--catalog .loco-svc-card__btn-row {
    padding: 0 24px;
    display: flex;
    align-self: stretch;
}
.loco-svc-card--catalog .loco-svc-card__btn-primary {
    flex: 1;
    width: 100%;
}

/* =========================================================
   C) CTA SLOT (v1.7.1) — Elementor-шаблон вставленный последней ячейкой грида
   ========================================================= */
.loco-svc-card--cta {
    grid-column: span var(--cta-span, 1);
    min-width: 0;
    display: flex;
    align-items: stretch;
    padding: 0;
    background: transparent;
}
/* CTA-контент должен растянуться на всю ячейку */
.loco-svc-card--cta > * {
    width: 100%;
    align-self: stretch;
}
/* Elementor-обёртки внутри CTA — убираем возможные внешние отступы,
   даём им заполнить всю ячейку */
.loco-svc-card--cta .elementor,
.loco-svc-card--cta .elementor-section,
.loco-svc-card--cta .elementor-container,
.loco-svc-card--cta .e-con {
    width: 100%;
    height: 100%;
    max-width: 100% !important;
}

/* =========================================================
   Tablet ≤1024
   ========================================================= */
@media (max-width: 1024px) {
    .loco-services--home .loco-services__grid    { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    .loco-services--catalog .loco-services__grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    /* CTA span больше не может быть >2 — ограничиваем */
    .loco-svc-card--cta { grid-column: span min(var(--cta-span, 1), 2); }
}

/* =========================================================
   Mobile ≤640
   ========================================================= */
@media (max-width: 640px) {
    .loco-services--home .loco-services__grid,
    .loco-services--catalog .loco-services__grid { grid-template-columns: 1fr; gap: 20px; }
    .loco-svc-card { padding-top: 40px; }
    .loco-svc-card__icon { left: 24px; width: 80px; height: 80px; padding: 20px; }
    .loco-svc-card__body { padding: 20px 24px; border-radius: 20px; }
    .loco-svc-card--catalog { border-radius: 24px; }
    .loco-svc-card--catalog .loco-svc-card__image { height: 200px; }
    .loco-svc-card--cta { grid-column: 1 / -1; }
}

/* =========================================================
   =========================================================
   SERVICE PAGE — HERO & PRICING (v1.7.0)
   Шорткоди: [loco_service_hero] · [loco_service_pricing]
   =========================================================
   ========================================================= */

/* =========================================================
   HERO
   ========================================================= */
.loco-svc-hero.loco-svc-hero {
    box-sizing: border-box;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    font-family: var(--ltk-font, "Gilroy","Inter",system-ui,sans-serif) !important;
    color: var(--ltk-neutral-900, #1E1E1E) !important;
}
.loco-svc-hero.loco-svc-hero *,
.loco-svc-hero.loco-svc-hero *::before,
.loco-svc-hero.loco-svc-hero *::after { box-sizing: border-box; }

.loco-svc-hero.loco-svc-hero .loco-svc-hero__grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 33px;
    align-items: start;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__left {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ltk-primary, #1F65E9) !important;
    font-family: inherit !important;
    font-size: 56px !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    word-wrap: break-word;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__subtitle {
    margin: 0 !important;
    color: #6C7484 !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__cta {
    align-self: flex-start;
    height: 56px;
    padding: 12px 24px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--ltk-dark, #1E1E1E) !important;
    color: #FFFFFF !important;
    border-radius: 16px !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    border: 0;
    cursor: pointer;
    transition: background var(--ltk-transition, 250ms ease);
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__cta:hover {
    background: var(--ltk-grad-primary, linear-gradient(90deg, #034DCF 0%, #3074F9 100%)) !important;
    color: #FFFFFF !important;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__image-wrap {
    width: 100%;
    aspect-ratio: 511 / 556;
    border-radius: 24px;
    overflow: hidden;
    background: var(--ltk-neutral-100, #EAF3FF);
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__right {
    display: flex;
    flex-direction: column;
    gap: 40px;
    min-width: 0;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__block {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__block-title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ltk-primary, #1F65E9) !important;
    font-family: inherit !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__block--dangers .loco-svc-hero__block-title {
    color: #E64C1E !important;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ltk-neutral-600, #415170) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__item-icon {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    display: block;
    color: var(--ltk-neutral-600, #415170);
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__item-icon svg {
    width: 24px;
    height: 24px;
    display: block;
}
.loco-svc-hero.loco-svc-hero .loco-svc-hero__item-text {
    flex: 1 1 0;
    min-width: 0;
    word-wrap: break-word;
}

/* HERO — Tablet ≤1024 */
@media (max-width: 1024px) {
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__left  { order: 2; gap: 24px; }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__image-wrap {
        order: 1;
        aspect-ratio: 348 / 556;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__right {
        order: 3;
        grid-column: 1 / -1;
        flex-direction: row;
        gap: 24px;
        margin-top: 24px;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__right--single {
        flex-direction: column;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__block { flex: 1 1 0; min-width: 0; }
}

/* HERO — Mobile ≤640 */
@media (max-width: 640px) {
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__left,
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__image-wrap,
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__right {
        order: initial;
        grid-column: auto;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__image-wrap {
        order: 1;
        aspect-ratio: 348 / 224;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__left  { order: 2; gap: 20px; }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__right {
        order: 3;
        flex-direction: column;
        gap: 24px;
        margin-top: 8px;
    }
    .loco-svc-hero.loco-svc-hero .loco-svc-hero__title {
        font-size: 38px !important;
        line-height: 1.05 !important;
    }
}

/* =========================================================
   PRICING
   ========================================================= */
.loco-svc-pricing.loco-svc-pricing {
    box-sizing: border-box;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    font-family: var(--ltk-font, "Gilroy","Inter",system-ui,sans-serif) !important;
    color: var(--ltk-neutral-900, #1E1E1E) !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}
.loco-svc-pricing.loco-svc-pricing *,
.loco-svc-pricing.loco-svc-pricing *::before,
.loco-svc-pricing.loco-svc-pricing *::after { box-sizing: border-box; }

.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__title {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center;
    color: var(--ltk-primary, #1F65E9) !important;
    font-family: inherit !important;
    font-size: 56px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tabs {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tab {
    padding: 16px 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border-radius: 16px;
    outline: 1px solid #AFC5EB;
    outline-offset: -1px;
    color: var(--ltk-neutral-900, #1E1E1E) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer;
    border: 0;
    transition: background var(--ltk-transition, 250ms ease);
    white-space: nowrap;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tab:hover {
    background: rgba(175, 197, 235, 0.35);
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tab.is-active {
    background: #AFC5EB !important;
    color: var(--ltk-neutral-900, #1E1E1E) !important;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table-wrap { width: 100%; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__panel { display: none; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__panel.is-active { display: block; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table th,
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td {
    padding: 16px 8px;
    border: 1px solid var(--ltk-neutral-200, #DCE7F8);
    color: var(--ltk-neutral-600, #415170) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    text-align: left;
    vertical-align: middle;
    background: transparent;
}
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td:first-child { font-weight: 700 !important; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table th:first-child { font-weight: 400 !important; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table th             { font-weight: 700 !important; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table thead tr th:first-child { border-top-left-radius: 16px; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table thead tr th:last-child  { border-top-right-radius: 16px; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table tbody tr:last-child td:first-child { border-bottom-left-radius: 16px; }
.loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table tbody tr:last-child td:last-child  { border-bottom-right-radius: 16px; }

/* PRICING — Mobile ≤640: cards instead of table */
@media (max-width: 640px) {
    .loco-svc-pricing.loco-svc-pricing { gap: 20px; }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__title {
        font-size: 38px !important;
        text-align: center;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tabs {
        gap: 8px;
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__tab {
        flex: 0 0 auto;
        padding: 14px 20px;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table,
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table thead,
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table tbody,
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table tr,
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table th,
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td {
        display: block;
        width: 100%;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table thead { display: none; }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table tr {
        border: 1px solid var(--ltk-neutral-200, #DCE7F8);
        border-radius: 16px;
        overflow: hidden;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td {
        border: 0;
        border-bottom: 1px solid var(--ltk-neutral-200, #DCE7F8);
        border-radius: 0 !important;
        padding: 14px 16px;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td:last-child { border-bottom: 0; }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td:first-child {
        background: var(--ltk-neutral-100, #EAF3FF);
        color: var(--ltk-neutral-900, #1E1E1E) !important;
        font-weight: 700 !important;
    }
    .loco-svc-pricing.loco-svc-pricing .loco-svc-pricing__table td[data-label]:not(:first-child)::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 4px;
        color: #6C7484 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        line-height: 1.2;
    }
}