/* Узгоджена шкала для каталогу. Зміни розмірів починати з цих tokens.
   Основа: Carbon productive typography / spacing; USWDS typesetting. */
:root {
  --type-body:1rem;
  --type-caption:.75rem;
  --type-small:.875rem;
  --type-card:1.25rem;
  --type-h3:1.5rem;
  --type-h2:1.75rem;
  --type-h1:2rem;
  --type-display:2.5rem;
  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-12:3rem;
}
body {font-size:var(--type-body);line-height:1.5}
h1,h2,h3,h4,h5,h6 {overflow-wrap:anywhere;letter-spacing:normal}
h1,.product__title,.page__title,.form__title {font-size:var(--type-h1);line-height:1.25}
h2 {font-size:var(--type-h2);line-height:1.286}
h3 {font-size:var(--type-h3);line-height:1.333}
h4 {font-size:1.125rem;line-height:1.333}
h5,h6 {font-size:1rem;line-height:1.5}
.hero h1 {font-size:var(--type-display);line-height:1.2}
.hero {min-height:0;padding-block:var(--space-12)}
.hero__grid {gap:var(--space-12)}
.hero__actions {margin-top:var(--space-6);gap:var(--space-3)}
.hero__quick {margin-top:var(--space-6)}
.lead,.product__lead {font-size:var(--type-body);line-height:1.5;margin-top:var(--space-4)}
.eyebrow {font-size:var(--type-caption);line-height:1.5;margin-bottom:var(--space-3);letter-spacing:.08em}
.section {padding-block:var(--space-12)}
.section h2,.cs-newsletter>h2 {margin-bottom:var(--space-6)}
.section-head {margin-bottom:var(--space-6)}
.cards,.dle-results:has(>.card),.dle-results #dle-content:has(>.card),.related-products__grid {gap:var(--space-6)}
.card__body {padding:var(--space-6);gap:var(--space-3);min-width:0}
.card__title,.card h2,.card h3,.card__name {font-size:var(--type-card);line-height:1.4;letter-spacing:normal;margin:0;overflow-wrap:anywhere}
.card__desc {font-size:var(--type-small);line-height:1.571;margin:0}
.card__desc p {margin:0 0 var(--space-3)}
.card__meta {font-size:var(--type-caption);line-height:1.5;gap:var(--space-2);margin:0}
.card__body>.btn {margin-top:auto;align-self:flex-start}
.card .news-card__meta {font-size:var(--type-caption);line-height:1.5;letter-spacing:normal;overflow-wrap:anywhere}
.card__media {display:block;aspect-ratio:16/9;overflow:hidden}
.card__media img {display:block;width:100%;height:100%;object-fit:cover}
.dle-content {padding-block:var(--space-8) var(--space-12)}
.dle-page-heading {margin-bottom:var(--space-6)}
.product__layout {gap:var(--space-8);margin-top:var(--space-6)}
.product__meta {font-size:var(--type-small);line-height:1.5;margin-top:var(--space-4);gap:var(--space-4)}
.pblock {margin-top:var(--space-8)}
.pblock h2,.full-text h2 {font-size:var(--type-h3);line-height:1.333;margin:var(--space-8) 0 var(--space-4)}
.pblock h3,.full-text h3 {font-size:var(--type-card);line-height:1.4;margin:var(--space-6) 0 var(--space-3)}
.full-text,.pblock__body {font-size:var(--type-body);line-height:1.5}
.full-text p,.full-text ul,.full-text ol {margin:0 0 var(--space-4)}
.full-text li+li {margin-top:var(--space-2)}
.side-block,.download-card,.box,.comment-item {padding:var(--space-6)}
.side-block h2,.download-card h2,.comments h2,dialog h2,.cs-category h3 {font-size:var(--type-card);line-height:1.4;margin-bottom:var(--space-4)}
.side-block__title {font-size:var(--type-small);line-height:1.5}
.comments {margin-top:var(--space-8)}
.comments h3 {font-size:1.125rem;line-height:1.333}
.cs-category-grid {gap:var(--space-6);margin-top:var(--space-6)}
.cs-category h3 {padding:var(--space-4);margin:0;font-size:1.125rem}
.cs-catalog {padding-top:var(--space-8)}
.cs-filter-form {gap:var(--space-3)}
.cs-filter-form label {font-size:var(--type-small);line-height:1.5}
.cs-newsletter {padding-block:var(--space-8)}
.cs-newsletter>h2 {margin-bottom:var(--space-4)}
.cs-newsletter>p {margin:0 0 var(--space-6)}
.cs-subscribe-form {grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3);max-width:620px}
.cs-subscribe-form>label:first-of-type {grid-column:1/-1}
.cs-subscribe-form>input[type=email] {grid-column:1;grid-row:2;min-width:0;width:100%}
.cs-subscribe-form>.btn {grid-column:2;grid-row:2;width:auto;min-width:144px;justify-self:start;justify-content:center;align-self:stretch}
.cs-subscribe-form>.cs-consent {grid-column:1/-1;grid-row:3;margin:0}
.cs-pagination {margin:var(--space-6) 0 0}
.dle-content:has(.cs-pagination) {padding-bottom:var(--space-8)}
.footer {padding-top:var(--space-8)}
.footer__grid {gap:var(--space-8)}
.footer h4 {font-size:var(--type-small);line-height:1.5;margin-bottom:var(--space-4)}
@media(max-width:767px) {
  :root {--type-h1:1.75rem;--type-h2:1.5rem;--type-display:2rem}
  .hero,.section {padding-block:var(--space-8)}
  .hero__grid,.product__layout,.footer__grid {gap:var(--space-6)}
  .hero h1 {line-height:1.25}
  .cards,.dle-results:has(>.card),.dle-results #dle-content:has(>.card),.related-products__grid,.cs-category-grid {gap:var(--space-4)}
  .card__body,.side-block,.download-card,.box,.comment-item {padding:var(--space-4)}
  .container {padding-inline:var(--space-4)}
  .dle-content {padding-block:var(--space-6) var(--space-8)}
  input,textarea,select {font-size:1rem}
  .cs-subscribe-form {grid-template-columns:minmax(0,1fr)}
  .cs-subscribe-form>input[type=email] {grid-column:1;grid-row:auto}
  .cs-subscribe-form>.cs-consent {grid-column:1;grid-row:auto}
  .cs-subscribe-form>.btn {grid-column:1;grid-row:auto;justify-self:start}
}
