/* ==========================================================================
   Verolyn Labs — sitewide design system
   Source of truth: files/verolyn-labs-homepage-mockup.html (CLAUDE.md §8)
   Tokens mirror Elementor kit 6 global colours exactly.
   ========================================================================== */

:root {
  --vl-paper:            #F5F6F2;
  --vl-paper-raised:     #FFFFFF;
  --vl-paper-sunk:       #FAFAF7;
  --vl-ink:              #1B1D1B;
  --vl-ink-soft:         #55584F;
  --vl-ink-faint:        #8A8D82;
  --vl-copper:           #A15C2E;
  --vl-copper-deep:      #7A4420;
  --vl-verdigris:        #4F7A6B;
  --vl-verdigris-deep:   #3A5C50;
  --vl-verdigris-wash:   #E7EFEB;
  --vl-verdigris-line:   #C9DAD2;
  --vl-clinical:         #2C5468;
  --vl-hairline:         #DAD8CC;
  --vl-hairline-strong:  #C3C1B3;

  --vl-serif: 'Fraunces', Georgia, serif;
  --vl-sans:  'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --vl-mono:  'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --vl-wrap: 1080px;
  --vl-gutter: 32px;
  --vl-radius: 6px;
  --vl-radius-sm: 3px;
}

/* --------------------------------------------------------------------------
   Theme reset — take control of the Hello Elementor page wrapper
   -------------------------------------------------------------------------- */

body {
  background: var(--vl-paper);
  color: var(--vl-ink);
  font-family: var(--vl-sans);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.vl-page main.site-main,
body.vl-page .site-main {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0;
}

body.vl-page .site-main > .page-header { display: none; }

body.vl-page .page-content > *:first-child { margin-top: 0; }

/* Kill the theme's default content padding so full-bleed bands work */
body.vl-page .page-content {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* Grid and flex children default to min-width:auto, which lets an unbreakable
   child (a long monospaced sequence, the Woo gallery) push its track wider than
   the viewport and give the whole document a horizontal scrollbar. */
.vl-grid > *,
.vl-split > *,
.vl-legal-layout > *,
.vl-batch-grid > *,
.vl-quickfacts > *,
.vl-stat-row > *,
.woocommerce div.product:not(.elementor) > *,
.woocommerce ul.products > li.product { min-width: 0; }

.vl-table-scroll { max-width: 100%; }
.vl-table td, .vl-table th { overflow-wrap: anywhere; }
.verolyn-coa-table td { overflow-wrap: anywhere; }

/* --------------------------------------------------------------------------
   Layout primitives
   -------------------------------------------------------------------------- */

.vl-wrap {
  max-width: var(--vl-wrap);
  margin: 0 auto;
  padding: 0 var(--vl-gutter);
  box-sizing: border-box;
}

.vl-wrap--narrow { max-width: 800px; }

/* Media never overflows its column, and a figure placed directly in a wrap
   fills it — WordPress emits intrinsic width/height attributes that otherwise
   pin the image to its generated size. */
img { max-width: 100%; height: auto; }

.vl-wrap figure { margin: 0; }
.vl-wrap > figure > img,
.vl-wrap > .vl-img,
.vl-split figure > img,
img.vl-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--vl-radius);
  border: 1px solid var(--vl-hairline);
}
.vl-wrap figcaption {
  font-family: var(--vl-mono);
  font-size: 11.5px;
  color: var(--vl-ink-faint);
  margin-top: 10px;
  letter-spacing: 0.02em;
}

.vl-band { width: 100%; }
.vl-band--sunk   { background: var(--vl-paper-sunk); border-top: 1px solid var(--vl-hairline); border-bottom: 1px solid var(--vl-hairline); }
.vl-band--raised { background: var(--vl-paper-raised); border-top: 1px solid var(--vl-hairline); border-bottom: 1px solid var(--vl-hairline); }
.vl-band--ink    { background: var(--vl-ink); color: var(--vl-paper); }
.vl-band--ink h2, .vl-band--ink h3 { color: var(--vl-paper); }

.vl-sec    { padding: 72px 0; }
.vl-sec--s { padding: 48px 0; }
.vl-sec--l { padding: 96px 0; }
.vl-sec--flush-top { padding-top: 0; }

.vl-rule { height: 1px; background: var(--vl-hairline); border: 0; margin: 0; }

/* --------------------------------------------------------------------------
   Type primitives
   -------------------------------------------------------------------------- */

.vl-eyebrow {
  font-family: var(--vl-mono);
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--vl-copper-deep);
  display: block;
  margin-bottom: 16px;
}
.vl-eyebrow--faint { color: var(--vl-ink-faint); }

.vl-section-head { margin-bottom: 36px; }
.vl-section-head .vl-eyebrow { color: var(--vl-ink-faint); margin-bottom: 10px; }
.vl-section-head h2 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 30px;
  line-height: 1.2;
  margin: 0;
}
.vl-section-head p {
  margin: 12px 0 0;
  color: var(--vl-ink-soft);
  font-size: 15px;
  max-width: 620px;
}

.vl-mono { font-family: var(--vl-mono); }

/* --------------------------------------------------------------------------
   Breadcrumbs
   -------------------------------------------------------------------------- */

.vl-crumbs {
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-ink-faint);
  padding: 20px 0 0;
  letter-spacing: 0.02em;
}
.vl-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.vl-crumbs a { color: var(--vl-ink-soft); text-decoration: none; }
.vl-crumbs a:hover { color: var(--vl-ink); text-decoration: underline; }
.vl-crumbs li + li::before { content: "/"; color: var(--vl-hairline-strong); margin-right: 8px; }
.vl-crumbs [aria-current="page"] { color: var(--vl-ink-faint); }

/* --------------------------------------------------------------------------
   Page hero
   -------------------------------------------------------------------------- */

.vl-hero { padding: 40px 0 48px; }
.vl-hero h1 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 44px;
  line-height: 1.1;
  letter-spacing: -0.01em;
  margin: 0 0 20px;
  max-width: 800px;
}
.vl-hero .vl-lead {
  font-size: 18px;
  line-height: 1.6;
  color: var(--vl-ink-soft);
  max-width: 640px;
  margin: 0;
}
.vl-hero--center { text-align: center; }
.vl-hero--center h1, .vl-hero--center .vl-lead { margin-left: auto; margin-right: auto; }

.vl-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  align-items: center;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--vl-hairline);
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-ink-faint);
}
.vl-hero-meta a { color: var(--vl-clinical); text-decoration: none; }
.vl-hero-meta a:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.vl-btn {
  font-family: var(--vl-sans);
  font-size: 14px;
  font-weight: 600;
  padding: 13px 26px;
  border-radius: var(--vl-radius-sm);
  text-decoration: none;
  display: inline-block;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
  line-height: 1.3;
}
.vl-btn--primary   { background: var(--vl-clinical); color: #fff; }
.vl-btn--primary:hover { background: #234454; color: #fff; }
.vl-btn--secondary { background: transparent; color: var(--vl-ink); border-color: var(--vl-hairline-strong); }
.vl-btn--secondary:hover { border-color: var(--vl-ink-soft); color: var(--vl-ink); }
.vl-btn--ghost { background: transparent; color: var(--vl-clinical); padding-left: 0; padding-right: 0; }

.vl-btn-row { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }

/* The theme underlines every anchor in content. UI affordances opt out
   explicitly; only prose links keep the underline. */
a.vl-btn,
.vl-btn,
.vl-link-arrow,
.vl-crumbs a,
.vl-card-name a,
.vl-learn-card h3 a,
.vl-learn-card h4 a,
.verolyn-coa-link,
.verolyn-byline a,
.verolyn-cluster-links li a,
.vl-toc li a,
.vl-hero-meta a,
.vl-tag,
.woocommerce ul.products li.product a,
.woocommerce a.button,
.woocommerce button.button { text-decoration: none !important; }

.vl-link-arrow:hover,
.vl-crumbs a:hover,
.verolyn-coa-link:hover { text-decoration: underline !important; }

/* --------------------------------------------------------------------------
   Batch report module (mockup §3 — signature component)
   -------------------------------------------------------------------------- */

.vl-batch {
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  overflow: hidden;
}
.vl-batch-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 18px 28px;
  border-bottom: 1px solid var(--vl-hairline);
  background: var(--vl-paper-sunk);
}
.vl-batch-head .vl-batch-title {
  font-family: var(--vl-mono);
  font-size: 13px;
  color: var(--vl-ink-soft);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.vl-batch-head .vl-verified {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-verdigris-deep);
  font-weight: 500;
  white-space: nowrap;
}
.vl-batch-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.vl-batch-field { padding: 22px 28px; border-right: 1px solid var(--vl-hairline); }
.vl-batch-field:last-child { border-right: none; }
.vl-batch-field .vl-label {
  font-size: 11px;
  color: var(--vl-ink-faint);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.vl-batch-field .vl-value {
  font-family: var(--vl-mono);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
}
.vl-batch-field .vl-value--sm { font-size: 16px; }
.vl-batch-field .vl-value--copper { color: var(--vl-copper-deep); }
.vl-batch-field .vl-value a { color: var(--vl-clinical); text-decoration: none; }
.vl-batch-field .vl-value a:hover { text-decoration: underline; }

.vl-purity-bar {
  height: 5px;
  background: var(--vl-hairline);
  border-radius: var(--vl-radius-sm);
  margin-top: 10px;
  overflow: hidden;
}
.vl-purity-bar span { display: block; height: 100%; background: var(--vl-verdigris); }

/* --------------------------------------------------------------------------
   Compound / content cards
   -------------------------------------------------------------------------- */

.vl-grid { display: grid; gap: 20px; }
.vl-grid--4 { grid-template-columns: repeat(4, 1fr); }
.vl-grid--3 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
.vl-grid--2 { grid-template-columns: repeat(2, 1fr); gap: 24px; }

.vl-card {
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.vl-card .vl-card-name {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.25;
}
.vl-card .vl-card-name a { color: inherit; text-decoration: none; }
.vl-card .vl-card-name a:hover { color: var(--vl-clinical); }
.vl-card .vl-card-desc { font-size: 13px; color: var(--vl-ink-soft); flex-grow: 1; }
.vl-card .vl-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-top: 1px solid var(--vl-hairline);
  padding-top: 14px;
}
.vl-card-media {
  margin: -24px -24px 0;
  border-bottom: 1px solid var(--vl-hairline);
  background: var(--vl-paper-sunk);
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.vl-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.vl-tag {
  font-family: var(--vl-mono);
  font-size: 11px;
  color: var(--vl-verdigris-deep);
  background: var(--vl-verdigris-wash);
  border: 1px solid var(--vl-verdigris-line);
  padding: 3px 8px;
  border-radius: var(--vl-radius-sm);
  white-space: nowrap;
  display: inline-block;
}
.vl-tag--copper { color: var(--vl-copper-deep); background: #F6EEE7; border-color: #E4D2C3; }
.vl-tag--plain  { color: var(--vl-ink-soft); background: var(--vl-paper-sunk); border-color: var(--vl-hairline); }

.vl-link-arrow {
  font-size: 12px;
  color: var(--vl-clinical);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.vl-link-arrow:hover { text-decoration: underline; }

/* Learn teaser cards — copper rule on top (mockup §6) */
.vl-learn-card { border-top: 2px solid var(--vl-copper); padding-top: 18px; }
.vl-learn-card .vl-tag-text {
  font-family: var(--vl-mono);
  font-size: 11px;
  color: var(--vl-copper-deep);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 10px;
  display: block;
}
.vl-learn-card h3, .vl-learn-card h4 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.3;
  margin: 0 0 8px;
}
.vl-learn-card h3 a, .vl-learn-card h4 a { color: inherit; text-decoration: none; }
.vl-learn-card h3 a:hover, .vl-learn-card h4 a:hover { color: var(--vl-clinical); }
.vl-learn-card p { font-size: 13px; color: var(--vl-ink-soft); margin: 0; }

/* --------------------------------------------------------------------------
   Long-form prose
   -------------------------------------------------------------------------- */

.vl-prose { font-size: 16.5px; line-height: 1.72; color: var(--vl-ink); }
.vl-prose > *:first-child { margin-top: 0; }
.vl-prose p { margin: 0 0 22px; }
.vl-prose .vl-lead { font-size: 18.5px; color: var(--vl-ink-soft); line-height: 1.62; }

.vl-prose h2 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 27px;
  line-height: 1.25;
  margin: 48px 0 16px;
  padding-top: 24px;
  border-top: 1px solid var(--vl-hairline);
}
.vl-prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.vl-prose h3 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.3;
  margin: 34px 0 12px;
}
.vl-prose h4 {
  font-family: var(--vl-sans);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.01em;
  margin: 26px 0 10px;
}

.vl-prose a { color: var(--vl-clinical); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.vl-prose a:hover { color: var(--vl-copper-deep); }

.vl-prose ul, .vl-prose ol { margin: 0 0 22px; padding-left: 22px; }
.vl-prose li { margin-bottom: 9px; }
.vl-prose li::marker { color: var(--vl-hairline-strong); }
.vl-prose ul.vl-checks { list-style: none; padding-left: 0; }
.vl-prose ul.vl-checks li { position: relative; padding-left: 26px; }
.vl-prose ul.vl-checks li::before {
  content: "\2713";
  position: absolute; left: 0; top: 0;
  color: var(--vl-verdigris);
  font-family: var(--vl-mono);
  font-size: 13px;
}

.vl-prose blockquote {
  margin: 28px 0;
  padding: 4px 0 4px 22px;
  border-left: 2px solid var(--vl-copper);
  color: var(--vl-ink-soft);
  font-size: 16px;
}
.vl-prose blockquote p:last-child { margin-bottom: 0; }

.vl-prose figure { margin: 32px 0; }
.vl-prose figure img { width: 100%; height: auto; display: block; border-radius: var(--vl-radius); border: 1px solid var(--vl-hairline); }
.vl-prose figcaption {
  font-family: var(--vl-mono);
  font-size: 11.5px;
  color: var(--vl-ink-faint);
  margin-top: 10px;
  letter-spacing: 0.02em;
}

.vl-prose hr { border: 0; height: 1px; background: var(--vl-hairline); margin: 40px 0; }

.vl-prose code {
  font-family: var(--vl-mono);
  font-size: 0.9em;
  background: var(--vl-paper-sunk);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius-sm);
  padding: 1px 5px;
}

/* --------------------------------------------------------------------------
   Data tables
   -------------------------------------------------------------------------- */

.vl-table-scroll { overflow-x: auto; margin: 0 0 26px; }

.vl-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  font-size: 14px;
  overflow: hidden;
}
.vl-table caption {
  caption-side: top;
  text-align: left;
  font-family: var(--vl-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
  padding: 0 0 10px;
}
.vl-table th, .vl-table td {
  padding: 13px 18px;
  border-bottom: 1px solid var(--vl-hairline);
  text-align: left;
  vertical-align: top;
}
.vl-table thead th {
  background: var(--vl-paper-sunk);
  font-family: var(--vl-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
}
.vl-table tbody th {
  font-weight: 500;
  color: var(--vl-ink-soft);
  width: 38%;
}
.vl-table tbody tr:last-child th,
.vl-table tbody tr:last-child td { border-bottom: 0; }
.vl-table td.vl-num, .vl-table td .vl-num { font-family: var(--vl-mono); }

/* --------------------------------------------------------------------------
   Notices — RUO, info, pending
   -------------------------------------------------------------------------- */

.verolyn-ruo-notice {
  font-family: var(--vl-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  padding: 11px 20px;
  background: var(--vl-paper-sunk);
  color: var(--vl-ink-soft);
  border-top: 1px solid var(--vl-hairline);
  border-bottom: 1px solid var(--vl-hairline);
  margin: 0;
}
.verolyn-ruo-notice--prominent {
  background: #FBF3EE;
  color: var(--vl-copper-deep);
  border-top: 1px solid #E4D2C3;
  border-bottom: 1px solid #E4D2C3;
  font-weight: 500;
}
/* Inside a constrained column the strip becomes a boxed note */
.vl-prose .verolyn-ruo-notice,
.summary .verolyn-ruo-notice {
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius-sm);
  margin: 22px 0;
}
.summary .verolyn-ruo-notice--prominent { border-color: #E4D2C3; }

.vl-note {
  background: var(--vl-verdigris-wash);
  border: 1px solid var(--vl-verdigris-line);
  border-radius: var(--vl-radius);
  padding: 18px 22px;
  margin: 28px 0;
  font-size: 14.5px;
  color: var(--vl-verdigris-deep);
}
.vl-note strong { color: var(--vl-verdigris-deep); }
.vl-note p:last-child { margin-bottom: 0; }
.vl-note--copper { background: #F6EEE7; border-color: #E4D2C3; color: var(--vl-copper-deep); }
.vl-note--plain  { background: var(--vl-paper-sunk); border-color: var(--vl-hairline); color: var(--vl-ink-soft); }
.vl-note .vl-note-title {
  display: block;
  font-family: var(--vl-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}

/* Build placeholder — kept loud on purpose, but on-brand */
.verolyn-placeholder {
  border: 1px dashed var(--vl-copper) !important;
  background: #FBF3EE !important;
  color: var(--vl-copper-deep) !important;
  padding: 16px 20px !important;
  border-radius: var(--vl-radius) !important;
  margin: 24px 0 !important;
  font: 14px/1.6 var(--vl-sans) !important;
}

/* --------------------------------------------------------------------------
   Reviewer byline + trust strip
   -------------------------------------------------------------------------- */

.verolyn-byline {
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-ink-faint);
  margin: 0;
}
.verolyn-byline a { color: var(--vl-clinical); text-decoration: none; }
.verolyn-byline a:hover { text-decoration: underline; }

.vl-trust .vl-wrap { display: flex; gap: 40px; align-items: center; }
.vl-avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--vl-hairline-strong);
  color: var(--vl-paper-raised);
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--vl-mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
}
.vl-avatar--lg { width: 96px; height: 96px; font-size: 17px; }
.vl-trust h2, .vl-trust h3 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 20px;
  margin: 0 0 8px;
}
.vl-trust p { font-size: 14px; color: var(--vl-ink-soft); max-width: 620px; margin: 0; }
.vl-trust a { color: var(--vl-clinical); }

/* --------------------------------------------------------------------------
   FAQ (verolyn-learn-faq.php markup)
   -------------------------------------------------------------------------- */

.verolyn-faq { margin: 48px 0 0; padding-top: 24px; border-top: 1px solid var(--vl-hairline); }
.verolyn-faq > h2 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 27px;
  margin: 0 0 24px;
  padding: 0;
  border: 0;
}
.verolyn-faq-item { border-bottom: 1px solid var(--vl-hairline); padding: 20px 0; }
.verolyn-faq-item:first-of-type { border-top: 1px solid var(--vl-hairline); }
.verolyn-faq-q {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.35;
  margin: 0 0 10px;
}
.verolyn-faq-a { font-size: 15.5px; color: var(--vl-ink-soft); line-height: 1.7; }
.verolyn-faq-a p:last-child { margin-bottom: 0; }
.verolyn-faq-a a { color: var(--vl-clinical); }

/* --------------------------------------------------------------------------
   Cluster links (verolyn-learn-links.php markup)
   -------------------------------------------------------------------------- */

.verolyn-cluster-links {
  margin: 48px 0 0;
  padding: 28px;
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
}
.verolyn-cluster-links h2 {
  font-family: var(--vl-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
  margin: 0 0 16px;
  padding: 0;
  border: 0;
}
.verolyn-cluster-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 28px;
}
.verolyn-cluster-links li { margin: 0; padding: 9px 0; border-bottom: 1px solid var(--vl-hairline); }
.verolyn-cluster-links li a {
  color: var(--vl-clinical);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  display: block;
}
.verolyn-cluster-links li a:hover { color: var(--vl-copper-deep); }

/* --------------------------------------------------------------------------
   COA block (verolyn-product-coa.php markup)
   -------------------------------------------------------------------------- */

.verolyn-coa {
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  padding: 0;
  overflow: hidden;
  margin: 32px 0;
}
.verolyn-coa h3 {
  font-family: var(--vl-mono);
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-soft);
  margin: 0;
  padding: 16px 24px;
  background: var(--vl-paper-sunk);
  border-bottom: 1px solid var(--vl-hairline);
}
.verolyn-coa-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.verolyn-coa-table th, .verolyn-coa-table td {
  padding: 13px 24px;
  border-bottom: 1px solid var(--vl-hairline);
  text-align: left;
}
.verolyn-coa-table th { color: var(--vl-ink-faint); font-weight: 400; width: 45%; }
.verolyn-coa-table td { font-family: var(--vl-mono); font-weight: 500; }
.verolyn-coa > p { margin: 0; padding: 16px 24px; }
.verolyn-coa-link { color: var(--vl-clinical); font-weight: 600; font-size: 14px; text-decoration: none; }
.verolyn-coa-link:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
   WooCommerce — shop archive
   -------------------------------------------------------------------------- */

.woocommerce ul.products,
ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none !important; }

.woocommerce ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: left;
}
.woocommerce ul.products li.product a img {
  margin: 0;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  border-bottom: 1px solid var(--vl-hairline);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--vl-serif) !important;
  font-weight: 500;
  font-size: 20px !important;
  line-height: 1.25;
  color: var(--vl-ink);
  padding: 20px 22px 0 !important;
  margin: 0;
}
.woocommerce ul.products li.product .vl-loop-desc {
  font-size: 13px;
  color: var(--vl-ink-soft);
  padding: 10px 22px 0;
}
.woocommerce ul.products li.product .price {
  margin-top: auto !important;
  font-family: var(--vl-mono) !important;
  font-size: 15px !important;
  color: var(--vl-ink) !important;
  font-weight: 500;
  padding: 14px 22px 0;
  margin: 0;
  display: block;
}
.woocommerce ul.products li.product .price del { color: var(--vl-ink-faint) !important; }
.woocommerce ul.products li.product .vl-loop-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 16px 22px 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--vl-hairline);
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
  margin: 0 22px 22px !important;
  display: block;
  text-align: center;
}

/* --------------------------------------------------------------------------
   WooCommerce — single product
   -------------------------------------------------------------------------- */

/* WooCommerce floats the gallery and summary. Replaced with a grid so the
   full-width modules below them can span both columns. */
.woocommerce div.product:not(.elementor) {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px 56px;
  align-items: start;
}
.woocommerce div.product:not(.elementor) > .woocommerce-product-gallery,
.woocommerce div.product:not(.elementor) > div.images { grid-column: 1; grid-row: 1; }
.woocommerce div.product:not(.elementor) > div.summary { grid-column: 2; grid-row: 1; }
.woocommerce div.product:not(.elementor) > .vl-product-batch,
.woocommerce div.product:not(.elementor) > .woocommerce-tabs,
.woocommerce div.product:not(.elementor) > .related,
.woocommerce div.product:not(.elementor) > .up-sells,
.woocommerce div.product:not(.elementor) > .woocommerce-product-gallery__wrapper { grid-column: 1 / -1; }

.woocommerce div.product:not(.elementor) > .woocommerce-product-gallery,
.woocommerce div.product:not(.elementor) > div.images,
.woocommerce div.product:not(.elementor) > div.summary {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

.woocommerce div.product:not(.elementor) .woocommerce-product-gallery__image img {
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  background: var(--vl-paper-raised);
}
.woocommerce div.product:not(.elementor) .flex-control-thumbs { margin-top: 12px !important; display: flex; gap: 10px; padding: 0; }
.woocommerce div.product:not(.elementor) .flex-control-thumbs li { width: 76px !important; margin: 0 !important; float: none !important; }

/* Quick analytical facts under the price */
.vl-quickfacts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  overflow: hidden;
  background: var(--vl-paper-raised);
  margin: 24px 0 12px;
}
.vl-quickfact { padding: 15px 18px; border-right: 1px solid var(--vl-hairline); }
.vl-quickfact:last-child { border-right: 0; }
.vl-quickfact .vl-label {
  display: block;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
  margin-bottom: 6px;
}
.vl-quickfact .vl-value { font-family: var(--vl-mono); font-size: 14px; font-weight: 500; display: block; line-height: 1.35; }
.vl-quickfact .vl-value--copper { color: var(--vl-copper-deep); }
.vl-quickfacts-link { margin: 0 0 6px; }

.vl-product-batch { margin: 64px 0 8px; }

/* Shop archive intro */
.vl-shop-intro { margin-bottom: 44px; }

.woocommerce div.product:not(.elementor) div.images { margin: 0; float: none; width: auto; }
.woocommerce div.product:not(.elementor) div.images img {
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  background: var(--vl-paper-raised);
}
.woocommerce div.product:not(.elementor) div.images .flex-control-thumbs { margin-top: 12px; display: flex; gap: 10px; }
.woocommerce div.product:not(.elementor) div.images .flex-control-thumbs li { width: 72px; margin: 0; float: none; }

.woocommerce div.product:not(.elementor) div.summary { margin: 0; float: none; width: auto; }
.woocommerce div.product:not(.elementor) .product_title {
  font-family: var(--vl-serif) !important;
  font-weight: 500;
  font-size: 38px !important;
  line-height: 1.12;
  margin: 0 0 16px !important;
  padding: 0;
}
.woocommerce div.product:not(.elementor) p.price,
.woocommerce div.product:not(.elementor) span.price {
  font-family: var(--vl-mono) !important;
  font-size: 26px !important;
  font-weight: 500;
  color: var(--vl-ink) !important;
  margin: 0 0 8px;
}
.woocommerce div.product:not(.elementor) .woocommerce-product-details__short-description {
  font-size: 16px;
  color: var(--vl-ink-soft);
  line-height: 1.65;
  margin-bottom: 4px;
}

.woocommerce div.product:not(.elementor) form.cart { margin: 24px 0; display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; }
.woocommerce div.product:not(.elementor) form.cart .quantity input.qty {
  height: 100%;
  min-height: 46px;
  width: 74px;
  padding: 0 10px;
  border: 1px solid var(--vl-hairline-strong);
  border-radius: var(--vl-radius-sm);
  background: var(--vl-paper-raised);
  font-family: var(--vl-mono);
  text-align: center;
  color: var(--vl-ink);
}

/* Buttons — unified across Woo */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit {
  background: var(--vl-clinical) !important;
  color: #fff !important;
  font-family: var(--vl-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  padding: 14px 26px !important;
  border-radius: var(--vl-radius-sm) !important;
  border: 1px solid transparent !important;
  text-transform: none !important;
  text-shadow: none !important;
  transition: background .15s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover { background: #234454 !important; color: #fff !important; }

.woocommerce a.button.vl-btn--secondary,
.woocommerce .button.vl-secondary {
  background: transparent !important;
  color: var(--vl-ink) !important;
  border-color: var(--vl-hairline-strong) !important;
}

.woocommerce div.product:not(.elementor) .product_meta {
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-ink-faint);
  border-top: 1px solid var(--vl-hairline);
  padding-top: 18px;
  margin-top: 22px;
  display: grid;
  gap: 7px;
}
.woocommerce div.product:not(.elementor) .product_meta > span { display: block; }
.woocommerce div.product:not(.elementor) .product_meta a { color: var(--vl-ink-soft); text-decoration: none; }

/* Product tabs */
.woocommerce div.product:not(.elementor) .woocommerce-tabs { margin-top: 0; }
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs {
  padding: 0;
  margin: 0 0 28px;
  border-bottom: 1px solid var(--vl-hairline);
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
}
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li a {
  font-family: var(--vl-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--vl-ink-faint);
  padding: 14px 18px;
  display: block;
  font-weight: 500;
  border-bottom: 2px solid transparent;
}
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product:not(.elementor) .woocommerce-tabs ul.tabs li a:hover {
  color: var(--vl-ink);
  border-bottom-color: var(--vl-copper);
}
.woocommerce div.product:not(.elementor) .woocommerce-tabs .panel { margin: 0; padding: 0; }
.woocommerce div.product:not(.elementor) .woocommerce-tabs .panel > h2:first-child { display: none; }

/* Related products */
.woocommerce .related > h2,
.woocommerce .up-sells > h2 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 27px;
  margin: 0 0 28px;
}

/* --------------------------------------------------------------------------
   WooCommerce — cart, checkout, account
   -------------------------------------------------------------------------- */

.woocommerce table.shop_table {
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  border-collapse: collapse;
  background: var(--vl-paper-raised);
  font-size: 14px;
}
.woocommerce table.shop_table th {
  background: var(--vl-paper-sunk);
  font-family: var(--vl-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
  padding: 14px 18px;
  border-bottom: 1px solid var(--vl-hairline);
}
.woocommerce table.shop_table td { padding: 16px 18px; border-top: 1px solid var(--vl-hairline); }
.woocommerce table.shop_table .amount { font-family: var(--vl-mono); }

.woocommerce .cart-collaterals h2,
.woocommerce-checkout h3,
.woocommerce-account h2 {
  font-family: var(--vl-serif);
  font-weight: 500;
  font-size: 22px;
  margin: 0 0 18px;
}

.woocommerce form .form-row label { font-size: 13px; color: var(--vl-ink-soft); font-weight: 500; margin-bottom: 6px; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page input[type="text"],
.woocommerce-page input[type="email"],
.woocommerce-page input[type="tel"],
.woocommerce-page input[type="password"],
.select2-container .select2-selection--single {
  border: 1px solid var(--vl-hairline-strong) !important;
  border-radius: var(--vl-radius-sm) !important;
  background: var(--vl-paper-raised) !important;
  padding: 11px 13px !important;
  font-family: var(--vl-sans) !important;
  font-size: 14px !important;
  color: var(--vl-ink) !important;
  height: auto !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-page input:focus { outline: 2px solid var(--vl-clinical); outline-offset: 1px; }

.woocommerce-checkout #payment,
.woocommerce .cart_totals,
.woocommerce-checkout-review-order {
  background: var(--vl-paper-raised) !important;
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
}
.woocommerce-checkout #payment { padding: 4px; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--vl-hairline); }

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  background: var(--vl-paper-sunk) !important;
  border-top: 2px solid var(--vl-verdigris) !important;
  border-radius: var(--vl-radius-sm);
  color: var(--vl-ink-soft) !important;
  font-size: 14px;
}
.woocommerce-error { border-top-color: var(--vl-copper) !important; }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--vl-verdigris) !important; }

/* --------------------------------------------------------------------------
   Policy / legal pages
   -------------------------------------------------------------------------- */

.vl-legal-layout { display: grid; grid-template-columns: 250px 1fr; gap: 56px; align-items: start; }
.vl-toc {
  position: sticky;
  top: 24px;
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  padding: 22px;
}
.vl-toc h2 {
  font-family: var(--vl-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--vl-ink-faint);
  margin: 0 0 14px;
  padding: 0;
  border: 0;
}
.vl-toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; }
.vl-toc li { counter-increment: toc; margin-bottom: 9px; font-size: 13.5px; line-height: 1.45; }
.vl-toc li a { color: var(--vl-ink-soft); text-decoration: none; }
.vl-toc li a::before {
  content: counter(toc) ".";
  font-family: var(--vl-mono);
  font-size: 11px;
  color: var(--vl-hairline-strong);
  margin-right: 7px;
}
.vl-toc li a:hover { color: var(--vl-clinical); }

.vl-legal-meta {
  font-family: var(--vl-mono);
  font-size: 12px;
  color: var(--vl-ink-faint);
  padding: 14px 18px;
  background: var(--vl-paper-sunk);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius-sm);
  margin-bottom: 32px;
  display: grid;
  gap: 5px;
}

/* --------------------------------------------------------------------------
   Misc components
   -------------------------------------------------------------------------- */

.vl-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--vl-hairline); border-radius: var(--vl-radius); background: var(--vl-paper-raised); overflow: hidden; }
.vl-stat { padding: 26px 24px; border-right: 1px solid var(--vl-hairline); }
.vl-stat:last-child { border-right: 0; }
.vl-stat .vl-stat-value { font-family: var(--vl-mono); font-size: 28px; font-weight: 500; color: var(--vl-ink); line-height: 1.1; }
.vl-stat .vl-stat-label { font-size: 12px; color: var(--vl-ink-faint); text-transform: uppercase; letter-spacing: 0.06em; margin-top: 9px; }

.vl-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.vl-split img { width: 100%; height: auto; border-radius: var(--vl-radius); border: 1px solid var(--vl-hairline); display: block; }

.vl-media-band img { width: 100%; height: 340px; object-fit: cover; display: block; }

.vl-cta {
  background: var(--vl-paper-raised);
  border: 1px solid var(--vl-hairline);
  border-radius: var(--vl-radius);
  padding: 40px;
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.vl-cta h2 { font-family: var(--vl-serif); font-weight: 500; font-size: 26px; margin: 0 0 8px; padding: 0; border: 0; }
.vl-cta p { margin: 0; color: var(--vl-ink-soft); font-size: 15px; max-width: 520px; }
.vl-cta .vl-btn-row { margin: 0; }

.vl-steps { counter-reset: step; display: grid; gap: 0; }
.vl-step {
  counter-increment: step;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 20px;
  padding: 26px 0;
  border-top: 1px solid var(--vl-hairline);
}
.vl-step:last-child { border-bottom: 1px solid var(--vl-hairline); }
.vl-step::before {
  content: counter(step, decimal-leading-zero);
  font-family: var(--vl-mono);
  font-size: 13px;
  color: var(--vl-copper);
  padding-top: 3px;
}
.vl-step h3 { font-family: var(--vl-serif); font-weight: 500; font-size: 19px; margin: 0 0 8px; }
.vl-step p { margin: 0; color: var(--vl-ink-soft); font-size: 14.5px; }

/* Skip link / a11y */
.vl-sr {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
  .vl-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
  .vl-batch-grid { grid-template-columns: repeat(2, 1fr); }
  .vl-batch-field:nth-child(2) { border-right: none; }
  .vl-batch-field:nth-child(1), .vl-batch-field:nth-child(2) { border-bottom: 1px solid var(--vl-hairline); }
  .vl-legal-layout { grid-template-columns: 200px 1fr; gap: 36px; }
  .vl-stat-row { grid-template-columns: repeat(2, 1fr); }
  .vl-stat:nth-child(2) { border-right: 0; }
  .vl-stat:nth-child(1), .vl-stat:nth-child(2) { border-bottom: 1px solid var(--vl-hairline); }
}

@media (max-width: 860px) {
  .vl-product-layout { grid-template-columns: 1fr; gap: 32px; }
  .woocommerce div.product:not(.elementor) { grid-template-columns: 1fr; gap: 28px; }
  .woocommerce div.product:not(.elementor) > .woocommerce-product-gallery,
  .woocommerce div.product:not(.elementor) > div.images,
  .woocommerce div.product:not(.elementor) > div.summary { grid-column: 1; grid-row: auto; }
  .vl-split { grid-template-columns: 1fr; gap: 28px; }
  .vl-legal-layout { grid-template-columns: 1fr; gap: 28px; }
  .vl-toc { position: static; }
  .verolyn-cluster-links ul { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  :root { --vl-gutter: 20px; }
  .vl-sec   { padding: 52px 0; }
  .vl-sec--l { padding: 64px 0; }
  .vl-hero  { padding: 28px 0 36px; }
  .vl-hero h1 { font-size: 32px; }
  .vl-hero .vl-lead { font-size: 16.5px; }
  .vl-grid--3 { grid-template-columns: 1fr; }
  .vl-grid--2 { grid-template-columns: 1fr; }
  .vl-section-head h2 { font-size: 24px; }
  .vl-prose { font-size: 16px; }
  .vl-prose h2 { font-size: 23px; margin-top: 38px; }
  .woocommerce div.product:not(.elementor) .product_title { font-size: 29px !important; }
  .vl-trust .vl-wrap { flex-direction: column; align-items: flex-start; gap: 20px; }
  .vl-cta { flex-direction: column; align-items: flex-start; padding: 28px; }
  .vl-batch-head { flex-direction: column; align-items: flex-start; gap: 8px; }
}

@media (max-width: 560px) {
  .vl-grid--4 { grid-template-columns: 1fr; }
  .woocommerce ul.products { grid-template-columns: 1fr; }
  .vl-batch-grid { grid-template-columns: 1fr; }
  .vl-quickfacts { grid-template-columns: 1fr; }
  .vl-quickfact { border-right: 0; border-bottom: 1px solid var(--vl-hairline); }
  .vl-quickfact:last-child { border-bottom: 0; }
  .vl-batch-field { border-right: none !important; border-bottom: 1px solid var(--vl-hairline); }
  .vl-batch-field:last-child { border-bottom: none; }
  .vl-stat-row { grid-template-columns: 1fr; }
  .vl-stat { border-right: 0 !important; border-bottom: 1px solid var(--vl-hairline); }
  .vl-stat:last-child { border-bottom: 0; }
  .vl-step { grid-template-columns: 1fr; gap: 8px; }
  .vl-hero h1 { font-size: 28px; }
}

@media print {
  .vl-crumbs, .vl-cta, .verolyn-cluster-links { display: none; }
}

/* --------------------------------------------------------------------------
   Elementor-authored sections (homepage, header, footer)
   Links inside Elementor text widgets fall back to the theme's default link
   colour, which is off-brand. Bring them onto the palette.
   -------------------------------------------------------------------------- */

body.vl-page .elementor-widget-text-editor a,
body.vl-page .elementor-widget-heading a { color: var(--vl-clinical); }
body.vl-page .elementor-widget-text-editor a:hover { color: var(--vl-copper-deep); }

/* Below 1024px the Xpro nav becomes an off-canvas panel: position:fixed,
   width:400px, parked off-screen with translate3d(100%,0,0). Chrome counts that
   translated fixed box in the document's scrollable overflow, so every page got
   ~400px of horizontal scroll and appeared clipped on the right.
   Clipping the x-axis contains it; fixed elements are not clipped by it, so the
   panel still slides in correctly when opened. The sticky TOC is released at the
   same breakpoint because sticky cannot survive an overflow-clipped ancestor. */
@media (max-width: 1024px) {
  html, body { overflow-x: hidden; }
  .vl-toc { position: static; }
}

/* The header badge is nowrap and crowds the logo and menu toggle on phones. */
@media (max-width: 700px) {
  .xpro-theme-builder-header .elementor-element-f5ba4d4 { display: none; }
}

/* Narrow phones (<430px): the monospaced COA title in the batch module is the
   widest unbreakable run on the page and was pushing the document wider than
   the viewport. These classes are shared with the homepage's Elementor HTML
   widget, so one rule covers both implementations. */
.vl-batch,
.vl-batch-report { max-width: 100%; }
.vl-batch-head,
.vl-batch-head > * { min-width: 0; }
.vl-batch-title { overflow-wrap: anywhere; }
.vl-batch-field .vl-value,
.vl-batch-value { overflow-wrap: anywhere; }

/* Branded 404 replaces the theme's default 404 markup, which still renders
   after ours; hide the second <main> rather than the first. */
body.vl-has-404 main.site-main:not(.vl-404) { display: none; }