/* ============================================================
   ChemBasic design layer (v1.7.0) — catalog look, all widgets.

   Every widget inlines its own CSS, so this single sheet restyles the
   shared patterns site-wide instead of editing ~25 widgets one by one.
   Each selector carries a leading `body` so it out-ranks the widget's
   inline rules whatever the load order. Elementor's own {{WRAPPER}}
   control styles still out-rank this, so accent colours and other
   panel settings keep working.

   The static site carries the same layer at the end of css/style.css.
   Keep the two in step.
   ============================================================ */

/* ---------------------------------- Eyebrow: a plain label, no underline rule */
body .cb-about-eyebrow,
body .cb-cat-eyebrow,
body .cb-cat2-eyebrow,
body .cb-ct-eyebrow,
body .cb-cta__eyebrow,
body .cb-fp-eyebrow,
body .cb-shop__eyebrow,
body .cb-sr-eyebrow,
body .cb-ss-eyebrow,
body .cb-usmap__eyebrow,
body .cb-woo-eyebrow {
  display: block;
  padding-bottom: 0;
  border-bottom: 0;
  margin-bottom: 14px;
  letter-spacing: .12em;
}

/* ---------------------------------- Section head: title left, lead right, on one rule */
body .cb-fp-head,
body .cb-cat-head,
body .cb-woo-head {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(32px, 6vw, 96px);
  align-items: end;
  padding-bottom: 28px;
  margin-bottom: 40px;
  border-bottom: 1px solid #15171a;
}
body .cb-fp-head .cb-fp-eyebrow,
body .cb-cat-head .cb-cat-eyebrow,
body .cb-woo-head .cb-woo-eyebrow { grid-column: 1 / -1; }
body .cb-fp-title,
body .cb-cat-title,
body .cb-woo-title {
  grid-column: 1;
  font-size: clamp(1.8rem, 1.1rem + 2.2vw, 2.75rem);
  text-wrap: balance;
}
body .cb-fp-lead,
body .cb-cat-lead,
body .cb-woo-lead { grid-column: 2; margin-top: 0; max-width: 48ch; }

/* ---------------------------------- Featured products: spec-sheet rows */
body .cb-fp-head { margin-bottom: 0; }
body .cb-fp-grid { grid-template-columns: 1fr; gap: 0; }
body .cb-pcard {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: stretch;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e2e4e7;
  border-radius: 0;
  padding-block: clamp(28px, 4vw, 48px);
  overflow: visible;
}
body .cb-pcard:hover { transform: none; box-shadow: none; border-color: #e2e4e7; }
body .cb-pcard:nth-child(even) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
body .cb-pcard:nth-child(even) .cb-pcard__media { order: 2; }
body .cb-pcard:nth-child(even) .cb-pcard__body { padding-left: 0; }
body .cb-pcard:nth-child(odd) .cb-pcard__body { padding-right: 0; }
body .cb-pcard__media {
  aspect-ratio: auto;
  min-height: 400px;
  border: 0;
  border-radius: 8px;
}
body .cb-pcard__badge { border-radius: 0; }
body .cb-pcard__body {
  justify-content: center;
  padding: clamp(8px, 2vw, 24px) clamp(24px, 5vw, 72px);
}
body .cb-pcard__title { font-size: clamp(1.45rem, 1.1rem + 1vw, 1.9rem); line-height: 1.12; letter-spacing: -.02em; }
body .cb-pcard__desc { font-size: 1rem; max-width: 54ch; }
body .cb-pcard__specs {
  grid-template-columns: 1fr 1fr;
  column-gap: 32px;
  row-gap: 0;
  margin-top: 26px;
  padding-top: 0;
  border-top: 1px solid #15171a;
}
body .cb-pcard__specs li {
  flex-direction: column;
  justify-content: flex-start;
  gap: 3px;
  padding: 12px 0;
  border-bottom: 1px solid #e2e4e7;
  font-size: .95rem;
}
body .cb-pcard__specs li span:first-child {
  font-family: "IBM Plex Mono", monospace;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body .cb-pcard__specs li span:last-child { text-align: left; font-weight: 600; color: #15171a; }

/* ---------------------------------- Category / value cards: an index list, not a card grid */
body .cb-cat-head { margin-bottom: 0; }
body .cb-cat-grid {
  display: block;
  background: none;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
body .cb-cat-card {
  display: grid;
  grid-template-columns: 32px minmax(190px, 3fr) minmax(0, 6fr) auto;
  align-items: center;
  column-gap: clamp(16px, 3vw, 44px);
  padding: 22px 14px;
  background: transparent;
  border-bottom: 1px solid #e2e4e7;
  text-decoration: none;
}
body .cb-cat-card::before { display: none; }
body .cb-cat-card:hover { background: #eef3f8; }
body .cb-cat-card:active { transform: none; }
body .cb-cat__icon,
body .cb-cat-card:hover .cb-cat__icon {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 0;
  background: none;
  margin-bottom: 0;
}
body .cb-cat__icon svg { width: 28px; height: 28px; }
body .cb-cat__title { font-size: 1.2rem; margin: 0; transition: color .16s ease; }
body .cb-cat-card:hover .cb-cat__title { color: #1d6195; }
body .cb-cat__desc { margin-top: 0; margin-bottom: 0; flex: none; }
body .cb-cat__link { margin-top: 0; white-space: nowrap; }

/* ---------------------------------- About: a real photo, facts as a plain list */
body .cb-about-inner {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}
body .cb-about__stats {
  gap: 0 32px;
  background: none;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
body .cb-about__stats::before {
  content: "";
  grid-column: 1 / -1;
  aspect-ratio: 16 / 10;
  margin-bottom: 8px;
  border-radius: 8px;
  background: #f4f5f6 url("field-work.jpg") center / cover no-repeat;
}
body .cb-about__stats li {
  background: none;
  padding: 16px 0;
  gap: 4px;
  border-bottom: 1px solid #e2e4e7;
}
body .cb-about__stat-num { font-size: 1.25rem; font-weight: 700; color: #15171a; }

/* ---------------------------------- Catalog band: light, no decorative swooshes.
   .cb-cat2--light is added by the widget only while Background is left on
   Default, so a custom image/video background keeps its light-on-dark text. */
body .cb-cat2-lines { display: none; }
body .cb-cat2--light { color: #15171a; border-block: 1px solid #e2e4e7; }
body .cb-cat2--light .cb-cat2-title { color: #15171a; }
body .cb-cat2--light .cb-cat2-text { color: #6c7178; }
body .cb-cat2--light .cb-cat2-list { border-top-color: #d4d7db; }
body .cb-cat2--light .cb-cat2-list li { color: #4a4f56; }
body .cb-cat2--light .cb-cat2-list li::before { background: #1d6195; }
body .cb-cat2--light .cb-btn-cat-ghost { color: #15171a; border-color: rgba(21, 23, 26, .32); }
body .cb-cat2--light .cb-btn-cat-ghost:hover { border-color: #15171a; background: rgba(21, 23, 26, .04); }
body .cb-cat2--light .cb-cover { box-shadow: 0 34px 60px -34px rgba(22, 72, 111, .6); }

/* ---------------------------------- Document rows: icon without the box */
body .cb-doc__icon,
body .cb-doc-row:hover .cb-doc__icon { border: 0; background: none; border-radius: 0; }

@media (max-width: 1024px) {
  body .cb-cat-card { grid-template-columns: 28px minmax(0, 1fr) auto; row-gap: 6px; }
  body .cb-cat__desc { grid-column: 2 / -1; grid-row: 2; }
  body .cb-cat__link { grid-column: 3; grid-row: 1; }
}
@media (max-width: 860px) {
  body .cb-fp-head,
  body .cb-cat-head,
  body .cb-woo-head { display: block; text-align: center; padding-bottom: 24px; }
  body .cb-fp-lead,
  body .cb-cat-lead,
  body .cb-woo-lead { margin-top: 14px; margin-inline: auto; }
  body .cb-pcard,
  body .cb-pcard:nth-child(even) { grid-template-columns: 1fr; row-gap: 20px; }
  body .cb-pcard:nth-child(even) .cb-pcard__media { order: 0; }
  body .cb-pcard__media { min-height: 280px; }
  body .cb-pcard__body,
  body .cb-pcard:nth-child(even) .cb-pcard__body,
  body .cb-pcard:nth-child(odd) .cb-pcard__body { padding: 0; }
  body .cb-pcard__specs li { text-align: left; align-items: flex-start; }
  body .cb-pcard__specs li span:last-child { text-align: left; }
  body .cb-about-inner { grid-template-columns: 1fr; }
  body .cb-cat-card { text-align: left; }
}
@media (max-width: 560px) {
  body .cb-pcard__specs { grid-template-columns: 1fr; }
  body .cb-about__stats { grid-template-columns: 1fr 1fr; }
  body .cb-cat__link { font-size: 0; gap: 0; }
}