/* Trust band + tap-target floor (kv trust layer). Tokens come from b.css / plat/tokens.css (--brand-*, --ink-*, --line, --bg-2). */
.kvt { padding: clamp(40px, 5vw, 72px) 0; border-top: 1px solid var(--line, #e2e5e6); background: var(--bg-2, #f6f7f7); }
.kvt--pdp { background: transparent; padding: clamp(32px, 4vw, 56px) 0 clamp(8px, 2vw, 24px); border-top: 0; }
.kvt__head { max-width: 720px; margin: 0 0 clamp(20px, 3vw, 32px); }
.kvt__eyebrow { margin: 0 0 10px; font: 600 12px/1 var(--mono, ui-monospace, monospace); letter-spacing: .08em; text-transform: uppercase; color: var(--brand-ink, #b23a14); }
.kvt__head h2 { margin: 0; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.15; letter-spacing: -.015em; font-weight: 650; color: var(--ink, #161a1d); }
.kvt__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kvt__tile { display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 24px; background: #fff; border: 1px solid var(--line, #e2e5e6); border-radius: 16px; box-shadow: 0 1px 0 rgba(16,20,24,.03); }
.kvt__ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--brand-50, #fff1ec); color: var(--brand-ink, #b23a14); margin-bottom: 18px; }
.kvt__ico .ico { width: 22px; height: 22px; }
.kvt__tile h3 { margin: 0 0 8px; font-size: 16px; line-height: 1.3; font-weight: 650; color: var(--ink, #161a1d); }
.kvt__tile p { margin: 0 0 14px; font-size: 14.5px; line-height: 1.55; color: var(--ink-3, #5d666d); }
.kvt__link { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 2px; font-weight: 600; font-size: 14px; color: var(--brand-ink, #b23a14); text-decoration: none; }
.kvt__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.kvt__link .ico { transition: transform .15s; }
.kvt__link:hover .ico { transform: translateX(2px); }
.kvt__chips { list-style: none; margin: auto 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.kvt__chips li { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 12px; border: 1px solid var(--line, #e2e5e6); border-radius: 999px; background: var(--bg-2, #f6f7f7); font-size: 13px; color: var(--ink-3, #5d666d); }
.kvt__chips b { font: 600 13px/1 var(--mono, ui-monospace, monospace); color: var(--ink, #161a1d); }
.kvt__listed { list-style: none; margin: 20px 0 0; padding: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.kvt__listed li { padding: 7px 12px; border: 1px solid var(--line, #e2e5e6); border-radius: 999px; background: #fff; font-size: 13px; font-weight: 600; }
.kvt__co { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--line, #e2e5e6); font-size: 13.5px; color: var(--ink-3, #5d666d); }
.kvt__co .ico { color: var(--ink-3, #5d666d); }
.kvt__co b { color: var(--ink-2, #3e464c); font-weight: 600; }
.kvt__co a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; color: var(--brand-ink, #b23a14); font-weight: 600; }
@media (max-width: 1100px) { .kvt__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .kvt__grid { grid-template-columns: 1fr; gap: 12px; }
  .kvt__tile { padding: 20px; display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; }
  .kvt__ico { grid-row: 1 / span 4; margin: 0; }
  .kvt__tile > * { grid-column: 2; }
  .kvt__tile > .kvt__ico { grid-column: 1; }
  .kvt__chips { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .kvt__link .ico { transition: none; } }

/* ---- Tap-target floor (audit #19): 44 x 44 CSS px for touch / narrow screens. Real boxes for buttons, links in lists and form
   fields; an invisible ::after hit area for small inline links and icon buttons, so the layout does not move. ---- */
@media (pointer: coarse), (max-width: 760px) {
  html .btn, html .btn--sm, html .ocx-btn, html .psx-btn, html .wcx-btn, html .kvts__chip, html .kvtt__sw, html .catchip, html .chip,
  html .icon-btn, html .ocx-cart, html .ocx-menu, html .wcx-round, html .wcx-cart, html .psx-cart, html .hdr__link, html .psx-act__link, html .wcx-act__link, html .th__pause {
    min-height: 44px; min-width: 44px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }
  html .ftr__col li a, html .ocx-ftr__col li a, html .psx-ftr__col li a, html .wcx-ftr__col li a, html .ftr__facts a,
  html .ftr__legal a, html .ocx-ftr__legal a, html .psx-ftr__legal a, html .wcx-ftr__legal a, html .ftr__top a.eco { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
  html .eco--hero, html .wcx-news a { display: inline-flex; align-items: center; min-height: 44px; }
  html .input, html input.input, html select.select, html .news__form input, html .news__form .btn, html .hero__search .btn, html .hero__search .input { min-height: 44px !important; height: auto; box-sizing: border-box; }
  html summary, html .bm__opts summary, html .ocx-qa summary, html .wcx-qa summary, html .psx-qa summary { min-height: 44px; display: flex; align-items: center; }
  html .crumbs a, html .ubar a, html .logo, html .ocx-lock, html .wcx-lock, html .psx-lock, html .panel__head a, html .ocx-link, html .wcx-link, html .psx-link,
  html .card__name a, html .kvbs__name a, html .kvtt__name a, html .fcard__name a, html .th__name a, html .ocx-card__name a, html .psx-card__name a, html .wcx-card__name a,
  html .fbt__item a, html table a, html .tip { position: relative; }
  html .crumbs a::after, html .ubar a::after, html .logo::after, html .ocx-lock::after, html .wcx-lock::after, html .psx-lock::after, html .panel__head a::after,
  html .ocx-link::after, html .wcx-link::after, html .psx-link::after, html .card__name a::after, html .kvbs__name a::after, html .kvtt__name a::after, html .fcard__name a::after,
  html .th__name a::after, html .ocx-card__name a::after, html .psx-card__name a::after, html .wcx-card__name a::after, html .fbt__item a::after, html table a::after, html .tip::after {
    content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: 44px; min-height: 100%; transform: translateY(-50%); }
  html .tip::after { left: 50%; right: auto; width: 44px; transform: translate(-50%, -50%); }
  html .skip:focus { min-height: 44px; }
}
/* 44 px header buttons on WooCommerce / PrestaShop phones: no gap between them so the header fits 390 px (sales-qw2) */
@media (max-width: 420px) { html .psx-act, html .wcx-act { gap: 0; } }
/* very small phones (360-380 px): the header row fits without horizontal scroll; the platform lockup keeps the logo and drops
   its tag (the page and the footer still name the platform) (sales-qw2) */
@media (max-width: 380px) {
  html .ocx-lock__tag, html .psx-lock__tag, html .wcx-lock__tag { display: none; }
  html .ocx-act, html .hdr__actions { gap: 0 !important; }
  html .ocx-lock .logo__img, html .psx-lock .logo__img, html .wcx-lock .logo__img, html .logo .logo__img { height: 16px !important; width: auto !important; }
  html .psx-hdr__in, html .wcx-hdr__in { padding-left: 12px; padding-right: 12px; }
}
