/* Згенеровано web/packages/ui/scripts/sync-maket.mjs з design/maket/e. НЕ ПРАВИТИ руками — правки зникнуть при наступному запуску. */
/* ZRAZU · E — розділ «content»: контент: ціни, студіям, API, про нас, довіра, статус, контакти, допомога й статті, глосарій, гайди, юридичні сторінки, 404.
   Файл-власник розділу: пише лише автор розділу. Спільне (токени, компоненти, раскладки) тут не перевизначається —
   якщо бракує компонента, попросіть власника дизайн-системи (AUTHORING.md). Класи — з префіксом розділу. */

/* ---------- спільна структура сторінок розділу (ct-) ---------- */
.ct-grid{padding:8px 0 72px}
.ct-main{max-width:920px}
.ct-main-wide{max-width:none}
.ct-sec{margin-top:44px}
.ct-sec-first{margin-top:0}
.ct-sec + .ct-sec{padding-top:8px}
.ct-search{margin-top:28px;max-width:520px}
.ct-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:28px}
.p-old-s{color:var(--text-3);font-weight:500;margin-left:6px}
html[data-page="content/prices"] .tbl tbody td.num:nth-child(3){color:var(--save-ink)}   /* колонка «2 роки» — вигода (Р172-4, власник дизайн-системи) */
/* Телефон: чотири колонки з паддінгом 18 px і словом «Перевірити» не влазили в 350 px — дія виїжджала за край
   таблиці (горизонтальна прокрутка всередині .tbl-wrap), рядки роздувало. Стара ціна — під новою, дія — стрілка
   (текст лишається для читача з екрана), заголовки колонок можуть перенестися. */
@media (max-width:600px){
  html[data-page="content/prices"] .tbl th,html[data-page="content/prices"] .tbl td{padding:12px 10px}
  html[data-page="content/prices"] .tbl thead th{white-space:normal}
  html[data-page="content/prices"] .tbl .p-old-s{display:block;margin:2px 0 0}
  html[data-page="content/prices"] .tbl td:last-child{width:44px;padding-left:0}
  html[data-page="content/prices"] .tbl .btn-arrow{min-width:44px;min-height:44px;justify-content:center;margin:0}
  html[data-page="content/prices"] .tbl .btn-arrow > span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html[data-page="content/prices"] .tbl .btn-arrow::after{content:"→";font-size:18px;line-height:1}
}
#ctWaitChips{margin-top:12px}

/* ---------- /studios/ ---------- */
.ct-steps{margin:0;padding:0;list-style:none;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.ct-steps li{padding:16px 18px;border-radius:var(--r-md);background:var(--fill-1);border:1px solid var(--line)}
.ct-steps b{display:block;font-size:15px;margin-bottom:4px}
.ct-steps span{display:block;font-size:14px;color:var(--text-2)}
.ct-steps .ct-step-n{font-family:var(--mono);font-size:13px;color:var(--text-3);display:block;margin-bottom:6px}
.ct-steps-col{grid-template-columns:1fr;margin-top:28px}
.ct-steps-col li{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:baseline}
.ct-steps-col .ct-step-n{grid-row:1 / 3;margin:0}
.ct-steps-col b,.ct-steps-col span{grid-column:2}

/* ---------- /api/ ---------- */
.ct-code{display:block;white-space:pre;overflow-x:auto;background:var(--surface-2,var(--fill-1));border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;font-family:var(--mono);font-size:13.5px;line-height:1.6;color:var(--text)}
.ct-scopes{display:grid;gap:2px;border-top:1px solid var(--line)}
.ct-scopes > div{display:grid;grid-template-columns:minmax(160px,.9fr) minmax(0,1.6fr) auto;gap:6px 20px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line)}
.ct-scopes dt{font-family:var(--mono);font-size:14px;color:var(--text)}
.ct-scopes dd{margin:0;font-size:14px;color:var(--text-2)}
.ct-class{justify-self:end;font-size:12px;font-weight:650;padding:2px 8px;border-radius:999px;background:var(--fill-2);color:var(--text-2);white-space:nowrap}
.ct-class[data-c="3"]{background:var(--warn-bg);color:var(--warn)}

/* ---------- /trust/, /about/ ---------- */
.ct-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.ct-list li{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--text)}
.ct-list .ic{flex:none;margin-top:2px;color:var(--text-2)}
.ct-no li .ic{color:var(--warn)}

/* ---------- /status/ ---------- */
.ct-status{margin:0;padding:0;list-style:none;display:grid;gap:1px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--line)}
.ct-status li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:var(--surface)}
.ct-status b{font-weight:600;font-size:15px}

/* ---------- /contacts/ ---------- */
.ct-chan{margin:0;padding:0;list-style:none;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ct-chan li{padding:18px;border-radius:var(--r-md);background:var(--fill-1);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.ct-chan .ic{color:var(--text-2)}
.ct-chan b{font-size:16px}
.ct-chan a.mono{word-break:break-all;display:inline-flex;align-items:center;min-height:24px}
@media (pointer:coarse){ .ct-chan a.mono{min-height:44px} }

/* ---------- /help/, /guides/ хаби ---------- */
.ct-cards{margin:0;padding:0;list-style:none;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.ct-cards a{display:block;padding:18px 20px;border-radius:var(--r-md);background:var(--fill-1);border:1px solid var(--line);color:var(--text);text-decoration:none}
.ct-cards a:hover{border-color:var(--line-2);background:var(--fill-2)}
.ct-cards b{display:block;font-size:16px;margin-bottom:4px}
.ct-cards span{display:block;font-size:14px;color:var(--text-2)}

/* ---------- /glossary/ ---------- */
.ct-gloss-nav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 28px;padding:0;list-style:none}
.ct-gloss-nav a{display:inline-flex;min-width:32px;min-height:32px;align-items:center;justify-content:center;padding:0 8px;border-radius:8px;color:var(--text-2);text-decoration:none;font-weight:600;font-size:14px}
.ct-gloss-nav a:hover{background:var(--fill-2);color:var(--text)}
@media (pointer:coarse){ .ct-gloss-nav a{min-width:44px;min-height:44px} }
.ct-term{padding:20px 0;border-bottom:1px solid var(--line);scroll-margin-top:100px}
.ct-term dt{font-size:19px;font-weight:680;letter-spacing:-.02em;margin:0 0 6px;display:flex;align-items:center;gap:8px}
.ct-term dt .mono{font-size:14px;font-weight:500;color:var(--text-2)}
.ct-term dd{margin:0;font-size:15.5px;line-height:1.6;color:var(--text-2);max-width:64ch}
.ct-term dd a{color:var(--text-2)}

/* ---------- /changelog/ ---------- */
.ct-feed{margin:28px 0 0;padding:0;list-style:none;display:grid;border-top:1px solid var(--line)}
.ct-feed-i{padding:18px 0;border-bottom:1px solid var(--line)}
.ct-feed-meta{display:flex;align-items:center;gap:10px;margin:0 0 6px;font-size:13px;color:var(--text-3)}
.ct-feed-meta time{font-family:var(--mono)}
.ct-feed-tag{padding:2px 10px;font-size:13px;pointer-events:none}
.ct-feed-h{margin:0 0 4px;font-size:17px;font-weight:640}
.ct-feed-h a{display:inline-flex;align-items:center;min-height:24px;color:var(--text);text-decoration:none}
@media (pointer:coarse){ .ct-feed-h a{min-height:44px} }
.ct-feed-h a:hover{text-decoration:underline}
.ct-feed-t{margin:0;font-size:14.5px;line-height:1.55;color:var(--text-2);max-width:72ch}
/* видима підпис статті (§17) — .byline зі спільного components.css дає --text-3 (< AAA); у розділі content піднімаємо до --text-2 (AAA скрізь), не чіпаючи спільний клас */
.ct .byline{color:var(--text-2)}

/* ---------- юридичні сторінки ---------- */
.ct-draft{display:flex;gap:12px;align-items:flex-start;margin-bottom:28px}
.ct-draft .ic{color:var(--warn);margin-top:2px;flex:none}

/* ---------- 404 ---------- */
.ct-404{padding:64px 0 88px;text-align:center}
.ct-404-code{font-family:var(--mono);font-size:15px;color:var(--text-3);margin:0 0 8px}
.ct-404 .lead{margin-inline:auto}
.ct-404-search{margin:28px auto 32px}
.ct-404-chips{justify-content:center}

/* ---- світла тема (власник дизайн-системи, 28.09.2026; темна не змінюється): картки — білі з теплою тінню, номери кроків — фіалкові ---- */
[data-theme="light"] .ct-cards a,[data-theme="light"] .ct-steps li,[data-theme="light"] .ct-chan li{background:var(--surface);box-shadow:var(--card-shadow)}
[data-theme="light"] .ct-cards a:hover{background:var(--surface);border-color:var(--accent-line)}
[data-theme] .ct-steps .ct-step-n{color:var(--hue-ssl)}
[data-theme] .ct-chan .ic{color:var(--hue-ssl)}
[data-theme="light"] .ct-status{box-shadow:var(--card-shadow)}

/* ---------- підпис статті (seo-plan.md P1 п.11): ті самі дати, що в JSON-LD Article ---------- */

/* /resellers/ — варіанти підключення карточками (Р317-52) */
.ct-rs-vars{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ct-rs-vars li{display:flex;flex-direction:column;gap:8px}
.ct-rs-vars b{margin:0}
.ct-rs-vars .st{display:inline-flex;align-self:flex-start}
.ct-rs-vars .ct-rs-chg{margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}
.ct-rs-vars .ct-rs-chg span{display:inline}
.ct-rs-vars .ct-rs-l{color:var(--text-3)}