/* =========================================================================
   Центр 100300 — the design of 100300.ru, the product's own site.
   Child of «Default»: its stylesheet is imported first, this file adds
   the few things the Centre needs on top:

   - the owner's accent / emphasis colours, font and card radius (design
     controls, `--centre-*`), mapped onto Default's tokens;
   - the catalogue of modules and templates (/market) and the licence
     pages of the account, restyled as cards with prices;
   - legal documents (the offer, the policies, the consent): a readable
     measure, numbered headings, requisites tables.

   The home page is built from Default's blocks, exactly like
   cms.100300.ru, so it looks the same as the demo site.
   ========================================================================= */

@import url("../../../default/assets/css/theme.css");

/* --- fonts (shipped with the default theme; downloaded only when chosen) --- */
@font-face {
    font-family: 'Centre Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../../../default/assets/fonts/inter-cyrillic-wght-normal.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Centre Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../../../default/assets/fonts/inter-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2199, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Centre Manrope';
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("../../../default/assets/fonts/manrope-cyrillic-wght-normal.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Centre Manrope';
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("../../../default/assets/fonts/manrope-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2199, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Centre Onest';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../../../default/assets/fonts/onest-cyrillic-wght-normal.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Centre Onest';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../../../default/assets/fonts/onest-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2199, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Centre Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../../../default/assets/fonts/lora-cyrillic-wght-normal.woff2") format("woff2");
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Centre Lora';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../../../default/assets/fonts/lora-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2199, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* -------------------------------------------------------------------------
   1. Design controls → Default's tokens
   ------------------------------------------------------------------------- */

:root {
    --centre-accent: #2b50c8;
    --centre-mark: #c8892b;
    --centre-font: 'Segoe UI', 'Segoe UI Variable Text', system-ui, -apple-system, Roboto, Arial, sans-serif;
    --centre-doc-font: 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
    --centre-radius: 12px;

    --c-accent: var(--centre-accent);
    --c-accent-hover: color-mix(in srgb, var(--centre-accent) 80%, #000);
    --c-accent-soft: color-mix(in srgb, var(--centre-accent) 12%, #fff);
    --c-mark: var(--centre-mark);
    --c-mark-text: color-mix(in srgb, var(--centre-mark) 70%, #000);
    --c-mark-soft: color-mix(in srgb, var(--centre-mark) 14%, #fff);
    --font-ui: var(--centre-font);
    --font-display: var(--centre-font);
    --card-radius: var(--centre-radius);
    --r-md: var(--centre-radius);
}

@media (prefers-color-scheme: dark) {
    :root {
        --c-accent: color-mix(in srgb, var(--centre-accent) 55%, #fff);
        --c-accent-hover: color-mix(in srgb, var(--centre-accent) 38%, #fff);
        --c-accent-soft: color-mix(in srgb, var(--centre-accent) 22%, #0e1117);
        --c-accent-contrast: #0b0e14;
        --c-mark: color-mix(in srgb, var(--centre-mark) 80%, #fff);
        --c-mark-text: color-mix(in srgb, var(--centre-mark) 65%, #fff);
        --c-mark-soft: color-mix(in srgb, var(--centre-mark) 18%, #0e1117);
    }
}

/* -------------------------------------------------------------------------
   2. The catalogue (/market) and a package's page
   ------------------------------------------------------------------------- */

.vendor-market {
    max-width: var(--w-wide, 82rem);
    padding-inline: var(--gutter, 1rem);
}

.vendor-market h1 {
    font-family: var(--font-display);
    font-size: var(--t-2xl, 2.5rem);
    line-height: var(--lh-tight, 1.1);
    letter-spacing: var(--tr-tight, -0.02em);
    color: var(--c-text-strong);
    margin-bottom: var(--s-3, 0.75rem);
}

.vendor-market h2 {
    font-size: var(--t-lg, 1.4rem);
    margin: var(--s-6, 2rem) 0 var(--s-3, 0.75rem);
}

.vendor-market__head .vendor-muted {
    max-width: 44rem;
    font-size: var(--t-md, 1.15rem);
}

.vendor-muted {
    color: var(--c-text-muted);
}

.vendor-tabs {
    gap: var(--s-2, 0.5rem);
}

.vendor-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 var(--s-4, 1rem);
    border: 1px solid var(--c-border);
    border-radius: var(--r-pill, 999px);
    color: var(--c-text);
    text-decoration: none;
    transition: border-color var(--dur, 140ms) var(--ease, ease), background-color var(--dur, 140ms) var(--ease, ease);
}

.vendor-tabs a:hover {
    border-color: var(--c-accent);
}

.vendor-tabs a[aria-current="page"] {
    background: var(--c-accent);
    border-color: var(--c-accent);
    color: var(--c-accent-contrast, #fff);
}

.vendor-grid {
    gap: var(--s-5, 1.5rem);
}

.vendor-card__link {
    background: var(--c-surface);
    border-color: var(--c-border);
    border-radius: var(--centre-radius);
    transition: border-color var(--dur, 140ms) var(--ease, ease), transform var(--dur, 140ms) var(--ease, ease), box-shadow var(--dur, 140ms) var(--ease, ease);
}

html[data-centre-cards="raised"] .vendor-card__link {
    box-shadow: 0 1px 2px rgba(18, 21, 28, 0.05), 0 12px 28px -18px rgba(18, 21, 28, 0.35);
}

.vendor-card__link:hover,
.vendor-card__link:focus-visible {
    border-color: var(--c-accent);
}

html[data-centre-cards="raised"] .vendor-card__link:hover {
    transform: translateY(-2px);
}

.vendor-card__img {
    background: var(--c-surface-sunk);
    border-bottom: 1px solid var(--c-border);
}

.vendor-card__title {
    color: var(--c-text-strong);
    font-size: var(--t-md, 1.15rem);
}

.vendor-card__summary {
    color: var(--c-text-muted);
    font-size: var(--t-sm, 0.9rem);
    line-height: var(--lh-ui, 1.45);
}

.vendor-card__price {
    padding-top: var(--s-2, 0.5rem);
    color: var(--c-mark-text);
    font-size: var(--t-lg, 1.3rem);
    font-variant-numeric: tabular-nums;
}

.vendor-package__head h1 {
    margin-bottom: var(--s-2, 0.5rem);
}

.vendor-package__buy {
    padding: var(--s-5, 1.5rem);
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--centre-radius);
    max-width: 24rem;
}

.vendor-package__buy .vendor-card__price {
    padding-top: 0;
    font-size: var(--t-xl, 1.8rem);
}

.vendor-package__buy .cms-btn {
    justify-content: center;
    min-height: 44px;
}

.vendor-package__lead {
    max-width: var(--w-prose, 38rem);
    font-size: var(--t-md, 1.15rem);
    margin: var(--s-5, 1.5rem) 0 var(--s-3, 0.75rem);
}

.vendor-package__text {
    max-width: var(--w-prose, 38rem);
    line-height: var(--lh-prose, 1.7);
}

.vendor-shots img {
    border-color: var(--c-border);
    border-radius: var(--centre-radius);
}

.vendor-crumbs a {
    color: var(--c-link, var(--c-accent));
}

.vendor-card__demo {
    min-height: 40px;
    border-color: var(--c-border);
    background: var(--c-surface);
    color: var(--c-text-strong);
    transition: border-color var(--dur, 140ms) var(--ease, ease), color var(--dur, 140ms) var(--ease, ease);
}

.vendor-card__demo:hover,
.vendor-card__demo:focus-visible {
    border-color: var(--c-accent);
    color: var(--c-link, var(--c-accent));
}

.vendor-shots__link img {
    transition: border-color var(--dur, 140ms) var(--ease, ease);
}

.vendor-shots__link:hover img {
    border-color: var(--c-accent);
}

.vendor-download__lead {
    color: var(--c-text-muted);
    font-size: var(--t-md, 1.15rem);
}

.vendor-download__card {
    background: var(--c-surface);
    border-color: var(--c-border);
    border-radius: var(--centre-radius);
}

html[data-centre-cards="raised"] .vendor-download__card {
    box-shadow: 0 1px 2px rgba(18, 21, 28, 0.05), 0 12px 28px -18px rgba(18, 21, 28, 0.35);
}

.vendor-download__facts dt {
    color: var(--c-text-muted);
}

.vendor-download__more a {
    color: var(--c-link, var(--c-accent));
}

/* The account's licences and the checkout's licence step */
.vendor-licence__facts dt {
    color: var(--c-text-muted);
}

.vendor-terms {
    margin-top: var(--s-3, 0.75rem);
}

.vendor-terms a,
.shop-check a,
.shop-form__check a,
.shop-mform__check a,
.cms-form__check a {
    color: var(--c-link, var(--c-accent));
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* -------------------------------------------------------------------------
   3. Legal documents (the offer, the policies, the consent, requisites)
   ------------------------------------------------------------------------- */

.centre-doc {
    font-family: var(--centre-doc-font);
    font-size: var(--t-base, 1rem);
    line-height: 1.65;
    color: var(--c-text);
    max-width: 46rem;
}

/* One measure for the whole document: Default caps text-block paragraphs at 38rem. */
.cms-block--text .centre-doc :is(p, ul, ol) {
    max-width: none;
}

.centre-doc > * + * {
    margin-top: var(--s-3, 0.75rem);
}

.centre-doc h2 {
    margin-top: var(--s-7, 3rem);
    margin-bottom: var(--s-3, 0.75rem);
    padding-top: var(--s-4, 1rem);
    border-top: 1px solid var(--c-border);
    font-family: var(--font-display);
    font-size: var(--t-lg, 1.35rem);
    line-height: var(--lh-snug, 1.25);
    color: var(--c-text-strong);
    scroll-margin-top: 6rem;
}

.centre-doc h2:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.centre-doc h3 {
    margin-top: var(--s-5, 1.5rem);
    font-size: var(--t-md, 1.15rem);
    color: var(--c-text-strong);
}

.centre-doc ul,
.centre-doc ol {
    padding-left: 1.4em;
}

.centre-doc li + li {
    margin-top: var(--s-1, 0.25rem);
}

.centre-doc a {
    color: var(--c-link, var(--c-accent));
    overflow-wrap: anywhere;
}

.centre-doc__meta {
    color: var(--c-text-muted);
    font-size: var(--t-sm, 0.9rem);
}

.centre-doc__note {
    padding: var(--s-4, 1rem) var(--s-5, 1.5rem);
    background: var(--c-accent-soft);
    border-radius: var(--centre-radius);
}

.centre-doc__toc {
    padding: var(--s-4, 1rem) var(--s-5, 1.5rem);
    background: var(--c-surface-sunk);
    border-radius: var(--centre-radius);
}

.centre-doc__toc ol {
    margin: 0;
    columns: 2 18rem;
    column-gap: var(--s-6, 2rem);
}

.centre-doc__toc li {
    break-inside: avoid;
}

.centre-doc table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--t-sm, 0.95rem);
}

.centre-doc th,
.centre-doc td {
    padding: var(--s-2, 0.5rem) var(--s-3, 0.75rem);
    border-bottom: 1px solid var(--c-border);
    text-align: left;
    vertical-align: top;
}

.centre-doc th {
    width: 38%;
    color: var(--c-text-muted);
    font-weight: 500;
}

@media (max-width: 560px) {
    .centre-doc th,
    .centre-doc td {
        display: block;
        width: auto;
        padding-inline: 0;
    }

    .centre-doc th {
        padding-bottom: 0;
        border-bottom: 0;
    }
}

/* The requisites column of the footer keeps its lines. */
.ftr-col--text .ftr-text {
    line-height: 1.6;
}

@media (prefers-reduced-motion: reduce) {
    .vendor-card__link,
    .vendor-tabs a {
        transition: none;
    }

    html[data-centre-cards="raised"] .vendor-card__link:hover {
        transform: none;
    }
}

/* «Скачать CMS» is a button in the header; the same item of the main menu
   is for the phone drawer — not twice in the desktop row. */
header:has(.hdr-button[href="/download"]) .hdr-nav__item:has(> .hdr-nav__link[href="/download"]) {
    display: none;
}
