:root {
    --brand: var(--color-primary, #2563eb);
    --brand-contrast: #ffffff;
    --text: var(--color-text, #0f172a);
    --muted: #475569;
    --bg: var(--color-bg, #ffffff);
    --bg-soft: #0f172a;
    --card: var(--color-card, #ffffff);
    --border: var(--color-border, #e2e8f0);
    --ring: rgba(37, 99, 235, 0.25);
    --success: #16a34a;
    --warning: #d97706;
    --danger:  #dc2626;
    --radius-xl: 1.25rem;
    --radius-lg: .875rem;
    --radius-md: .625rem;
    --site-header-height: var(--site-header-height, 80px); /* можно переопределить глобально */
    --section-title: #e2e8f0;
    --card-bg: #161822;
    --card-title: #e2e8f0;
}
.theme-light {
    --border: #fff;
    --bg-border: #fff;
    --bg-soft: #f1f5f9;
    --card-title: #222e3a;
    --card-bg: #fff;
    --section-title: #222e3a;
}
a {
    color: var(--color-primary);
}

.product { color: var(--text); }
.product__container {
    width: min(1200px, 92vw);
    margin: 0 auto;
}
.product__grid { display:grid; gap:24px; }

.product__button { display:inline-flex; align-items:center; gap:10px; padding:12px 18px; border-radius: var(--radius-lg); border:1px solid var(--brand); color: var(--brand-contrast); background: var(--brand); text-decoration:none; font-weight:600; box-shadow: 0 2px 8px var(--ring); }
.product__button:hover { filter: brightness(0.98); }
.product__button--ghost { background: transparent; color: var(--brand); }

.product-intro {
    position: relative;
    text-align: center;
    padding: 64px 30px 20px;
    background: linear-gradient(rgba(37, 99, 235, 0.06) 0%, rgba(37, 99, 235, 0) 60%);
    margin: 0 auto 36px;
}
.product-intro__title {
    font-size: 2.1rem;
    margin-bottom: 14px;
    color: var(--section-title);
    line-height: 1.12;
    letter-spacing: -0.02em;
}
.product-intro__desc {
    color: var(--muted);
    font-size: 1.11rem;
    font-weight: 400;
    line-height: 1.5;
    width: 680px;
    margin: 0 auto;
}

.products {
    max-width: 1200px;
    margin: 36px auto;
}
.product-cards {
    padding-bottom: 38px;
}
.product-cards__grid {
    display:grid;
    gap: 25px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.product-card {
    background: var(--card-bg);
    border-radius: var(--radius-xl);
    padding: 22px; display:flex;
    flex-direction: column; gap: 10px;
    transition: transform .15s ease, box-shadow .15s ease;
}
.product-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(2,6,23,.08); }
.product-card__title {
    color: var(--card-title);
    margin: 0;
    font-size: 20px;
}
.product-card__text {
    margin: 0; color: var(--muted);
}
.product-card__bullets {
    display:flex;
    flex-wrap: wrap; gap: 8px 12px;
    margin-top: 8px;
}
.product-card__chip {
    color: var(--section-title);
    font-size: 13px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--bg-soft);
    border:1px solid var(--border);
}

.section {
    padding: 25px 0;
}
.section__title {
    color: var(--section-title);
    font-size: 26px;
    margin: 0 0 14px;
    letter-spacing: -0.01em;
}
.section__muted {
    color: var(--muted);
}

.product-features__grid {
    display:grid;
    gap: 16px;
    grid-template-columns: repeat(4, minmax(0,1fr));
}
.product-features__item {
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    padding: 16px;
}
.product-features__item-title {
    color: var(--card-title);
    margin: 0 0 6px;
    font-size: 16px;
}
.product-features__item-text { margin: 0; font-size: 14px; color: var(--muted); }

.product-steps__grid {
    counter-reset: step;
    display:grid;
    gap: 16px;
    grid-template-columns: repeat(3,minmax(0,1fr));
}
.product-steps__item {
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    padding: 25px; position: relative;
}
.product-steps__item::before { counter-increment: step; content: counter(step); position: absolute; top: -10px; left: -10px; width: 36px; height: 36px; background: var(--brand); color: var(--brand-contrast); border-radius: 10px; display:grid; place-items:center; font-weight: 700; box-shadow: 0 6px 14px var(--ring); }
.product-steps__item-title {
    color: var(--card-title);
    margin: 0 0 4px;
}
.product-steps__item-text { margin: 0; color: var(--muted); }
.product-cta__footnote {
    color: var(--section-title);
}

@media (prefers-color-scheme: dark) {
    :root { --text:#e2e8f0; --muted:#94a3b8; --bg:#0b1220; --bg-soft:#0f172a; --card:#0f172a; }
}
@media (max-width: 800px) {
    .products {
        padding: 0 25px;
    }
    .product-steps__grid {
        grid-template-columns: repeat(1,minmax(0,1fr));
    }
    .product-intro__desc {
        width: auto;
    }

    .product-features__grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}