/* ============================================================
   landing-blocks.css — 9 visual blocks for landing pages
   vb-hero-A | vb-opinion-cards-3 | vb-process-timeline-h
   vb-promise-grid-with-mock | vb-fabric-grid-4 | vb-icp-2x2
   vb-anti-fit-list | vb-timeline-7day | vb-entry-wall-9 | vb-form-full
   ============================================================ */

/* ============== M1 — vb-hero-A ============== */
.hero-A {
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  color: var(--color-text-on-dark);
  background:
    linear-gradient(135deg,
      rgba(44, 95, 93, 0.78) 0%,
      rgba(26, 26, 26, 0.55) 60%,
      rgba(0, 0, 0, 0.35) 100%);
  overflow: hidden;
  padding: var(--space-section) 0;
}
.hero-A::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background: linear-gradient(135deg, var(--color-primary) 0%, #1A4F4D 100%);
}
.hero-A__bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%;
  z-index: -1;
}
.hero-A__content {
  max-width: 60%;
  padding-left: 64px;
}
.hero-A__h1 {
  color: #fff;
  font-size: var(--fs-h1);
  line-height: var(--lh-tight);
  margin-bottom: var(--space-3);
  letter-spacing: -0.02em;
}
.hero-A__h1 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 600;
  color: var(--color-secondary);
}
.hero-A__sub {
  font-size: var(--fs-sub);
  line-height: var(--lh-relaxed);
  color: rgba(250, 247, 242, 0.92);
  max-width: 600px;
  margin-bottom: var(--space-6);
}
.hero-A__ctas {
  display: flex; flex-wrap: wrap;
  gap: 16px;
}
.hero-A__scroll-cue {
  position: absolute; bottom: 24px; left: 50%;
  transform: translateX(-50%);
  font-size: var(--fs-eyebrow);
  color: rgba(250, 247, 242, 0.6);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.hero-A__scroll-cue::after {
  content: "↓";
  display: block; text-align: center;
  margin-top: 4px; font-size: 18px;
}

@media (max-width: 1199px) {
  .hero-A__content { max-width: 75%; padding-left: 32px; }
}
@media (max-width: 767px) {
  .hero-A { min-height: 80vh; }
  .hero-A__content { max-width: 100%; padding: 24px 16px; }
  .hero-A__bg { object-position: center 25%; }
  .hero-A__ctas { flex-direction: column; gap: 12px; }
  .hero-A__ctas .btn-cta { width: 100%; }
  .hero-A__scroll-cue { display: none; }
}

/* ============== M2 — vb-opinion-cards-3 ============== */
.opinion-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-grid-gap);
}
.card-opinion {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  display: flex; flex-direction: column;
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}
.card-opinion__icon {
  width: 56px; height: 56px;
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-3);
}
.card-opinion__icon img { width: 32px; height: 32px; }
.card-opinion__title {
  margin-bottom: var(--space-2);
}
.card-opinion__body {
  color: var(--color-text-muted);
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  margin: 0;
}
@media (hover: hover) {
  .card-opinion:hover {
    transform: translateY(-4px);
    border-color: var(--color-border-strong);
    box-shadow: var(--shadow-card-hover);
  }
}
@media (max-width: 991px) {
  .opinion-grid { grid-template-columns: 1fr; }
}

/* ============== M3 — vb-process-timeline-h ============== */
.timeline-h {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--space-3);
  position: relative;
  margin-bottom: var(--space-6);
}
.timeline-h__step {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 0 8px;
}
.timeline-h__step::before {
  content: "";
  position: absolute;
  top: 24px; left: 56px; right: -8px;
  height: 1px;
  background: var(--color-border-strong);
}
.timeline-h__step:last-child::before { display: none; }
.timeline-h__num {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1.125rem;
  margin-bottom: var(--space-2);
  flex-shrink: 0;
}
.timeline-h__label {
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 6px;
  font-size: 1.0625rem;
}
.timeline-h__desc {
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  line-height: var(--lh-relaxed);
  margin: 0;
}
.timeline-h__image-wrap {
  max-width: 1200px;
  margin: var(--space-6) auto 0;
  border-radius: var(--radius-card);
  overflow: hidden;
}
@media (max-width: 1199px) {
  .timeline-h { grid-template-columns: repeat(3, 1fr); row-gap: var(--space-5); }
  .timeline-h__step::before { display: none; }
}
@media (max-width: 767px) {
  .timeline-h {
    grid-template-columns: 1fr;
    row-gap: var(--space-4);
  }
  .timeline-h__step { display: grid; grid-template-columns: 48px 1fr; gap: 16px; }
  .timeline-h__step::before {
    top: 48px; bottom: -16px; left: 23px; right: auto;
    width: 1px; height: auto;
  }
  .timeline-h__num { margin: 0; }
  .timeline-h__step > div { grid-column: 2; }
}

/* ============== M4 — vb-promise-grid-with-mock ============== */
.promise-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-grid-gap);
  margin-bottom: var(--space-8);
}
.card-promise {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  position: relative;
  overflow: hidden;
}
.card-promise__kicker {
  font-size: var(--fs-eyebrow);
  color: var(--color-accent);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: var(--space-1);
  display: block;
}
.card-promise__title {
  margin-bottom: var(--space-2);
}
.card-promise__body {
  color: var(--color-text-muted);
  margin: 0;
  line-height: var(--lh-loose);
}
.moq-list {
  list-style: none;
  padding: 0;
  margin: var(--space-2) 0 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-2);
}
.moq-list li {
  text-align: center;
  padding: 12px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-btn);
}
.moq-list .moq-num {
  display: block;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-accent);
  line-height: 1;
}
.moq-list .moq-label {
  display: block;
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  margin-top: 4px;
}

.product-mock-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-grid-gap);
  margin: var(--space-6) 0;
}
.product-card-mock {
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  box-shadow: 0 4px 12px rgba(26, 26, 26, 0.05);
}
.product-card-mock__chrome {
  display: flex; align-items: center; gap: 6px;
  height: 24px;
  background: #ECECEC;
  padding: 0 12px;
  border-bottom: 1px solid #DCDCDC;
}
.product-card-mock__chrome span {
  width: 10px; height: 10px; border-radius: 50%;
  background: #C5C5C5;
}
.product-card-mock__chrome span:nth-child(1) { background: #FF6058; }
.product-card-mock__chrome span:nth-child(2) { background: #FFBE2E; }
.product-card-mock__chrome span:nth-child(3) { background: #28CA42; }
.product-card-mock__body {
  position: relative;
  aspect-ratio: 1 / 1;
  background: #F5F5F5;
}
.product-card-mock__body img {
  width: 100%; height: 100%; object-fit: cover;
}
.product-card-mock__badge {
  position: absolute;
  top: 12px; left: 12px;
  background: var(--color-accent);
  color: #fff;
  padding: 6px 12px;
  font-weight: 700;
  font-size: 0.875rem;
  border-radius: var(--radius-btn);
  letter-spacing: 0.02em;
}

@media (max-width: 991px) {
  .promise-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .product-mock-row {
    grid-template-columns: 80vw 80vw 80vw;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 16px;
    margin-left: -16px; margin-right: -16px;
    padding-left: 16px; padding-right: 16px;
  }
  .product-card-mock { scroll-snap-align: start; }
}

/* ============== M5 — vb-fabric-grid-4 + cert band ============== */
.fabric-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-grid-gap);
  margin-bottom: var(--space-6);
}
.card-fabric {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform var(--transition-base),
              border-color var(--transition-base);
}
.card-fabric__img {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--color-bg-soft);
}
.card-fabric__img img {
  width: 100%; height: 100%; object-fit: cover;
}
.card-fabric__body {
  padding: var(--space-card);
}
.card-fabric__title {
  margin-bottom: var(--space-1);
}
.card-fabric__spec {
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  line-height: var(--lh-relaxed);
  margin: 0;
}
@media (hover: hover) {
  .card-fabric:hover {
    transform: translateY(-4px);
    border-color: var(--color-border-strong);
  }
}

.cert-band {
  display: flex; flex-wrap: wrap;
  gap: 24px;
  align-items: center; justify-content: center;
  padding: var(--space-3);
  background: var(--color-bg-soft);
  border-radius: var(--radius-card);
  border: 1px solid var(--color-border);
}
.cert-band__item {
  display: inline-flex; align-items: center;
  gap: 8px;
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-primary);
}
.cert-band__item::before {
  content: "✓";
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  background: var(--color-primary);
  color: #fff;
  border-radius: 50%;
  font-size: 14px;
}

.money-callout {
  margin: var(--space-6) 0 0;
  padding: var(--space-4);
  background: var(--color-bg-soft);
  border-radius: var(--radius-card);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-loose);
}
.money-callout em {
  font-style: normal;
  color: var(--color-accent);
  font-weight: 600;
}

@media (max-width: 1199px) {
  .fabric-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .fabric-grid { grid-template-columns: 1fr; }
  .card-fabric__img { aspect-ratio: 16 / 9; }
}

/* ============== M6 — vb-icp-2x2 ============== */
.icp-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-grid-gap);
}
.card-icp {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  display: flex; flex-direction: column;
  transition: transform var(--transition-base),
              border-color var(--transition-base);
}
.card-icp__title {
  margin-bottom: var(--space-2);
}
.card-icp__body {
  color: var(--color-text-muted);
  line-height: var(--lh-loose);
  flex-grow: 1;
  margin-bottom: var(--space-3);
}
.card-icp__link {
  font-weight: 600;
  color: var(--color-accent);
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none;
}
.card-icp__link::after {
  content: "→";
  transition: transform var(--transition-base);
}
.card-icp__link:hover { color: var(--color-accent-dark); text-decoration: none; }
.card-icp__link:hover::after { transform: translateX(4px); }
@media (hover: hover) {
  .card-icp:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
  }
}
@media (max-width: 767px) {
  .icp-grid { grid-template-columns: 1fr; }
}

/* ============== M8 — vb-anti-fit-list ============== */
.anti-fit-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 800px;
  display: flex; flex-direction: column;
  gap: var(--space-2);
}
.anti-fit-list__item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid rgba(250, 247, 242, 0.08);
  align-items: start;
}
.anti-fit-list__item:last-child { border-bottom: none; }
.anti-fit-list__icon {
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--color-secondary);
  border-radius: 50%;
  color: var(--color-secondary);
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}
.anti-fit-list__text {
  font-size: var(--fs-body-lg);
  line-height: var(--lh-loose);
  color: var(--color-text-on-dark);
  margin: 0;
}
.anti-fit-list__text strong {
  color: #fff;
  display: block;
  margin-bottom: 4px;
  font-weight: 700;
}

/* ============== M9 — vb-timeline-7day ============== */
.timeline-7day {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: var(--space-2);
  position: relative;
  margin-bottom: var(--space-6);
}
.timeline-7day__step {
  display: flex; flex-direction: column;
  position: relative;
  padding: 0 4px;
}
.timeline-7day__step::before {
  content: "";
  position: absolute;
  top: 18px; left: 50%; right: -50%;
  height: 2px;
  background: var(--color-border-strong);
}
.timeline-7day__step:last-child::before { display: none; }
.timeline-7day__day {
  background: var(--color-primary);
  color: #fff;
  font-weight: 700;
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  padding: 6px 10px;
  border-radius: 999px;
  align-self: flex-start;
  margin-bottom: var(--space-2);
  position: relative;
  z-index: 1;
}
.timeline-7day__step:first-child .timeline-7day__day {
  background: var(--color-accent);
}
.timeline-7day__title {
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 4px;
  font-size: 1rem;
}
.timeline-7day__desc {
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  line-height: var(--lh-relaxed);
  margin: 0;
}
.timeline-7day__image-wrap {
  margin: var(--space-6) auto 0;
  border-radius: var(--radius-card);
  overflow: hidden;
  max-width: 1400px;
}
@media (max-width: 1199px) {
  .timeline-7day { grid-template-columns: repeat(4, 1fr); row-gap: var(--space-4); }
  .timeline-7day__step::before { display: none; }
}
@media (max-width: 767px) {
  .timeline-7day {
    grid-template-columns: 1fr;
    row-gap: var(--space-3);
  }
  .timeline-7day__step {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 12px;
    padding: 0;
    align-items: start;
  }
  .timeline-7day__step::before { display: none; }
  .timeline-7day__day {
    align-self: start;
    margin-bottom: 0;
  }
}

/* ============== M10A — vb-entry-wall-9 ============== */
.entry-wall-9 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-grid-gap);
}
.card-entry {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  text-decoration: none;
  display: flex; flex-direction: column;
  transition: transform var(--transition-base),
              border-color var(--transition-base);
}
.card-entry:hover { text-decoration: none; transform: translateY(-2px); border-color: var(--color-border-strong); }
.card-entry__title {
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 6px;
  font-size: 1.0625rem;
  text-transform: capitalize;
}
.card-entry__desc {
  color: var(--color-text-muted);
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
  margin: 0;
}
@media (max-width: 991px) {
  .entry-wall-9 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .entry-wall-9 { grid-template-columns: 1fr; }
}

/* ============== M10B — vb-form-full ============== */
.form-inquiry-full {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: var(--space-8);
  background: var(--color-primary);
  border-radius: var(--radius-card);
  padding: var(--space-8);
  color: var(--color-text-on-dark);
  box-shadow: var(--shadow-form);
}
.form-inquiry-full form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-3);
}
.form-inquiry-full form > * { min-width: 0; }
.form-row-2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-3);
}
.form-row-2 > * { min-width: 0; }
.form-checkbox-group {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 12px 16px;
  font-size: var(--fs-small);
}
.form-trust {
  display: flex; flex-direction: column;
  gap: var(--space-3);
  padding-left: var(--space-4);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.form-trust h3 {
  font-size: 1.125rem;
  margin-bottom: var(--space-1);
}
.form-trust p,
.form-trust li {
  color: rgba(250, 247, 242, 0.85);
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
  margin: 0;
}
.form-trust ul { padding-left: 1.25em; margin: 0; }
.form-trust__divider {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin: var(--space-1) 0;
}

@media (max-width: 991px) {
  .form-inquiry-full {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--space-6);
    gap: var(--space-6);
  }
  .form-inquiry-full > * { min-width: 0; }
  .form-trust { border-left: none; padding-left: 0; padding-top: var(--space-4); border-top: 1px solid rgba(255,255,255,0.1); }
}
@media (max-width: 600px) {
  .form-inquiry-full { padding: var(--space-4); }
  .form-row-2 { grid-template-columns: 1fr; }
  .form-checkbox-group { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   P01 about-us — 3 new vb blocks (Round 4 append, 2026-04-29)
   - vb-trust-strip-craft (M1.5, hero-attached craft strip, F2 简版)
   - vb-team-roles-grid   (M4, 5 role cards 5→3+2→1 responsive)
   - vb-author-card-inline (M6, 1:2 horizontal author endorsement card)
   Source: about-us.md §G CSS draft, design_round=3.
   ============================================================ */

/* ============== M1.5 (P01 about-us) — vb-trust-strip-craft ============== */
/* Hero 下方 5 项工艺细节 trust strip (priority 70 适配的轻量版). 与 hero 物理咬合. */

.trust-strip-craft {
  background: var(--color-bg);
  padding: 32px 0;
  margin-top: -32px; /* 物理咬合 hero, 制造连贯过渡 */
  position: relative;
  z-index: 2;
}

.trust-strip-craft__list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: var(--space-3);
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 1200px;
}

.trust-strip-craft__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-small);
  font-weight: 500;
  color: var(--color-text);
  white-space: nowrap;
  position: relative;
}

.trust-strip-craft__item:not(:last-child)::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 12px;
  background: rgba(212, 165, 116, 0.3); /* secondary 30% opacity */
  margin-left: var(--space-3);
}

.trust-strip-craft__icon {
  width: 16px;
  height: 16px;
  color: var(--color-primary);
  flex-shrink: 0;
}

@media (max-width: 1199px) {
  .trust-strip-craft { padding: 24px 0; }
  .trust-strip-craft__list { flex-wrap: wrap; gap: var(--space-2); }
  .trust-strip-craft__item:not(:last-child)::after { margin-left: var(--space-2); }
}

@media (max-width: 767px) {
  .trust-strip-craft {
    padding: 20px 16px;
    margin-top: 0; /* mobile 不咬合, 避免 hero 内容被 trust 遮挡 */
  }
  .trust-strip-craft__list {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .trust-strip-craft__item {
    white-space: normal;
  }
  .trust-strip-craft__item:not(:last-child)::after {
    display: none; /* mobile 移除 divider */
  }
}

/* ============== M4 (P01 about-us) — vb-team-roles-grid ============== */
/* 5 张 role 卡横排, 每卡 = eyebrow (代号) + role title + 1 句职责. 不带 entry link, 不带 icon. */
/* 复用 .icp-grid 容器骨架 + 新建 .card-role 变体 (相对 .card-icp 去掉 __link 元素) */

.team-roles-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-grid-gap);
}

.card-role {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  display: flex;
  flex-direction: column;
  transition: transform var(--transition-base),
              border-color var(--transition-base);
}

.card-role__eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--color-secondary);
  margin-bottom: var(--space-1);
}

.card-role__title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-text);
  margin-bottom: var(--space-2);
}

.card-role__body {
  color: var(--color-text-muted);
  line-height: var(--lh-loose);
  font-size: var(--fs-body);
  flex-grow: 1;
  margin: 0;
}

@media (hover: hover) {
  .card-role:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
  }
}

@media (max-width: 1199px) {
  .team-roles-grid {
    grid-template-columns: repeat(3, 1fr);
    row-gap: var(--space-4);
  }
}

@media (max-width: 767px) {
  .team-roles-grid { grid-template-columns: 1fr; row-gap: var(--space-3); }
}

/* ============== M6 (P01 about-us) — vb-author-card-inline ============== */
/* 横向 1:2 布局 (avatar : bio). Maya Hartley 作者背书短卡. */

.author-card-inline {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: var(--space-6);
  max-width: 1100px;
  margin: 0 auto;
  padding: var(--space-6);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  align-items: center;
}

.author-card-inline__avatar {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  object-fit: cover;
  justify-self: center;
  border: 4px solid var(--color-bg-soft);
}

.author-card-inline__bio {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.author-card-inline__name {
  font-size: var(--fs-h2);
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-text);
  margin: 0;
}

.author-card-inline__eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--color-secondary);
  margin: 0;
}

.author-card-inline__role {
  font-size: var(--fs-body-lg);
  line-height: var(--lh-loose);
  color: var(--color-text);
  margin: 0;
}

.author-card-inline__quote {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-style: italic;
  line-height: 1.5;
  color: var(--color-text);
  padding-left: var(--space-3);
  margin: var(--space-3) 0;
}

.author-card-inline__signature {
  font-size: var(--fs-body);
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.author-card-inline__signature::after {
  content: "→";
  transition: transform var(--transition-base);
}

.author-card-inline__signature:hover {
  color: var(--color-accent-dark);
  text-decoration: none;
}

.author-card-inline__signature:hover::after {
  transform: translateX(4px);
}

@media (max-width: 1199px) {
  .author-card-inline { padding: var(--space-5); gap: var(--space-5); }
  .author-card-inline__avatar { max-width: 240px; }
}

@media (max-width: 767px) {
  .author-card-inline {
    grid-template-columns: 1fr;
    padding: var(--space-3);
    gap: var(--space-3);
    text-align: left;
  }
  .author-card-inline__avatar { max-width: 200px; }
  .author-card-inline__name { font-size: 1.5rem; }
  .author-card-inline__quote { font-size: 1.125rem; padding-left: var(--space-2); }
}

/* ============================================================
   P02 china-origin 新增 (3 vb-* blocks)
   vb-logistics-routes-cards | vb-case-cards-3 | vb-cert-band-inline
   ============================================================ */

/* ============== M3 (P02 china-origin) — vb-logistics-routes-cards ============== */
/* 5 张物流路线卡 (FOB / CIF / DDP × 海运/空运), 横排 grid. 等高卡, hover 抬升. */

.routes-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-3);
  max-width: var(--container-xl);
  margin: 0 auto;
}

.routes-grid__card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  height: 360px;
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}

.routes-grid__card-eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin: 0 0 var(--space-1);
}

.routes-grid__card-title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: var(--lh-normal);
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}

.routes-grid__card-row {
  display: flex;
  gap: var(--space-1);
  align-items: baseline;
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
}

.routes-grid__card-label {
  font-size: 12px;
  color: var(--color-text-muted);
  min-width: 88px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  flex-shrink: 0;
}

.routes-grid__card-value {
  font-size: var(--fs-small);
  color: var(--color-text);
  flex: 1;
}

.routes-grid__card-note {
  font-size: var(--fs-small);
  font-style: italic;
  color: var(--color-text-muted);
  line-height: var(--lh-relaxed);
  margin-top: auto;
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border);
}

@media (hover: hover) {
  .routes-grid__card:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
    box-shadow: var(--shadow-card-hover);
  }
}

@media (max-width: 1399px) and (min-width: 1200px) {
  .routes-grid { gap: var(--space-2); }
  .routes-grid__card { padding: 24px 20px; }
}

@media (max-width: 1199px) {
  .routes-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
  }
  .routes-grid__card {
    height: auto;
    min-height: 320px;
  }
  .routes-grid__card:nth-child(5) {
    grid-column: 1 / span 2;
    max-width: calc(50% - var(--space-2));
    justify-self: center;
  }
}

@media (max-width: 767px) {
  .routes-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .routes-grid__card {
    height: auto;
    min-height: 0;
    padding: 20px 16px;
  }
  .routes-grid__card:nth-child(5) {
    grid-column: 1;
    max-width: 100%;
    justify-self: stretch;
  }
  .routes-grid__card-label { min-width: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  .routes-grid__card { transition: none; }
  .routes-grid__card:hover { transform: none; }
}

/* ============== M5 (P02 china-origin) — vb-case-cards-3 ============== */
/* 3 张匿名结构化案例卡 (origin / destination / volume / mode / outcome). */
/* outcome 段是视觉锚 (accent 左 border), 整卡软背景区分 section. */

.case-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-grid-gap);
  max-width: var(--container-xl);
  margin: 0 auto;
}

.case-grid__card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}

.case-grid__card-eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin: 0 0 var(--space-1);
}

.case-grid__card-title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: var(--lh-normal);
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}

.case-grid__card-field {
  display: flex;
  gap: var(--space-1);
  align-items: baseline;
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
}

.case-grid__card-field-label {
  font-size: 12px;
  color: var(--color-text-muted);
  min-width: 96px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  flex-shrink: 0;
}

.case-grid__card-field-value {
  font-size: var(--fs-small);
  color: var(--color-text);
  flex: 1;
}

.case-grid__card-outcome {
  font-size: var(--fs-body);
  font-weight: 500;
  line-height: var(--lh-relaxed);
  color: var(--color-primary);
  padding-left: var(--space-2);
  margin-top: auto;
  padding-top: var(--space-2);
}

@media (hover: hover) {
  .case-grid__card:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
    box-shadow: var(--shadow-card-hover);
  }
  .case-grid__card:hover .case-grid__card-outcome {
  }
}

@media (max-width: 1199px) {
  .case-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
  }
  .case-grid__card:nth-child(3) {
    grid-column: 1 / span 2;
    max-width: calc(50% - var(--space-2));
    justify-self: center;
  }
}

@media (max-width: 767px) {
  .case-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .case-grid__card {
    padding: 24px 20px;
  }
  .case-grid__card:nth-child(3) {
    grid-column: 1;
    max-width: 100%;
    justify-self: stretch;
  }
  .case-grid__card-field-label { min-width: 80px; }
}

@media (prefers-reduced-motion: reduce) {
  .case-grid__card { transition: none; }
  .case-grid__card:hover { transform: none; }
}

/* ============== M6 (P02 china-origin) — vb-cert-band-inline ============== */
/* 紧凑 horizontal cert band (5 badge). 视觉骨架近 trust-strip-craft 但 badge 字体更大. */
/* status modifier (--available / --on-request) 视觉差 (color + 圆点 prefix). */
/* NOTE: This block uses class .cert-band-inline (not .cert-band) to avoid clashing with
   the simple .cert-band utility in vb-fabric-grid-4 (P00 M5). */

.cert-band-inline {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: stretch;
  gap: var(--space-3);
  max-width: var(--container-lg);
  margin: 0 auto;
  padding: var(--space-section-tight) 0;
}

.cert-band-inline__badge {
  flex: 1 1 180px;
  min-width: 160px;
  max-width: 220px;
  padding: 20px 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: var(--color-bg);
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: transform var(--transition-base),
              border-color var(--transition-base);
}

.cert-band-inline__abbr {
  font-size: 22px;
  font-weight: 700;
  color: var(--color-primary);
  letter-spacing: 0.04em;
  line-height: var(--lh-tight);
}

.cert-band-inline__market {
  font-size: 12px;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: var(--lh-relaxed);
}

.cert-band-inline__status {
  font-size: var(--fs-small);
  font-weight: 500;
  margin-top: var(--space-1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.cert-band-inline__status::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.cert-band-inline__status--available {
  color: var(--color-primary);
}
.cert-band-inline__status--available::before {
  background: var(--color-primary);
}

.cert-band-inline__status--on-request {
  color: var(--color-text-muted);
  font-style: italic;
}
.cert-band-inline__status--on-request::before {
  background: transparent;
  border: 1.5px solid var(--color-text-muted);
}

@media (hover: hover) {
  .cert-band-inline__badge:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
  }
}

@media (max-width: 1199px) {
  .cert-band-inline {
    flex-wrap: wrap;
    gap: var(--space-2);
  }
  .cert-band-inline__badge {
    flex: 1 1 calc(33% - var(--space-2));
  }
  .cert-band-inline__badge:nth-child(4),
  .cert-band-inline__badge:nth-child(5) {
    flex: 1 1 calc(50% - var(--space-2));
  }
}

@media (max-width: 767px) {
  .cert-band-inline {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 12px;
    padding: var(--space-10) var(--space-2);
  }
  .cert-band-inline__badge {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
    padding: 16px 20px;
    text-align: left;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  .cert-band-inline__abbr {
    flex: 0 0 auto;
    font-size: 20px;
  }
  .cert-band-inline__market {
    flex: 1 1 100%;
    text-align: left;
  }
  .cert-band-inline__status {
    flex: 0 0 auto;
    margin-top: 0;
    margin-left: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cert-band-inline__badge { transition: none; }
  .cert-band-inline__badge:hover { transform: none; }
}

/* ============================================================
   P03 contact-us — 2 new vb blocks (Round 4 append, 2026-05-01)
   - vb-channel-cards-3 (M2, 3 entry cards: WhatsApp / Email / Form)
   - vb-info-band       (M5, dark band: location + hours + tour)
   Source: contact-us.md design_round=3.
   ============================================================ */

/* ============== M2 (P03) — vb-channel-cards-3 ============== */
/* 3 张通道卡 (URGENT / EXPLORATION / DEEP BRIEF). Desktop 3 col, Tablet 1 col, Mobile 1 col. */
.channel-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-grid-gap);
  max-width: var(--container-xl);
  margin: 0 auto;
}
.card-channel {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: var(--space-card);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  position: relative;
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}
.card-channel__icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--color-primary);
  border-radius: 50%;
  color: var(--color-primary);
  margin-bottom: var(--space-2);
  flex-shrink: 0;
}
.card-channel__icon svg {
  width: 22px;
  height: 22px;
}
.card-channel__eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin: 0 0 var(--space-1);
}
.card-channel__title {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: var(--lh-normal);
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}
.card-channel__body {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--color-text-muted);
  margin: 0 0 var(--space-3);
  flex-grow: 1;
}
.card-channel__sla {
  font-size: var(--fs-small);
  font-weight: 500;
  color: var(--color-primary);
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-2);
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}
.card-channel__sla::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--color-accent);
  border-radius: 50%;
  flex-shrink: 0;
}
.card-channel__entry {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: var(--space-2);
}
.card-channel__entry .btn-cta {
  font-size: var(--fs-small);
  padding: 8px 14px;
}
@media (hover: hover) {
  .card-channel:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-3px);
    box-shadow: var(--shadow-card-hover);
  }
}
@media (max-width: 1199px) {
  .channel-grid { grid-template-columns: 1fr; gap: var(--space-3); }
}
@media (max-width: 767px) {
  .channel-grid { grid-template-columns: 1fr; gap: var(--space-2); }
  .card-channel { padding: var(--space-4); }
}
@media (prefers-reduced-motion: reduce) {
  .card-channel { transition: none; }
  .card-channel:hover { transform: none; }
}

/* ============== M5 (P03) — vb-info-band ============== */
/* 1 row × 3 col 紧凑信息带, dark theme, location + hours + tour. */
.info-band {
  background: #1A1A1A;
  color: rgba(255, 255, 255, 0.9);
  padding: 64px 0;
}
.info-band__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
  max-width: var(--container-xl);
  margin: 0 auto;
  padding: 0 var(--space-3);
  position: relative;
}
.info-band__col {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  position: relative;
  padding: 0 var(--space-3);
}
.info-band__col:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: calc(var(--space-6) * -0.5);
  width: 1px;
  background: rgba(212, 165, 116, 0.2);
}
.info-band__icon {
  width: 28px;
  height: 28px;
  color: var(--color-secondary);
  margin-bottom: var(--space-1);
  flex-shrink: 0;
}
.info-band__icon svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  stroke-width: 1.5;
  fill: none;
}
.info-band__title {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
  color: #fff;
  margin: 0 0 12px;
}
.info-band__body {
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.82);
  margin: 0;
}
.info-band__link {
  font-size: var(--fs-small);
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: none;
  margin-top: var(--space-1);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.info-band__link::after {
  content: "→";
  transition: transform var(--transition-base);
}
.info-band__link:hover {
  color: var(--color-secondary);
  text-decoration: none;
}
.info-band__link:hover::after {
  transform: translateX(4px);
}
@media (max-width: 1199px) {
  .info-band { padding: 56px 0; }
  .info-band__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-3);
  }
  .info-band__col:not(:last-child)::after { right: calc(var(--space-3) * -0.5); }
}
@media (max-width: 767px) {
  .info-band { padding: 48px 0; }
  .info-band__grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }
  .info-band__col {
    padding: 0;
    padding-bottom: var(--space-4);
    border-bottom: 1px solid rgba(212, 165, 116, 0.18);
  }
  .info-band__col:last-child { border-bottom: none; padding-bottom: 0; }
  .info-band__col:not(:last-child)::after { display: none; }
}

/* ============================================================
   P20 wholesale-program — 2 new vb blocks (Round 4 append, 2026-05-01)
   - vb-pricing-tier-cards-4   (M2, 4 MOQ tier mechanics cards)
   - vb-incoterms-matrix-cards (M4, 5 incoterms responsibility cards)
   Source: wholesale-program.md design_round=3.
   ============================================================ */

/* ============== M2 (P20) — vb-pricing-tier-cards-4 ============== */
/* 4 张 tier 卡 (Entry / Distribution / Project / Strategic). Desktop 1×4, Tablet 2×2, Mobile 1×4. */
/* 每卡 = eyebrow + range (大字) + tier name + body + ✓ unlock list + reorder bonus footer. */
/* 4 阶 left border 颜色 (--secondary 浅 → --secondary 深 → --primary 浅 → --primary 实) 表达 tier 升级. */

.pricing-tier-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
  max-width: var(--container-xl);
  margin: 0 auto;
}

.card-pricing-tier {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  height: 100%;
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}

.card-pricing-tier--t1 { border-left-color: #E2C39E; }                    /* secondary 浅 */
.card-pricing-tier--t2 { border-left-color: var(--color-secondary); }     /* secondary 实 #D4A574 */
.card-pricing-tier--t3 { border-left-color: #5A8584; }                    /* primary 浅 */
.card-pricing-tier--t4 { border-left-color: var(--color-primary); }       /* primary 实 #2C5F5D */

.card-pricing-tier__eyebrow {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin: 0 0 var(--space-1);
}

.card-pricing-tier__range {
  font-size: clamp(1.5rem, 1.5vw + 0.5rem, 2rem);
  font-weight: 700;
  color: var(--color-primary);
  line-height: var(--lh-tight);
  letter-spacing: -0.01em;
  margin: 0 0 4px;
}

.card-pricing-tier__name {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: var(--lh-normal);
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}

.card-pricing-tier__body {
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
  color: var(--color-text-muted);
  margin: 0 0 var(--space-2);
}

.card-pricing-tier__unlock {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-2);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.card-pricing-tier__unlock li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: var(--fs-small);
  line-height: var(--lh-relaxed);
  color: var(--color-text);
}

.card-pricing-tier__unlock li::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 4px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232C5F5D' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 8.5 6.5 12 13 4.5'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
}

.card-pricing-tier__footer {
  font-size: var(--fs-small);
  font-style: italic;
  line-height: var(--lh-relaxed);
  color: var(--color-text-muted);
  margin-top: auto;
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border);
}

@media (hover: hover) {
  .card-pricing-tier:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-3px);
    box-shadow: var(--shadow-card-hover);
  }
}

@media (max-width: 1199px) {
  .pricing-tier-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
  }
}

@media (max-width: 767px) {
  .pricing-tier-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .card-pricing-tier {
    padding: 24px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .card-pricing-tier { transition: none; }
  .card-pricing-tier:hover { transform: none; }
}

/* ============== M4 (P20) — vb-incoterms-matrix-cards ============== */
/* 5 张 incoterms 责任卡 (EXW / FOB / CIF / DAP / DDP). Desktop 1×5, Tablet 2×2+1, Mobile 1×5. */
/* 每卡 = abbr (大字) + full name + factory ✓ list + buyer ● list + use case + ICP. */
/* 卡内分两栏: factory ✓ 和 buyer ● 并排, 视觉强调 "责任分界". */

.incoterms-matrix {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-3);
  max-width: var(--container-xl);
  margin: 0 auto;
}

.card-incoterm {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: 28px 22px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  height: 100%;
  transition: transform var(--transition-base),
              border-color var(--transition-base),
              box-shadow var(--transition-base);
}

.card-incoterm__abbr {
  font-size: clamp(2rem, 2vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: var(--color-primary);
  line-height: var(--lh-tight);
  letter-spacing: 0.02em;
  margin: 0;
}

.card-incoterm__fullname {
  font-size: var(--fs-small);
  font-weight: 500;
  color: var(--color-text-muted);
  line-height: var(--lh-relaxed);
  margin: 0 0 var(--space-2);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--color-border);
}

.card-incoterm__split {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.card-incoterm__col-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin: 0 0 6px;
}

.card-incoterm__factory-list,
.card-incoterm__buyer-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.card-incoterm__factory-list li,
.card-incoterm__buyer-list li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: var(--lh-relaxed);
  color: var(--color-text);
}

.card-incoterm__factory-list li::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  margin-top: 4px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232C5F5D' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 8.5 6.5 12 13 4.5'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
}

.card-incoterm__buyer-list li::before {
  content: "●";
  display: inline-block;
  flex-shrink: 0;
  color: var(--color-accent);
  font-size: 10px;
  line-height: 1.5;
  width: 12px;
  text-align: center;
}

.card-incoterm__usecase {
  font-size: 13px;
  font-style: italic;
  line-height: var(--lh-relaxed);
  color: var(--color-text-muted);
  margin: 0;
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border);
}

.card-incoterm__icp {
  font-size: 12px;
  font-weight: 500;
  color: var(--color-primary);
  letter-spacing: 0.04em;
  margin: 0;
  margin-top: auto;
  padding-top: 6px;
}

@media (hover: hover) {
  .card-incoterm:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
    box-shadow: var(--shadow-card-hover);
  }
}

@media (max-width: 1399px) and (min-width: 1200px) {
  .incoterms-matrix { gap: var(--space-2); }
  .card-incoterm { padding: 24px 18px; }
}

@media (max-width: 1199px) {
  .incoterms-matrix {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
  }
  .card-incoterm:nth-child(5) {
    grid-column: 1 / span 2;
    max-width: calc(50% - var(--space-2));
    justify-self: center;
  }
}

@media (max-width: 767px) {
  .incoterms-matrix {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .card-incoterm {
    padding: 22px 18px;
  }
  .card-incoterm:nth-child(5) {
    grid-column: 1;
    max-width: 100%;
    justify-self: stretch;
  }
}

@media (prefers-reduced-motion: reduce) {
  .card-incoterm { transition: none; }
  .card-incoterm:hover { transform: none; }
}

/* ============== vb-label-options-grid-4 (P21 Private Label) ============== */
[data-block-type="vb-label-options-grid-4"] {
  padding: 96px 0;
  background: var(--color-bg-light);
}
.label-options-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
  list-style: none;
}
.label-options-grid__card {
  background: #fff;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
@media (hover: hover) {
  .label-options-grid__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(44, 95, 93, 0.08);
  }
}
.label-options-grid__card-image {
  aspect-ratio: 1 / 1;
  border-radius: 6px;
  overflow: hidden;
  background: var(--color-bg-light);
}
.label-options-grid__card-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.label-options-grid__card-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.3;
  margin: 0;
}
.label-options-grid__card-body {
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.6;
  margin: 0;
}
@media (max-width: 1199px) {
  .label-options-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .label-options-grid { grid-template-columns: 1fr; padding: 0 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .label-options-grid__card { transition: none; }
}

/* ============== vb-hangtag-spec-card (P21 Private Label) ============== */
[data-block-type="vb-hangtag-spec-card"] {
  padding: 96px 0;
  background: #fff;
}
.hangtag-spec-card {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 48px;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px;
  align-items: start;
}
.hangtag-spec-card__visual {
  background: var(--color-bg-light);
  border-radius: 8px;
  padding: 40px;
  aspect-ratio: 4 / 5;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hangtag-spec-card__specs {
  display: grid;
  gap: 24px;
}
.hangtag-spec-card__spec-row {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E5E0D6;
}
.hangtag-spec-card__spec-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.hangtag-spec-card__spec-value {
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.6;
}
.hangtag-spec-card__spec-value ul {
  margin: 0;
  padding-left: 20px;
}
@media (max-width: 1199px) {
  .hangtag-spec-card { grid-template-columns: 240px 1fr; gap: 32px; }
}
@media (max-width: 767px) {
  .hangtag-spec-card {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 0 16px;
  }
  .hangtag-spec-card__visual { aspect-ratio: 3 / 4; max-width: 280px; margin: 0 auto; }
  .hangtag-spec-card__spec-row { grid-template-columns: 1fr; gap: 4px; }
}

/* ============== P22 — vb-decision-tree-7 (OEM vs ODM 7-step decision) ============== */
[data-block-type="vb-decision-tree-7"] {
  /* section padding handled by .section utility on the wrapping <section>; keep block flush */
}
.decision-tree-7 {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  gap: 24px;
}
.decision-tree-7__step {
  background: #fff;
  border-radius: 8px;
  padding: 24px 32px;
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 24px;
  align-items: start;
  box-shadow: 0 2px 8px rgba(44, 95, 93, 0.04);
  border: 1px solid var(--color-border);
}
.decision-tree-7__step-num {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.125rem;
}
.decision-tree-7__step-question {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 12px;
  line-height: 1.4;
}
.decision-tree-7__step-branches {
  display: grid;
  gap: 8px;
}
.decision-tree-7__branch {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 16px;
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.5;
}
.decision-tree-7__branch-label {
  font-weight: 600;
  color: var(--color-secondary);
}
.decision-tree-7__step.is-result {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.decision-tree-7__step.is-result .decision-tree-7__step-num {
  background: var(--color-accent);
}
.decision-tree-7__step.is-result .decision-tree-7__step-question,
.decision-tree-7__step.is-result .decision-tree-7__branch {
  color: #fff;
}
.decision-tree-7__step.is-result .decision-tree-7__branch-label {
  color: var(--color-secondary);
}
@media (max-width: 767px) {
  .decision-tree-7__step { grid-template-columns: 1fr; gap: 12px; padding: 20px; }
  .decision-tree-7__step-num { margin-bottom: 8px; }
  .decision-tree-7__branch { grid-template-columns: 1fr; gap: 4px; }
  .decision-tree-7__branch-label { padding-bottom: 2px; }
}

/* ============== P22 — vb-qc-flow-4 (AQL 2.5 four-stage QC) ============== */
[data-block-type="vb-qc-flow-4"] {
  /* background handled by .section--white on wrapping <section> */
}
.qc-flow-4 {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.qc-flow-4__stage {
  background: var(--color-bg-soft);
  border-radius: 8px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  border-top: 4px solid var(--color-secondary);
}
.qc-flow-4__stage-num {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--color-secondary);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.qc-flow-4__stage-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.3;
  margin: 0;
}
.qc-flow-4__stage-body {
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.6;
  flex: 1;
  margin: 0;
}
@media (max-width: 1199px) {
  .qc-flow-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .qc-flow-4 { grid-template-columns: 1fr; }
}

/* ==================== vb-integration-cards-3 (P23) ==================== */
[data-block-type="vb-integration-cards-3"] {
  padding: 96px 0;
  background: #fff;
}
.integration-cards-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}
.integration-cards-3__card {
  background: var(--color-bg-soft, #F5EBE0);
  border-radius: 8px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.integration-cards-3__card--featured {
  background: var(--color-primary);
  color: #fff;
}
.integration-cards-3__card--featured .integration-cards-3__card-eyebrow {
  color: var(--color-secondary);
}
.integration-cards-3__card-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.integration-cards-3__card-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.3;
}
.integration-cards-3__card--featured .integration-cards-3__card-title { color: #fff; }
.integration-cards-3__card-body {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text);
  flex: 1;
}
.integration-cards-3__card--featured .integration-cards-3__card-body { color: rgba(255,255,255,0.85); }
.integration-cards-3__card-setup {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-accent);
  margin-top: 8px;
}
@media (max-width: 1199px) {
  .integration-cards-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .integration-cards-3 { grid-template-columns: 1fr; padding: 0 16px; }
}

/* ==================== vb-reconciliation-band (P23) ==================== */
[data-block-type="vb-reconciliation-band"] {
  padding: 96px 0;
  background: #fff;
}
.reconciliation-band {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}
.reconciliation-band__col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-left: 20px;
}
.reconciliation-band__col-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary);
}
.reconciliation-band__col-body {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text);
}
@media (max-width: 1199px) {
  .reconciliation-band { grid-template-columns: 1fr; gap: 24px; }
}

/* ============== vb-mix-match-band (P30 wholesale-yoga-apparel M3) ============== */
[data-block-type="vb-mix-match-band"] {
  padding: 96px 0;
  background: var(--color-bg-soft, #F5EBE0);
}
.mix-match-band {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}
.mix-match-band__intro {
  max-width: 720px;
  margin: 0 auto 48px;
  text-align: center;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--color-text);
}
.mix-match-band__combos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.mix-match-band__combo {
  background: #fff;
  border-radius: 8px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 4px solid var(--color-accent);
}
.mix-match-band__combo-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-accent);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.mix-match-band__combo-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.3;
}
.mix-match-band__combo-body {
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.6;
}
.mix-match-band__combo-total {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary);
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid #E5E0D6;
}
@media (max-width: 1199px) {
  .mix-match-band__combos { grid-template-columns: 1fr; gap: 16px; }
}

/* vb-entry-wall-9 → 11 cards adapter (P30) */
.entry-wall-11 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-grid-gap);
}
@media (max-width: 991px) {
  .entry-wall-11 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .entry-wall-11 { grid-template-columns: 1fr; }
}

/* ============== vb-capacity-calc (P34, container capacity reference) ============== */
[data-block-type="vb-capacity-calc"] {
  padding: 96px 0;
  background: var(--color-bg-soft, #F5EBE0);
}
.capacity-calc {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}
.capacity-calc__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}
.capacity-calc__card {
  background: #fff;
  border-radius: 8px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-top: 4px solid var(--color-primary);
}
.capacity-calc__card-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary);
}
.capacity-calc__card-volume {
  font-size: 0.8125rem;
  color: var(--color-secondary);
  font-weight: 600;
}
.capacity-calc__card-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.capacity-calc__card-list li {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-text);
  padding-left: 16px;
  position: relative;
}
.capacity-calc__card-list li::before {
  content: '·';
  position: absolute;
  left: 0;
  color: var(--color-secondary);
  font-weight: 700;
}
.capacity-calc__disclaimer {
  font-size: 0.875rem;
  color: var(--color-text);
  font-style: italic;
  text-align: center;
  margin-top: 24px;
}
@media (max-width: 1199px) {
  .capacity-calc__cards { grid-template-columns: 1fr; }
}

/* ============================================================
   INDEX-V2 — Editorial visual upgrade (index.html only)
   All classes prefixed with vb-*-v2 / *-v2 to avoid impacting
   the other 31 pages that share landing-blocks.css.
   Aesthetic: editorial / premium / earthy / spacious / B2B-conversion.
   ============================================================ */

/* ---------- M1 v2: Editorial hero ---------- */
.hero-A-v2 {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: stretch;
  color: var(--color-text-on-dark);
  overflow: hidden;
  padding: clamp(96px, 12vh, 160px) 0 0;
  background: #0F1F1E;
}
.hero-A-v2::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(115deg,
      rgba(15, 31, 30, 0.94) 0%,
      rgba(44, 95, 93, 0.62) 38%,
      rgba(26, 26, 26, 0.45) 70%,
      rgba(0, 0, 0, 0.35) 100%);
}
.hero-A-v2__bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%;
  z-index: -1;
  filter: saturate(0.92) contrast(1.04);
}
.hero-A-v2 .container-yv {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.62fr);
  gap: clamp(32px, 4vw, 80px);
  align-items: end;
  padding-bottom: clamp(72px, 10vh, 120px);
}
.hero-A-v2__eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 0.75rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.28em;
  color: var(--color-secondary);
  margin-bottom: clamp(28px, 3vw, 40px);
}
.hero-A-v2__eyebrow::before {
  content: ""; display: inline-block;
  width: 48px; height: 1px;
  background: var(--color-secondary);
}
.hero-A-v2__h1 {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: clamp(2.75rem, 7.6vw, 6.75rem);
  line-height: 0.96;
  letter-spacing: -0.035em;
  color: #fff;
  margin: 0 0 clamp(24px, 2.5vw, 36px);
  text-wrap: balance;
}
.hero-A-v2__h1 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--color-secondary);
  letter-spacing: -0.02em;
  display: inline-block;
}
.hero-A-v2__h1 .h1-rule {
  display: block;
  width: 88px; height: 2px;
  background: var(--color-secondary);
  margin: clamp(20px, 2vw, 28px) 0;
  opacity: 0.85;
}
.hero-A-v2__sub {
  font-size: clamp(1.0625rem, 0.6vw + 1rem, 1.375rem);
  line-height: 1.5;
  color: rgba(250, 247, 242, 0.88);
  max-width: 620px;
  margin: 0 0 clamp(32px, 3vw, 44px);
  font-weight: 400;
}
.hero-A-v2__ctas { display: flex; flex-wrap: wrap; gap: 16px; }

/* Right column: editorial data signals */
.hero-A-v2__signals {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(250, 247, 242, 0.18);
  border: 1px solid rgba(250, 247, 242, 0.18);
  align-self: end;
  margin-bottom: 0;
}
.hero-A-v2__signal {
  background: rgba(15, 31, 30, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: clamp(18px, 1.6vw, 24px);
  display: flex; flex-direction: column; gap: 6px;
}
.hero-A-v2__signal-num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.75rem, 2.5vw, 2.5rem);
  color: var(--color-secondary);
  line-height: 1;
  letter-spacing: -0.01em;
}
.hero-A-v2__signal-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(250, 247, 242, 0.78);
  font-weight: 600;
}
.hero-A-v2__scroll-cue {
  position: absolute; bottom: 24px; left: 50%;
  transform: translateX(-50%); z-index: 3;
  font-size: 0.75rem;
  color: rgba(250, 247, 242, 0.55);
  letter-spacing: 0.25em; text-transform: uppercase;
  font-weight: 500;
}
.hero-A-v2__scroll-cue::after {
  content: "↓"; display: block; text-align: center;
  margin-top: 6px; font-size: 16px;
}

/* Marquee at the very bottom of the hero */
.hero-A-v2__marquee {
  position: relative; z-index: 2;
  border-top: 1px solid rgba(250, 247, 242, 0.18);
  border-bottom: 1px solid rgba(250, 247, 242, 0.18);
  background: rgba(15, 31, 30, 0.5);
  overflow: hidden;
  padding: 18px 0;
  margin-top: auto;
}
.hero-A-v2__marquee-track {
  display: flex; gap: 56px;
  white-space: nowrap;
  animation: hero-marquee-scroll 38s linear infinite;
  will-change: transform;
}
.hero-A-v2__marquee-item {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: rgba(250, 247, 242, 0.75);
  text-transform: uppercase;
  font-weight: 500;
}
.hero-A-v2__marquee-item::before {
  content: "✕"; color: var(--color-secondary); font-size: 10px;
  font-weight: 700;
}
@keyframes hero-marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-A-v2__marquee-track { animation: none; }
}

@media (max-width: 1199px) {
  .hero-A-v2 .container-yv {
    grid-template-columns: 1fr;
    gap: 56px;
  }
  .hero-A-v2__signals { max-width: 520px; }
}
@media (max-width: 767px) {
  .hero-A-v2 { min-height: auto; padding-top: 84px; }
  .hero-A-v2__h1 { font-size: clamp(2.25rem, 9vw, 3.5rem); }
  .hero-A-v2__ctas .btn-cta { width: 100%; }
  .hero-A-v2__signals { grid-template-columns: 1fr 1fr; }
}

/* ---------- M1.5 v2: Numbered editorial trust strip ---------- */
.trust-strip-v2 {
  background: var(--color-bg);
  padding: clamp(56px, 6vw, 88px) 0;
  border-bottom: 1px solid var(--color-border);
}
.trust-strip-v2__heading {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--color-text-muted);
  font-weight: 600;
  margin-bottom: clamp(24px, 3vw, 40px);
  display: flex; align-items: center; gap: 16px;
}
.trust-strip-v2__heading::after {
  content: ""; flex: 1; height: 1px;
  background: var(--color-border-strong);
  opacity: 0.5;
}
.trust-strip-v2__list {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  border-top: 1px solid var(--color-border);
  border-left: 1px solid var(--color-border);
}
.trust-strip-v2__item {
  border-right: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  padding: clamp(20px, 2vw, 28px);
  display: flex; flex-direction: column; gap: 14px;
  transition: background var(--transition-base);
  min-height: 168px;
  justify-content: space-between;
}
.trust-strip-v2__item:hover { background: var(--color-bg-soft); }
.trust-strip-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: 1.5rem;
  color: var(--color-secondary);
  line-height: 1;
  letter-spacing: 0.02em;
}
.trust-strip-v2__label {
  font-size: 1rem;
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.35;
  letter-spacing: -0.005em;
}
@media (max-width: 991px) {
  .trust-strip-v2__list { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .trust-strip-v2__list { grid-template-columns: 1fr; }
}

/* ---------- M2 v2: Editorial opinion w/ pull-quote ---------- */
.section-v2 {
  padding: clamp(96px, 12vw, 160px) 0;
  position: relative;
}
.section-v2--soft { background: var(--color-bg-soft); }
.section-v2--white { background: var(--color-bg); }
.section-v2--ink { background: #1A1A1A; color: var(--color-text-on-dark); }
.section-v2--primary { background: var(--color-primary); color: var(--color-text-on-dark); }
.section-v2--ink h2, .section-v2--ink h3 { color: var(--color-text-on-dark); }
.section-v2--primary h2, .section-v2--primary h3 { color: var(--color-text-on-dark); }

.section-head-v2 {
  display: grid;
  grid-template-columns: minmax(0, 0.34fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 80px);
  align-items: start;
  margin-bottom: clamp(56px, 6vw, 96px);
}
.section-head-v2__eyebrow {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--color-secondary);
  font-weight: 600;
  padding-top: 14px;
  border-top: 2px solid var(--color-secondary);
  display: inline-flex;
  align-self: start;
}
.section-head-v2__title {
  font-size: clamp(1.875rem, 3.4vw, 3.25rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.025em;
  margin: 0 0 clamp(20px, 2vw, 28px);
  color: var(--color-primary);
  text-wrap: balance;
}
.section-v2--ink .section-head-v2__title,
.section-v2--primary .section-head-v2__title { color: #fff; }
.section-head-v2__title em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--color-secondary);
}
.section-head-v2__intro {
  font-size: clamp(1.0625rem, 0.4vw + 1rem, 1.25rem);
  line-height: 1.55;
  color: var(--color-text);
  max-width: 720px;
  margin: 0;
}
.section-v2--ink .section-head-v2__intro { color: rgba(250, 247, 242, 0.82); }
.section-v2--primary .section-head-v2__intro { color: rgba(250, 247, 242, 0.92); }
@media (max-width: 991px) {
  .section-head-v2 { grid-template-columns: 1fr; gap: 24px; }
}

.opinion-grid-v2 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(20px, 2vw, 32px);
}
.opinion-grid-v2__pullquote {
  grid-column: span 12;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.875rem, 3.4vw, 3.25rem);
  line-height: 1.18;
  color: var(--color-primary);
  letter-spacing: -0.015em;
  margin: 0 0 clamp(40px, 5vw, 64px);
  max-width: 980px;
  position: relative;
  padding-left: clamp(20px, 2vw, 32px);
}
.opinion-grid-v2__pullquote cite {
  display: block;
  font-family: var(--font-sans);
  font-style: normal;
  font-weight: 600;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--color-text-muted);
  margin-top: 20px;
}
.card-opinion-v2 {
  grid-column: span 4;
  background: var(--color-bg);
  border-top: 2px solid var(--color-primary);
  padding: clamp(24px, 2vw, 32px) 0 0;
  display: flex; flex-direction: column;
  transition: transform var(--transition-base);
}
.card-opinion-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 2.5rem;
  font-weight: 500;
  color: var(--color-secondary);
  line-height: 1;
  margin-bottom: 20px;
}
.card-opinion-v2__title {
  font-size: clamp(1.25rem, 1vw + 1rem, 1.5rem);
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 14px;
  color: var(--color-primary);
  letter-spacing: -0.01em;
}
.card-opinion-v2__body {
  color: var(--color-text-muted);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0;
}
@media (hover: hover) {
  .card-opinion-v2:hover { transform: translateY(-4px); }
}
@media (max-width: 991px) {
  .card-opinion-v2 { grid-column: span 12; }
}

/* ---------- M3 v2: Numbered editorial process ---------- */
.process-v2 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(20px, 2vw, 32px);
  position: relative;
}
.process-v2__step {
  grid-column: span 4;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  padding: clamp(28px, 2.4vw, 40px);
  display: flex; flex-direction: column;
  position: relative;
  transition: border-color var(--transition-base), box-shadow var(--transition-base);
  min-height: 280px;
}
.process-v2__step:hover {
  border-color: var(--color-border-strong);
  box-shadow: var(--shadow-card-hover);
}
.process-v2__step--featured {
  grid-column: span 8;
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.process-v2__step--featured .process-v2__num,
.process-v2__step--featured .process-v2__label { color: var(--color-secondary); }
.process-v2__step--featured .process-v2__desc { color: rgba(250, 247, 242, 0.85); }
.process-v2__step--featured .process-v2__title { color: #fff; }
.process-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(2rem, 2vw + 1rem, 3rem);
  color: var(--color-secondary);
  line-height: 1;
  letter-spacing: -0.02em;
  margin-bottom: 24px;
  display: inline-flex; align-items: baseline; gap: 6px;
}
.process-v2__num::before {
  content: "—"; color: var(--color-secondary); opacity: 0.5;
  font-size: 0.6em; font-style: normal;
  margin-right: 8px;
}
.process-v2__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 600;
  color: var(--color-text-muted);
  margin-bottom: 10px;
}
.process-v2__title {
  font-size: clamp(1.125rem, 0.6vw + 1rem, 1.375rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-primary);
  margin: 0 0 14px;
  letter-spacing: -0.01em;
}
.process-v2__desc {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  margin: 0;
}
.process-v2__image {
  grid-column: span 12;
  margin-top: clamp(48px, 5vw, 72px);
  border-radius: 0;
  overflow: hidden;
  position: relative;
}
.process-v2__image img {
  width: 100%; height: auto;
  filter: saturate(0.92);
}
.process-v2__image-caption {
  position: absolute;
  bottom: clamp(16px, 2vw, 24px);
  left: clamp(16px, 2vw, 24px);
  background: rgba(26, 26, 26, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  padding: 10px 16px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 600;
}
@media (max-width: 991px) {
  .process-v2__step,
  .process-v2__step--featured { grid-column: span 12; min-height: auto; }
}

/* ---------- M4 v2: Bento promise grid + premium product mocks ---------- */
.promise-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: minmax(180px, auto);
  gap: clamp(16px, 1.6vw, 24px);
}
.bento-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  padding: clamp(24px, 2vw, 36px);
  display: flex; flex-direction: column;
  position: relative;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}
.bento-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}
.bento-card__kicker {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 600;
  color: var(--color-secondary);
  margin-bottom: 14px;
  display: inline-flex; align-items: center; gap: 10px;
}
.bento-card__kicker::before {
  content: ""; width: 24px; height: 1px;
  background: var(--color-secondary);
}
.bento-card__title {
  font-size: clamp(1.25rem, 1vw + 1rem, 1.625rem);
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.015em;
  margin: 0 0 16px;
  color: var(--color-primary);
}
.bento-card__body {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  margin: 0;
}
.bento-card--lg { grid-column: span 6; grid-row: span 2; }
.bento-card--md { grid-column: span 6; }
.bento-card--moq {
  grid-column: span 6; grid-row: span 2;
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.bento-card--moq .bento-card__title,
.bento-card--moq .bento-card__kicker { color: var(--color-secondary); }
.bento-card--moq .bento-card__title { color: #fff; }
.moq-list-v2 {
  list-style: none; margin: 24px 0 0; padding: 0;
  display: grid; gap: 0;
  border-top: 1px solid rgba(250, 247, 242, 0.15);
}
.moq-list-v2 li {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 24px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(250, 247, 242, 0.15);
}
.moq-list-v2 .moq-num-v2 {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(2.5rem, 4vw, 4rem);
  color: var(--color-secondary);
  line-height: 0.95;
  letter-spacing: -0.02em;
  min-width: 96px;
}
.moq-list-v2 .moq-label-v2 {
  font-size: 0.9375rem;
  font-weight: 500;
  color: rgba(250, 247, 242, 0.92);
  letter-spacing: 0.02em;
}
.bento-card--moq .note-line {
  color: rgba(250, 247, 242, 0.7);
  margin-top: 16px;
}
@media (max-width: 991px) {
  .bento-card--lg, .bento-card--md, .bento-card--moq {
    grid-column: span 12; grid-row: auto;
  }
}

/* Premium product mocks (browser chrome, MOQ accent) */
.product-mock-row-v2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(20px, 2vw, 32px);
  margin-top: clamp(56px, 6vw, 80px);
}
.product-mock-v2 {
  margin: 0;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(26,26,26,0.06);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}
.product-mock-v2:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 56px rgba(26,26,26,0.12);
}
.product-mock-v2__chrome {
  display: flex; align-items: center; gap: 6px;
  padding: 14px 18px;
  background: var(--color-bg-soft);
  border-bottom: 1px solid var(--color-border);
}
.product-mock-v2__chrome span {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--color-border-strong);
}
.product-mock-v2__chrome span:nth-child(1) { background: var(--color-accent); }
.product-mock-v2__chrome span:nth-child(2) { background: var(--color-secondary); }
.product-mock-v2__chrome span:nth-child(3) { background: var(--color-primary); }
.product-mock-v2__chrome::after {
  content: "yogavendor.com / product";
  margin-left: 16px;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  letter-spacing: 0.04em;
  font-family: var(--font-sans);
}
.product-mock-v2__body {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--color-bg-soft);
}
.product-mock-v2__body img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
}
.product-mock-v2__badge {
  position: absolute;
  top: 16px; left: 16px;
  background: var(--color-accent);
  color: #fff;
  padding: 10px 16px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  border-radius: 2px;
  display: inline-flex; align-items: baseline; gap: 6px;
}
.product-mock-v2__badge strong {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1;
}
.product-mock-v2__caption {
  padding: 18px 20px;
  border-top: 1px solid var(--color-border);
  font-size: 0.875rem;
  color: var(--color-text);
  font-weight: 500;
  letter-spacing: 0.01em;
  background: var(--color-bg);
}
@media (max-width: 991px) {
  .product-mock-row-v2 { grid-template-columns: 1fr; }
}

/* ---------- M5 v2: Bento fabric library ---------- */
.fabric-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: minmax(220px, auto);
  gap: clamp(16px, 1.6vw, 24px);
}
.fabric-card-v2 {
  position: relative;
  overflow: hidden;
  background: var(--color-bg-soft);
  border-radius: 0;
  display: flex; flex-direction: column;
  transition: transform var(--transition-base);
}
.fabric-card-v2:hover { transform: translateY(-4px); }
.fabric-card-v2__img {
  position: relative;
  flex: 1;
  overflow: hidden;
  min-height: 220px;
}
.fabric-card-v2__img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.6s ease;
  filter: saturate(0.95);
}
.fabric-card-v2:hover .fabric-card-v2__img img { transform: scale(1.04); }
.fabric-card-v2__body {
  background: var(--color-bg);
  padding: clamp(20px, 1.6vw, 28px);
  border-top: 1px solid var(--color-border);
}
.fabric-card-v2__title {
  font-size: clamp(1.125rem, 0.6vw + 1rem, 1.375rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  margin: 0 0 8px;
  color: var(--color-primary);
}
.fabric-card-v2__spec {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  margin: 0;
}
.fabric-card-v2--hero { grid-column: span 7; grid-row: span 2; }
.fabric-card-v2--md { grid-column: span 5; }
.fabric-card-v2--sm { grid-column: span 6; }
.fabric-card-v2--hero .fabric-card-v2__img { min-height: 480px; }
@media (max-width: 991px) {
  .fabric-card-v2--hero,
  .fabric-card-v2--md,
  .fabric-card-v2--sm { grid-column: span 12; grid-row: auto; }
  .fabric-card-v2--hero .fabric-card-v2__img { min-height: 320px; }
}

.cert-band-v2 {
  display: flex; flex-wrap: wrap;
  gap: 0;
  margin-top: clamp(48px, 5vw, 72px);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.cert-band-v2__item {
  flex: 1 1 200px;
  text-align: center;
  padding: 24px 16px;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 600;
  color: var(--color-text-muted);
  border-right: 1px solid var(--color-border);
}
.cert-band-v2__item:last-child { border-right: 0; }
@media (max-width: 767px) {
  .cert-band-v2__item { flex: 1 1 50%; border-bottom: 1px solid var(--color-border); }
}

.money-callout-v2 {
  margin-top: clamp(40px, 4vw, 56px);
  padding: clamp(32px, 3vw, 48px);
  background: var(--color-bg);
  font-size: clamp(1.125rem, 0.6vw + 1rem, 1.375rem);
  line-height: 1.55;
  color: var(--color-text);
  max-width: 920px;
}
.money-callout-v2 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--color-primary);
  font-size: 1.15em;
  display: block;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}

/* ---------- M6 v2: Editorial column ICP ---------- */
.icp-columns-v2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.card-icp-v2 {
  padding: clamp(28px, 2.4vw, 40px) clamp(20px, 2vw, 28px);
  border-right: 1px solid var(--color-border);
  display: flex; flex-direction: column;
  position: relative;
  transition: background var(--transition-base);
}
.card-icp-v2:last-child { border-right: 0; }
.card-icp-v2:hover { background: var(--color-bg); }
.card-icp-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: 1.5rem;
  color: var(--color-secondary);
  line-height: 1;
  margin-bottom: 28px;
}
.card-icp-v2__title {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 14px;
  color: var(--color-primary);
  letter-spacing: -0.005em;
}
.card-icp-v2__body {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  margin: 0 0 24px;
  flex: 1;
}
.card-icp-v2__link {
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  border-bottom: 1px solid var(--color-secondary);
  padding-bottom: 4px;
  align-self: start;
  transition: color var(--transition-base);
}
.card-icp-v2__link:hover { color: var(--color-accent); }
@media (max-width: 991px) {
  .icp-columns-v2 { grid-template-columns: repeat(2, 1fr); }
  .card-icp-v2:nth-child(2) { border-right: 0; }
  .card-icp-v2:nth-child(1), .card-icp-v2:nth-child(2) { border-bottom: 1px solid var(--color-border); }
}
@media (max-width: 540px) {
  .icp-columns-v2 { grid-template-columns: 1fr; }
  .card-icp-v2 { border-right: 0; border-bottom: 1px solid var(--color-border); }
  .card-icp-v2:last-child { border-bottom: 0; }
}

/* ---------- M8 v2: Manifesto-style anti-fit ---------- */
.anti-fit-v2 {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 0;
  border-top: 1px solid rgba(250, 247, 242, 0.15);
}
.anti-fit-v2__item {
  display: grid;
  grid-template-columns: clamp(48px, 5vw, 80px) 1fr;
  gap: clamp(20px, 3vw, 48px);
  padding: clamp(28px, 3vw, 44px) 0;
  border-bottom: 1px solid rgba(250, 247, 242, 0.15);
  align-items: baseline;
}
.anti-fit-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.5rem, 2vw, 2rem);
  color: var(--color-secondary);
  line-height: 1;
  letter-spacing: 0.02em;
}
.anti-fit-v2__text {
  font-size: clamp(1.0625rem, 0.6vw + 1rem, 1.375rem);
  line-height: 1.45;
  margin: 0;
  color: rgba(250, 247, 242, 0.92);
  font-weight: 400;
  letter-spacing: -0.005em;
}
.anti-fit-v2__text strong {
  font-weight: 600;
  color: #fff;
  display: block;
  margin-bottom: 10px;
  font-size: 1.05em;
  letter-spacing: -0.01em;
}

/* ---------- M9 v2: Big-day-number zigzag timeline ---------- */
.timeline7-v2 {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: clamp(8px, 1vw, 16px);
  position: relative;
}
.timeline7-v2::before {
  content: ""; position: absolute;
  top: clamp(56px, 5vw, 80px); left: 0; right: 0;
  height: 1px;
  background: var(--color-border-strong);
  z-index: 0;
}
.timeline7-v2__step {
  position: relative; z-index: 1;
  display: flex; flex-direction: column;
  padding: 0 8px;
}
.timeline7-v2__step:nth-child(even) { padding-top: clamp(40px, 4vw, 64px); }
.timeline7-v2__day {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(2.75rem, 4vw, 4.5rem);
  color: var(--color-secondary);
  line-height: 0.9;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
}
.timeline7-v2__day-label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 600;
  color: var(--color-text-muted);
  margin-bottom: 16px;
  display: block;
}
.timeline7-v2__title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-primary);
  margin: 0 0 8px;
  letter-spacing: -0.005em;
}
.timeline7-v2__desc {
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--color-text-muted);
  margin: 0;
}
@media (max-width: 1199px) {
  .timeline7-v2 { grid-template-columns: repeat(2, 1fr); row-gap: 32px; }
  .timeline7-v2::before { display: none; }
  .timeline7-v2__step:nth-child(even) { padding-top: 0; }
}
@media (max-width: 540px) {
  .timeline7-v2 { grid-template-columns: 1fr; }
}

/* ---------- M10A v2: Editorial entry wall ---------- */
.entry-wall-v2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--color-border);
  border-left: 1px solid var(--color-border);
}
.card-entry-v2 {
  display: flex; flex-direction: column;
  padding: clamp(28px, 2.4vw, 40px);
  border-right: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg);
  text-decoration: none;
  color: inherit;
  transition: background var(--transition-base);
  position: relative;
  min-height: 200px;
  justify-content: space-between;
}
.card-entry-v2:hover {
  background: var(--color-primary);
  color: #fff;
  text-decoration: none;
}
.card-entry-v2:hover .card-entry-v2__title,
.card-entry-v2:hover .card-entry-v2__desc { color: #fff; }
.card-entry-v2:hover .card-entry-v2__num { color: var(--color-secondary); }
.card-entry-v2__num {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: 1.25rem;
  color: var(--color-secondary);
  line-height: 1;
  margin-bottom: 24px;
  transition: color var(--transition-base);
}
.card-entry-v2__title {
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-primary);
  margin: 0 0 10px;
  letter-spacing: -0.005em;
  text-transform: capitalize;
  transition: color var(--transition-base);
}
.card-entry-v2__desc {
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--color-text-muted);
  margin: 0;
  transition: color var(--transition-base);
}
.card-entry-v2__arrow {
  position: absolute;
  top: clamp(28px, 2.4vw, 40px);
  right: clamp(28px, 2.4vw, 40px);
  font-size: 18px;
  color: var(--color-text-muted);
  transition: transform var(--transition-base), color var(--transition-base);
}
.card-entry-v2:hover .card-entry-v2__arrow {
  color: var(--color-secondary);
  transform: translate(4px, -4px);
}
@media (max-width: 991px) {
  .entry-wall-v2 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .entry-wall-v2 { grid-template-columns: 1fr; }
}

/* ---------- M10B v2: Editorial form (split layout, primary-bg) ---------- */
.form-full-v2 {
  display: grid;
  grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
  gap: 0;
  background: var(--color-primary);
  color: #fff;
  overflow: hidden;
  border-radius: 0;
}
.form-full-v2__intro {
  padding: clamp(40px, 5vw, 72px);
  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  border-right: 1px solid rgba(250, 247, 242, 0.12);
  display: flex; flex-direction: column; gap: 20px;
}
.form-full-v2__intro h2 {
  font-size: clamp(1.75rem, 2.4vw, 2.5rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #fff;
  margin: 0 0 8px;
}
.form-full-v2__intro h2 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--color-secondary);
}
.form-full-v2__lede {
  font-size: 1rem;
  line-height: 1.55;
  color: rgba(250, 247, 242, 0.85);
  margin: 0 0 24px;
}
.form-full-v2__trust h3 {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 600;
  color: var(--color-secondary);
  margin: 24px 0 10px;
}
.form-full-v2__trust p,
.form-full-v2__trust ul {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: rgba(250, 247, 242, 0.88);
  margin: 0;
}
.form-full-v2__trust ul {
  list-style: none; padding: 0;
}
.form-full-v2__trust li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 6px;
}
.form-full-v2__trust li::before {
  content: "→";
  position: absolute; left: 0;
  color: var(--color-secondary);
}
.form-full-v2__divider {
  width: 32px; height: 1px;
  background: rgba(250, 247, 242, 0.25);
  margin: 4px 0;
}
.form-full-v2__form {
  padding: clamp(40px, 5vw, 72px);
  background: var(--color-primary-dark);
}
.form-full-v2__form .form-row-2 {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 16px; margin-bottom: 16px;
}
.form-full-v2__form .form-field { margin-bottom: 16px; }
.form-full-v2__form .form-field label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 600;
  color: rgba(250, 247, 242, 0.75);
  margin-bottom: 8px;
}
.form-full-v2__form .form-field input,
.form-full-v2__form .form-field select,
.form-full-v2__form .form-field textarea {
  background: rgba(250, 247, 242, 0.06);
  border: 1px solid rgba(250, 247, 242, 0.2);
  color: #fff;
  border-radius: 2px;
  min-height: 52px;
  padding: 14px 16px;
  font-size: 1rem;
  transition: border-color var(--transition-base), background var(--transition-base);
}
.form-full-v2__form .form-field input::placeholder,
.form-full-v2__form .form-field textarea::placeholder { color: rgba(250, 247, 242, 0.45); }
.form-full-v2__form .form-field input:focus,
.form-full-v2__form .form-field select:focus,
.form-full-v2__form .form-field textarea:focus {
  border-color: var(--color-secondary);
  background: rgba(250, 247, 242, 0.1);
  outline: none;
}
.form-full-v2__form .form-field select option { color: var(--color-text); }
.form-full-v2__form .form-checkbox-group {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.form-full-v2__form .form-field--check {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(250, 247, 242, 0.06);
  border: 1px solid rgba(250, 247, 242, 0.2);
  padding: 8px 14px;
  border-radius: 100px;
  font-size: 0.875rem;
  color: rgba(250, 247, 242, 0.85);
  cursor: pointer;
  transition: all var(--transition-base);
  letter-spacing: 0;
  text-transform: none;
}
.form-full-v2__form .form-field--check:hover {
  background: rgba(250, 247, 242, 0.12);
  border-color: var(--color-secondary);
}
.form-full-v2__form .form-field--check input { margin: 0; }
.form-full-v2__form button[type=submit] {
  width: 100%;
  margin-top: 8px;
}
.form-full-v2__contact-line {
  font-size: 0.9375rem;
  color: rgba(250, 247, 242, 0.85);
  line-height: 1.55;
  margin: 0;
}
.form-full-v2__contact-line strong {
  color: var(--color-secondary);
  font-weight: 600;
  font-size: 1.0625rem;
  display: block;
  margin-top: 4px;
  letter-spacing: -0.01em;
}
@media (max-width: 991px) {
  .form-full-v2 { grid-template-columns: 1fr; }
  .form-full-v2__form .form-row-2 { grid-template-columns: 1fr; }
}

/* ---------- Section divider hairline (used between editorial sections) ---------- */
.section-rule-v2 {
  height: 1px;
  background: var(--color-border-strong);
  width: 100%;
  max-width: 80px;
  margin: 0;
}
.section-v2--soft + .section-v2--white,
.section-v2--white + .section-v2--soft {
  border-top: 1px solid var(--color-border);
}

/* ---------- Inline anchor tweak for editorial paragraphs ---------- */
.inline-anchor-v2 {
  display: flex; align-items: baseline; gap: 12px;
  margin-top: clamp(40px, 4vw, 64px);
  padding-top: 24px;
  border-top: 1px solid var(--color-border);
  font-size: 0.9375rem;
  color: var(--color-text-muted);
}
.inline-anchor-v2::before {
  content: "→";
  color: var(--color-secondary);
  font-weight: 700;
}
.inline-anchor-v2 a {
  color: var(--color-primary);
  text-decoration: underline;
  text-decoration-color: var(--color-secondary);
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.inline-anchor-v2 a:hover { color: var(--color-accent); }
.section-v2--ink .inline-anchor-v2 { border-top-color: rgba(250,247,242,0.15); color: rgba(250,247,242,0.7); }
.section-v2--ink .inline-anchor-v2 a { color: var(--color-secondary); text-decoration-color: var(--color-secondary); }

/* ============================================================
   INDEX v2.1 — Dynamic / Modern layer
   Adds mask-reveal, parallax, marquee hover-pause, sticky M3,
   underline-draw, CTA shimmer, big-day timeline, anti-fit ✕ rotate.
   All classes additive (-modern / vb-*-modern). No legacy override.
   ============================================================ */

/* ---------- A. Mask-reveal headline (clip-path bottom→top reveal) ---------- */
.vb-mask-reveal {
  display: inline-block;
  clip-path: inset(0 0 105% 0);
  transform: translateY(18px);
  transition: clip-path 1s cubic-bezier(.2,.8,.2,1), transform 1s cubic-bezier(.2,.8,.2,1);
  will-change: clip-path, transform;
}
.vb-mask-reveal.is-visible,
.is-visible .vb-mask-reveal,
.reveal.is-visible .vb-mask-reveal {
  clip-path: inset(0 0 0 0);
  transform: translateY(0);
}
.vb-mask-reveal--block { display: block; }
@media (prefers-reduced-motion: reduce) {
  .vb-mask-reveal { clip-path: none; transform: none; transition: none; }
}

/* ---------- B. Parallax host (driven by --py CSS var set by JS) ---------- */
.vb-parallax {
  --py: 0px;
  transform: translate3d(0, var(--py), 0) scale(1.06);
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .vb-parallax { transform: none; }
}

/* ---------- C. Hero count-up signal numbers + soft drift glow ---------- */
.hero-A-v2__signal { position: relative; overflow: hidden; }
.hero-A-v2__signal::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 70% 20%, rgba(212,165,116,0.18), transparent 60%);
  opacity: 0; transition: opacity .5s ease;
  pointer-events: none;
}
.hero-A-v2__signal:hover::after { opacity: 1; }
.hero-A-v2__signal-num [data-count-to] { display: inline-block; }

/* ---------- D. Hero scroll cue subtle bounce ---------- */
.hero-A-v2__scroll-cue::after {
  animation: vb-cue-bounce 2.4s ease-in-out infinite;
  display: inline-block;
}
@keyframes vb-cue-bounce {
  0%, 100% { transform: translateY(0); opacity: .55; }
  50%      { transform: translateY(6px); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-A-v2__scroll-cue::after { animation: none; }
}

/* ---------- E. Marquee — hover pause ---------- */
.hero-A-v2__marquee:hover .hero-A-v2__marquee-track,
.hero-A-v2__marquee:focus-within .hero-A-v2__marquee-track { animation-play-state: paused; }
.hero-A-v2__marquee::before,
.hero-A-v2__marquee::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 96px;
  pointer-events: none; z-index: 3;
}
.hero-A-v2__marquee::before { left: 0;  background: linear-gradient(90deg, rgba(15,31,30,.95), transparent); }
.hero-A-v2__marquee::after  { right: 0; background: linear-gradient(-90deg, rgba(15,31,30,.95), transparent); }

/* ---------- F. CTA shimmer + glow on hover ---------- */
.btn-cta--accent { position: relative; overflow: hidden; isolation: isolate; }
.btn-cta--accent::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.32) 50%, transparent 70%);
  transform: translateX(-110%);
  transition: transform .7s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
.btn-cta--accent:hover::before { transform: translateX(110%); }
.btn-cta--accent:hover {
  box-shadow: 0 14px 32px rgba(230,126,34,0.28), 0 0 0 1px rgba(212,165,116,.35);
}
.btn-cta--primary { position: relative; overflow: hidden; }
.btn-cta--primary::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 35%, rgba(212,165,116,.22) 50%, transparent 65%);
  transform: translateX(-110%);
  transition: transform .7s cubic-bezier(.2,.8,.2,1);
}
.btn-cta--primary:hover::before { transform: translateX(110%); }
.btn-cta--accent .bi, .btn-cta--primary .bi { transition: transform .25s ease; }
.btn-cta--accent:hover .bi, .btn-cta--primary:hover .bi { transform: translateX(3px); }

/* ---------- G. Underline-draw on inline anchors (replaces flat underline on hover) ---------- */
.inline-anchor-v2 a {
  position: relative; text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor),
                    linear-gradient(var(--color-secondary), var(--color-secondary));
  background-size: 0% 1px, 100% 1px;
  background-position: 0 100%, 0 100%;
  background-repeat: no-repeat;
  padding-bottom: 4px;
  transition: background-size .45s cubic-bezier(.2,.8,.2,1), color .25s ease;
}
.inline-anchor-v2 a:hover {
  background-size: 100% 1px, 100% 1px;
  text-decoration: none;
}
.section-v2--ink .inline-anchor-v2 a {
  background-image: linear-gradient(var(--color-secondary), var(--color-secondary)),
                    linear-gradient(rgba(212,165,116,.4), rgba(212,165,116,.4));
}

/* ---------- H. M3 process — sticky head + asymmetric featured glow ---------- */
/* Wrapper keeps existing 12-col process layout; only the header gets a soft sticky feel
   by becoming sticky inside the section while the long `ol` scrolls past. */
.vb-process-sticky-wrap { display: block; }
.vb-process-sticky-wrap > .section-head-v2 {
  position: sticky; top: 88px;
  z-index: 5;
  background: linear-gradient(180deg, var(--color-bg) 80%, rgba(255,255,255,0.0));
  padding-bottom: clamp(20px, 2vw, 32px);
}
@media (max-width: 991px) {
  .vb-process-sticky-wrap > .section-head-v2 { position: static; padding-bottom: 0; background: none; }
}
.process-v2__step--featured {
  background:
    radial-gradient(circle at 88% 12%, rgba(212,165,116,0.18), transparent 55%),
    var(--color-primary);
}
.process-v2__step::before {
  content: ""; position: absolute; left: 0; top: 0;
  width: 0; height: 2px;
  background: var(--color-secondary);
  transition: width .5s cubic-bezier(.2,.8,.2,1);
}
.process-v2__step:hover::before,
.process-v2__step--featured::before { width: 100%; }

/* ---------- I. Bento card accent border-on-hover ---------- */
.bento-card { isolation: isolate; }
.bento-card::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 0; height: 2px;
  background: var(--color-secondary);
  transition: width .5s cubic-bezier(.2,.8,.2,1);
}
.bento-card:hover::after { width: 100%; }
.bento-card--moq::after { background: var(--color-accent); }

/* MOQ list count-up styling tweak — number gets gentle pulse on enter */
.moq-list-v2 .moq-num-v2 {
  position: relative;
  display: inline-block;
}
.moq-list-v2 li {
  transition: padding .3s ease;
}
.moq-list-v2 li:hover { padding-left: 8px; }

/* ---------- J. Fabric card image hover with scale + tint, plus subtle gold corner ---------- */
.fabric-card-v2 { position: relative; isolation: isolate; }
.fabric-card-v2::before {
  content: ""; position: absolute; top: 0; right: 0;
  width: 28px; height: 28px;
  border-top: 2px solid var(--color-secondary);
  border-right: 2px solid var(--color-secondary);
  opacity: 0; transition: opacity .35s ease, transform .35s ease;
  transform: translate(-8px, 8px);
  z-index: 2;
}
.fabric-card-v2:hover::before { opacity: 1; transform: translate(0, 0); }
.fabric-card-v2__img img { transition: transform 1.2s cubic-bezier(.2,.8,.2,1), filter .6s ease; }
.fabric-card-v2:hover .fabric-card-v2__img img { filter: saturate(1.06) contrast(1.04); }

/* ---------- K. ICP card hover lift ---------- */
.card-icp-v2 {
  transition: background var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
  position: relative;
}
.card-icp-v2:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 48px rgba(26,26,26,0.06);
  background: var(--color-bg);
}
.card-icp-v2__link {
  display: inline-flex; align-items: center; gap: 8px;
  position: relative;
}
.card-icp-v2__link::after {
  content: "→"; transition: transform .3s ease;
}
.card-icp-v2:hover .card-icp-v2__link::after,
.card-icp-v2__link:hover::after { transform: translateX(6px); }

/* ---------- L. Anti-fit (M8) — N° rotate + ✕ pulse on item hover ---------- */
.anti-fit-v2__item {
  transition: padding-left var(--transition-base), border-color var(--transition-base);
  position: relative;
}
.anti-fit-v2__item::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 0; background: var(--color-secondary);
  transition: width .35s cubic-bezier(.2,.8,.2,1);
}
.anti-fit-v2__item:hover { padding-left: 24px; }
.anti-fit-v2__item:hover::before { width: 2px; }
.anti-fit-v2__num {
  display: inline-flex; align-items: center; gap: 10px;
  transition: transform .4s cubic-bezier(.2,.8,.2,1), letter-spacing .4s ease;
}
.anti-fit-v2__num::before {
  content: "✕";
  display: inline-block;
  color: var(--color-secondary);
  font-style: normal;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
.anti-fit-v2__item:hover .anti-fit-v2__num::before { transform: rotate(180deg) scale(1.15); }

/* ---------- M. M9 timeline — bigger serif day numbers + zigzag visual ---------- */
.vb-timeline-zigzag .timeline7-v2__step {
  position: relative;
  padding: clamp(24px, 2vw, 36px);
  border: 1px solid var(--color-border);
  background: var(--color-bg);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}
.vb-timeline-zigzag .timeline7-v2__step:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-border-strong);
}
.vb-timeline-zigzag .timeline7-v2__day {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(3rem, 5vw, 5rem);
  color: var(--color-secondary);
  line-height: .95;
  letter-spacing: -0.04em;
  display: inline-block;
  margin-bottom: 8px;
}
.vb-timeline-zigzag .timeline7-v2__step:nth-child(odd) { transform: translateY(0); }
.vb-timeline-zigzag .timeline7-v2__step:nth-child(even) { transform: translateY(48px); }
@media (hover: hover) {
  .vb-timeline-zigzag .timeline7-v2__step:hover { transform: translateY(-4px); }
  .vb-timeline-zigzag .timeline7-v2__step:nth-child(even):hover { transform: translateY(44px); }
}
@media (max-width: 991px) {
  .vb-timeline-zigzag .timeline7-v2__step:nth-child(even) { transform: translateY(0); }
}

/* ---------- N. Entry wall hover — diagonal arrow ascend + gold corner ---------- */
.card-entry-v2 { position: relative; overflow: hidden; }
.card-entry-v2::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 100%; height: 2px;
  background: var(--color-secondary);
  transform: scaleX(0); transform-origin: left;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
.card-entry-v2:hover::before { transform: scaleX(1); }
.card-entry-v2__arrow {
  display: inline-block;
  transition: transform .35s cubic-bezier(.2,.8,.2,1);
}
.card-entry-v2:hover .card-entry-v2__arrow {
  transform: translate(4px, -4px) rotate(-6deg);
}

/* ---------- O. Form field floating-label feel ---------- */
.form-full-v2__form .form-field input:not([type=file]),
.form-full-v2__form .form-field select,
.form-full-v2__form .form-field textarea {
  transition: border-color var(--transition-base), background var(--transition-base), box-shadow var(--transition-base);
}
.form-full-v2__form .form-field input:focus,
.form-full-v2__form .form-field select:focus,
.form-full-v2__form .form-field textarea:focus {
  box-shadow: 0 0 0 3px rgba(212,165,116,0.15);
}

/* ---------- P. Section editorial number watermark (decorative) ---------- */
.section-v2 { position: relative; }
.section-v2[data-section-num]::before {
  content: attr(data-section-num);
  position: absolute;
  top: clamp(48px, 6vw, 96px);
  right: clamp(16px, 3vw, 56px);
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(8rem, 16vw, 18rem);
  line-height: 0.8;
  color: var(--color-primary);
  opacity: 0.04;
  pointer-events: none;
  letter-spacing: -0.06em;
  z-index: 0;
}
.section-v2[data-section-num] .container-yv { position: relative; z-index: 1; }
.section-v2--ink[data-section-num]::before { color: var(--color-secondary); opacity: 0.06; }
@media (max-width: 767px) {
  .section-v2[data-section-num]::before { font-size: 7rem; right: 8px; }
}

/* ---------- Q. Section transition divider — short hairline + accent dot ---------- */
.section-rule-accent {
  display: flex; align-items: center; gap: 12px;
  margin: 0 0 clamp(24px, 3vw, 40px);
}
.section-rule-accent::before {
  content: ""; width: 48px; height: 1px;
  background: var(--color-secondary);
}
.section-rule-accent::after {
  content: ""; width: 6px; height: 6px;
  background: var(--color-secondary);
  border-radius: 50%;
}

/* ---------- R. Reveal-stagger child entry fine-tune (slightly nicer easing) ---------- */
.reveal-stagger > * {
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}

/* ============================================================
   v3 CORPORATE B2B (Behance-style, content-rich, NOT minimalist)
   index-only namespaced classes: vb-*-corp / vb-stats-strip /
   vb-spec-table / vb-industry-cards / vb-faq-accordion / etc.
   These are ADDITIVE — they do not override any existing v2 class
   that the other 31 pages depend on.
   ============================================================ */

/* ---- Corporate type vars (scoped to .corp-root) ---- */
.corp-root {
  --corp-sans: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --corp-shadow-1: 0 1px 2px rgba(15,23,42,0.04), 0 4px 12px rgba(15,23,42,0.05), 0 16px 32px rgba(15,23,42,0.06);
  --corp-shadow-2: 0 1px 2px rgba(15,23,42,0.06), 0 8px 24px rgba(15,23,42,0.08), 0 24px 56px rgba(15,23,42,0.10);
  --corp-border: 1px solid rgba(15,23,42,0.08);
  --corp-border-strong: 1px solid rgba(15,23,42,0.14);
  --corp-radius: 10px;
  --corp-radius-sm: 6px;
  --corp-bg-tint: #F4F1EC;
  --corp-bg-card: #FFFFFF;
  --corp-text-mute: #5b6473;
  font-family: var(--corp-sans);
}
.corp-root h1, .corp-root h2, .corp-root h3, .corp-root h4 {
  font-family: var(--corp-sans);
  font-style: normal;
  letter-spacing: -0.02em;
}
.corp-root em {
  font-style: normal;
  color: var(--color-primary);
  font-weight: 700;
}

/* ---- Section base for corp ---- */
.section-corp {
  position: relative;
  padding: clamp(56px, 7vw, 88px) 0;
}
.section-corp--tint  { background: var(--corp-bg-tint); }
.section-corp--white { background: #FFFFFF; }
.section-corp--ink   { background: #0F1F1E; color: var(--color-text-on-dark); }
.section-corp--ink h2,
.section-corp--ink h3,
.section-corp--ink p { color: var(--color-text-on-dark); }
.section-corp--ink em { color: var(--color-secondary); }

/* ---- Eyebrow + section head ---- */
.vb-corp-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: clamp(28px, 4vw, 48px);
  position: relative;
  z-index: 1;
}
.vb-corp-head__rail {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--color-primary);
}
.vb-corp-head__rail::before {
  content: ""; width: 28px; height: 2px;
  background: var(--color-primary);
}
.section-corp--ink .vb-corp-head__rail { color: var(--color-secondary); }
.section-corp--ink .vb-corp-head__rail::before { background: var(--color-secondary); }
.vb-corp-head__title {
  font-size: clamp(1.6rem, 2.4vw + 0.6rem, 2.5rem);
  font-weight: 700;
  line-height: 1.18;
  margin: 0;
  max-width: 980px;
}
.vb-corp-head__intro {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--corp-text-mute);
  margin: 0;
  max-width: 880px;
}
.section-corp--ink .vb-corp-head__intro { color: rgba(250,247,242,0.78); }

/* ---- M1 corporate hero — left text + right bento mock grid ---- */
.vb-hero-corp {
  position: relative;
  background: linear-gradient(180deg, #FAF7F2 0%, #FFFFFF 100%);
  padding: clamp(48px, 6vw, 80px) 0 clamp(32px, 4vw, 56px);
  overflow: hidden;
}
.vb-hero-corp::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(circle at 88% 12%, rgba(44,95,93,0.08), transparent 38%),
    radial-gradient(circle at 4% 92%, rgba(212,165,116,0.10), transparent 35%);
  pointer-events: none;
}
.vb-hero-corp__grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
  position: relative;
  z-index: 1;
}
@media (max-width: 991px) { .vb-hero-corp__grid { grid-template-columns: 1fr; } }
.vb-hero-corp__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px;
  border: var(--corp-border-strong);
  border-radius: 999px;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  font-weight: 600; color: var(--color-primary);
  background: #fff;
}
.vb-hero-corp__eyebrow::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 0 4px rgba(230,126,34,0.18);
}
.vb-hero-corp__h1 {
  font-size: clamp(2rem, 3.2vw + 0.6rem, 3.4rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 18px 0 14px;
  color: #1A1A1A;
}
.vb-hero-corp__h1 em {
  color: var(--color-primary);
  font-weight: 800;
}
.vb-hero-corp__sub {
  font-size: 1.0625rem;
  color: var(--corp-text-mute);
  line-height: 1.65;
  margin: 0 0 24px;
  max-width: 560px;
}
.vb-hero-corp__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 28px; }

.vb-hero-corp__bento {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(6, 56px);
  gap: 10px;
}
@media (max-width: 575px) {
  .vb-hero-corp__bento { grid-template-rows: repeat(6, 44px); }
}
.vb-hero-corp__tile {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  border: var(--corp-border);
  /* Fallback gradient if img fails to load — keeps tile visually present */
  background: linear-gradient(135deg, #3F4F3A 0%, #2A332A 60%, #1A1A1A 100%);
  box-shadow: var(--corp-shadow-1);
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
}
.vb-hero-corp__tile--b { background: linear-gradient(135deg, #C7A578 0%, #A0825C 100%); }
.vb-hero-corp__tile--c { background: linear-gradient(135deg, #D08A4E 0%, #A06030 100%); }
.vb-hero-corp__tile--d { background: linear-gradient(135deg, #3F4F3A 0%, #5A6F50 100%); }
.vb-hero-corp__tile--e { background: linear-gradient(135deg, #F5EBE0 0%, #DCBE99 100%); }
.vb-hero-corp__tile--f { background: linear-gradient(135deg, #2A332A 0%, #0F1F1E 100%); }
.vb-hero-corp__tile img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
/* Hide broken-image alt-text overlay; gradient fallback shows through */
.vb-hero-corp__tile img:not([src]),
.vb-hero-corp__tile img[src=""],
.vb-hero-corp__tile img.is-broken { opacity: 0; }
.vb-hero-corp__tile:hover { box-shadow: var(--corp-shadow-2); transform: translateY(-2px); }
.vb-hero-corp__tile:hover img { transform: scale(1.06); }
.vb-hero-corp__tile--a { grid-column: 1 / span 4; grid-row: 1 / span 4; }
.vb-hero-corp__tile--b { grid-column: 5 / span 2; grid-row: 1 / span 2; }
.vb-hero-corp__tile--c { grid-column: 5 / span 2; grid-row: 3 / span 2; }
.vb-hero-corp__tile--d { grid-column: 1 / span 2; grid-row: 5 / span 2; }
.vb-hero-corp__tile--e { grid-column: 3 / span 2; grid-row: 5 / span 2; }
.vb-hero-corp__tile--f { grid-column: 5 / span 2; grid-row: 5 / span 2; }
.vb-hero-corp__tile-meta {
  position: absolute; left: 10px; bottom: 8px;
  background: rgba(15,31,30,0.78);
  color: #FFF; font-size: 10px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 8px; border-radius: 4px;
  backdrop-filter: blur(2px);
}

/* ---- vb-stats-strip-corp (hero bottom + standalone M11) ---- */
.vb-stats-strip-corp {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  overflow: hidden;
  margin-top: clamp(24px, 3vw, 36px);
}
.vb-stats-strip-corp--8 { grid-template-columns: repeat(8, 1fr); }
@media (max-width: 991px) {
  .vb-stats-strip-corp,
  .vb-stats-strip-corp--8 { grid-template-columns: repeat(2, 1fr); }
}
.vb-stats-strip-corp__cell {
  padding: 18px 16px;
  border-right: var(--corp-border);
  display: flex; flex-direction: column; gap: 4px;
}
.vb-stats-strip-corp__cell:last-child { border-right: none; }
@media (max-width: 991px) {
  .vb-stats-strip-corp__cell { border-right: var(--corp-border); border-bottom: var(--corp-border); }
  .vb-stats-strip-corp__cell:nth-child(2n) { border-right: none; }
}
.vb-stats-strip-corp__num {
  font-size: clamp(1.6rem, 2vw + 0.4rem, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0F1F1E;
  line-height: 1;
}
.vb-stats-strip-corp__num em { color: var(--color-accent); font-weight: 800; }
.vb-stats-strip-corp__label {
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--corp-text-mute); font-weight: 600;
}
.vb-stats-strip-corp__bar {
  height: 3px; background: rgba(44,95,93,0.10); border-radius: 999px;
  overflow: hidden; margin-top: 6px;
}
.vb-stats-strip-corp__bar-fill {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
  border-radius: 999px;
  transform-origin: left center;
  animation: corp-bar-fill 1.4s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes corp-bar-fill { from { transform: scaleX(0); } to { transform: scaleX(var(--fill, 0.6)); } }

/* ---- M1.5 capability grid corp ---- */
.vb-capability-grid-corp {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 991px) { .vb-capability-grid-corp { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .vb-capability-grid-corp { grid-template-columns: 1fr; } }
.vb-capability-card-corp {
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  padding: 22px 22px 20px;
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  position: relative;
}
.vb-capability-card-corp:hover {
  transform: translateY(-4px);
  box-shadow: var(--corp-shadow-2);
  border-color: rgba(44,95,93,0.22);
}
.vb-capability-card-corp__icon {
  width: 40px; height: 40px;
  border-radius: 8px;
  background: rgba(44,95,93,0.08);
  color: var(--color-primary);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 20px; margin-bottom: 12px;
}
.vb-capability-card-corp__title {
  font-size: 1.0625rem; font-weight: 700; margin: 0 0 6px;
  color: #0F1F1E;
}
.vb-capability-card-corp__desc {
  font-size: 0.9375rem; line-height: 1.6; color: var(--corp-text-mute); margin: 0 0 10px;
}
.vb-capability-card-corp__bullets {
  list-style: none; padding: 0; margin: 0;
  font-size: 0.875rem; color: var(--corp-text-mute);
}
.vb-capability-card-corp__bullets li {
  position: relative; padding-left: 16px; margin-top: 4px;
}
.vb-capability-card-corp__bullets li::before {
  content: ""; position: absolute; left: 0; top: 9px;
  width: 6px; height: 2px; background: var(--color-secondary);
}
.vb-capability-card-corp__metric {
  position: absolute;
  top: 18px;
  right: 22px;
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--color-secondary);
  letter-spacing: -0.02em;
  line-height: 1;
}

/* ---- M2 Insight 50/50 image-text ---- */
.vb-insight-corp {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 4vw, 48px);
  align-items: stretch;
}
@media (max-width: 991px) { .vb-insight-corp { grid-template-columns: 1fr; } }
.vb-insight-corp__media {
  border-radius: var(--corp-radius);
  overflow: hidden;
  border: var(--corp-border);
  box-shadow: var(--corp-shadow-1);
  position: relative;
  min-height: 320px;
  background: #eee;
}
.vb-insight-corp__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.vb-insight-corp__media:hover img { transform: scale(1.04); }
.vb-insight-corp__body h3 {
  font-size: 1.25rem; font-weight: 700;
  margin: 16px 0 8px; color: #0F1F1E;
}
.vb-insight-corp__body p {
  font-size: 1rem; line-height: 1.7; color: var(--corp-text-mute); margin: 0 0 12px;
}
.vb-insight-corp__bullets {
  list-style: none; padding: 0; margin: 12px 0 16px;
}
.vb-insight-corp__bullets li {
  position: relative; padding: 6px 0 6px 28px;
  font-size: 0.9375rem; color: #0F1F1E;
  border-bottom: 1px dashed rgba(15,23,42,0.10);
}
.vb-insight-corp__bullets li::before {
  content: "→"; position: absolute; left: 0; top: 5px;
  color: var(--color-primary); font-weight: 700;
}
.vb-insight-corp__callout {
  background: var(--color-primary);
  color: var(--color-text-on-dark);
  padding: clamp(20px, 2vw, 28px) clamp(20px, 2.5vw, 32px);
  border-radius: var(--corp-radius-sm);
  margin-top: clamp(20px, 3vw, 28px);
  display: grid;
  grid-template-columns: minmax(72px, 96px) 1fr;
  gap: clamp(16px, 2vw, 24px);
  align-items: center;
}
.vb-insight-corp__callout strong { color: #FFFFFF; display: block; margin-bottom: 6px; font-size: 1rem; line-height: 1.4; }
.vb-insight-corp__callout-body p { margin: 0; font-size: 0.9375rem; line-height: 1.55; color: var(--color-text-on-dark); }
.vb-insight-corp__callout-num {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: clamp(2.5rem, 4vw, 3.25rem);
  font-weight: 800;
  color: var(--color-secondary);
  line-height: 0.95;
  letter-spacing: -0.02em;
  display: block;
  margin: 0;
}

/* ---- vb-spec-table-corp (M3 process / M5 fabric) ---- */
.vb-spec-table-corp {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  overflow: hidden;
  box-shadow: var(--corp-shadow-1);
  font-size: 0.9375rem;
}
.vb-spec-table-corp thead th {
  background: #0F1F1E;
  color: #FAF7F2;
  text-align: left;
  padding: 14px 16px;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  font-weight: 600;
}
.vb-spec-table-corp tbody td {
  padding: 14px 16px;
  border-top: var(--corp-border);
  vertical-align: top;
  line-height: 1.55;
}
.vb-spec-table-corp tbody tr:nth-child(even) { background: rgba(244,241,236,0.5); }
.vb-spec-table-corp tbody tr:hover { background: rgba(44,95,93,0.05); }
.vb-spec-table-corp__step {
  font-weight: 800;
  color: var(--color-primary);
  font-feature-settings: "tnum";
  letter-spacing: -0.01em;
}
.vb-spec-table-corp__name { font-weight: 700; color: #0F1F1E; }
.vb-spec-table-corp__tag {
  display: inline-block;
  background: rgba(44,95,93,0.08);
  color: var(--color-primary);
  border: 1px solid rgba(44,95,93,0.14);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  margin-right: 4px;
}
@media (max-width: 767px) {
  .vb-spec-table-corp thead { display: none; }
  .vb-spec-table-corp tbody td { display: block; padding: 8px 14px; border-top: none; }
  .vb-spec-table-corp tbody tr { display: block; border-top: var(--corp-border); padding: 12px 0; }
}

/* ---- M4 MOQ comparison matrix ---- */
.vb-compare-corp {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--corp-shadow-1);
}
.vb-compare-corp__cell {
  padding: 14px 16px;
  border-bottom: var(--corp-border);
  border-right: var(--corp-border);
  font-size: 0.9375rem;
  line-height: 1.55;
}
.vb-compare-corp__cell:nth-child(3n) { border-right: none; }
.vb-compare-corp__cell--head {
  background: #0F1F1E;
  color: #FAF7F2;
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600;
  padding: 14px 16px;
}
.vb-compare-corp__cell--us { background: rgba(44,95,93,0.06); font-weight: 700; }
.vb-compare-corp__check { color: var(--color-primary); font-weight: 800; }
.vb-compare-corp__cross  { color: #b0464d; font-weight: 800; }

/* ---- vb-product-card-corp (M4 MOQ examples) ---- */
.vb-product-card-corp {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 0;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  transition: transform .3s ease, box-shadow .3s ease;
}
.vb-product-card-corp:hover { transform: translateY(-3px); box-shadow: var(--corp-shadow-2); }
.vb-product-card-corp__img {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #f4f1ec;
}
.vb-product-card-corp__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.vb-product-card-corp:hover .vb-product-card-corp__img img { transform: scale(1.05); }
.vb-product-card-corp__badge {
  position: absolute; top: 12px; left: 12px;
  background: var(--color-accent); color: #fff;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 5px 10px; border-radius: 4px;
}
.vb-product-card-corp__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 6px; }
.vb-product-card-corp__title { font-size: 1rem; font-weight: 700; margin: 0; color: #0F1F1E; }
.vb-product-card-corp__spec  { font-size: 0.875rem; color: var(--corp-text-mute); margin: 0; }
.vb-product-card-corp__moq {
  margin-top: 8px;
  display: flex; align-items: baseline; gap: 6px;
  font-size: 1.5rem; font-weight: 800; color: var(--color-primary);
}
.vb-product-card-corp__moq small { font-size: 12px; font-weight: 600; color: var(--corp-text-mute); letter-spacing: 0.08em; text-transform: uppercase; }

/* ---- vb-fabric-spec-grid-corp (M5 swatch cards w/ capability bars) ---- */
.vb-fabric-spec-grid-corp {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}
@media (max-width: 767px) { .vb-fabric-spec-grid-corp { grid-template-columns: 1fr; } }
.vb-fabric-spec-card-corp {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 16px;
  padding: 16px;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  transition: transform .3s ease, box-shadow .3s ease;
}
.vb-fabric-spec-card-corp:hover { transform: translateY(-2px); box-shadow: var(--corp-shadow-2); }
.vb-fabric-spec-card-corp__swatch {
  border-radius: var(--corp-radius-sm);
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #eee;
}
.vb-fabric-spec-card-corp__swatch img { width: 100%; height: 100%; object-fit: cover; }
.vb-fabric-spec-card-corp__title { font-size: 1rem; font-weight: 700; margin: 0 0 4px; color: #0F1F1E; }
.vb-fabric-spec-card-corp__tags { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 10px; }
.vb-fabric-spec-card-corp__bar  {
  display: grid; grid-template-columns: 100px 1fr 36px;
  gap: 8px; align-items: center; margin-bottom: 4px;
  font-size: 12px;
}
.vb-fabric-spec-card-corp__bar-label { color: var(--corp-text-mute); }
.vb-fabric-spec-card-corp__bar-track {
  height: 6px; background: rgba(44,95,93,0.10);
  border-radius: 999px; overflow: hidden;
}
.vb-fabric-spec-card-corp__bar-fill {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
  border-radius: 999px;
  transform-origin: left;
  animation: corp-bar-fill 1.4s cubic-bezier(.2,.8,.2,1) forwards;
}
.vb-fabric-spec-card-corp__bar-pct { font-weight: 700; color: var(--color-primary); text-align: right; }

/* ---- M6 industry solution cards (8 use cases) ---- */
.vb-industry-cards-corp {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
@media (max-width: 1199px) { .vb-industry-cards-corp { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px)  { .vb-industry-cards-corp { grid-template-columns: 1fr; } }
.vb-industry-card-corp {
  display: flex; flex-direction: column;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  background: #fff;
  overflow: hidden;
  box-shadow: var(--corp-shadow-1);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.vb-industry-card-corp:hover {
  transform: translateY(-4px);
  box-shadow: var(--corp-shadow-2);
  border-color: rgba(44,95,93,0.22);
}
.vb-industry-card-corp__media { aspect-ratio: 16 / 10; overflow: hidden; background: #f4f1ec; }
.vb-industry-card-corp__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.vb-industry-card-corp:hover .vb-industry-card-corp__media img { transform: scale(1.06); }
.vb-industry-card-corp__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; }
.vb-industry-card-corp__tag {
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-primary); font-weight: 700;
}
.vb-industry-card-corp__title { font-size: 1.0625rem; font-weight: 700; margin: 0; color: #0F1F1E; line-height: 1.3; }
.vb-industry-card-corp__section-label {
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--corp-text-mute); font-weight: 600; margin-top: 4px;
}
.vb-industry-card-corp__list {
  list-style: none; padding: 0; margin: 0; font-size: 0.8125rem; line-height: 1.5;
}
.vb-industry-card-corp__list li { position: relative; padding-left: 14px; padding-top: 3px; padding-bottom: 3px; color: #0F1F1E; }
.vb-industry-card-corp__list li::before { content: ""; position: absolute; left: 0; top: 12px; width: 6px; height: 1px; background: var(--color-secondary); }
.vb-industry-card-corp__cta {
  margin-top: auto;
  padding-top: 12px;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-primary);
  display: inline-flex; align-items: center; gap: 6px;
  border-top: var(--corp-border);
}
.vb-industry-card-corp__cta::after {
  content: "→"; transition: transform .3s ease;
}
.vb-industry-card-corp:hover .vb-industry-card-corp__cta::after { transform: translateX(4px); }

/* ---- M7 decoration matrix (8 techniques as feature icon grid) ---- */
.vb-decoration-grid-corp {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 991px) { .vb-decoration-grid-corp { grid-template-columns: repeat(2, 1fr); } }
.vb-decoration-card-corp {
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  padding: 0 0 18px;
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.vb-decoration-card-corp__media {
  margin: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #F4F1EC;
  border-bottom: var(--corp-border);
}
.vb-decoration-card-corp__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}
.vb-decoration-card-corp:hover .vb-decoration-card-corp__media img {
  transform: scale(1.04);
}
.vb-decoration-card-corp__icon,
.vb-decoration-card-corp__name,
.vb-decoration-card-corp__detail {
  margin-left: 16px;
  margin-right: 16px;
}
.vb-decoration-card-corp__icon {
  margin-top: 14px;
}
.vb-decoration-card-corp__use {
  margin-left: 16px;
  margin-right: 16px;
  margin-top: auto;
}
.vb-decoration-card-corp::after {
  content: ""; position: absolute; right: -20px; top: -20px;
  width: 60px; height: 60px;
  background: radial-gradient(circle, rgba(212,165,116,0.18), transparent 70%);
  pointer-events: none;
}
.vb-decoration-card-corp:hover {
  transform: translateY(-3px);
  box-shadow: var(--corp-shadow-2);
  border-color: rgba(44,95,93,0.22);
}
.vb-decoration-card-corp__icon {
  width: 36px; height: 36px;
  background: rgba(44,95,93,0.08);
  color: var(--color-primary);
  border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 17px; margin-bottom: 10px;
}
.vb-decoration-card-corp__name {
  font-size: 0.9375rem; font-weight: 700; margin: 0 0 4px; color: #0F1F1E;
}
.vb-decoration-card-corp__detail { font-size: 0.8125rem; color: var(--corp-text-mute); line-height: 1.55; margin: 0 0 8px; }
.vb-decoration-card-corp__use {
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--color-primary); font-weight: 700;
  border-top: var(--corp-border); padding-top: 8px; display: block;
}

/* ---- M8 eligibility filter (out-of-scope corporate disclosure) ---- */
.vb-eligibility-corp {
  background: rgba(230,126,34,0.04);
  border-radius: 0 var(--corp-radius) var(--corp-radius) 0;
  padding: 22px 24px;
}
.vb-eligibility-corp__head {
  display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
}
.vb-eligibility-corp__icon {
  width: 26px; height: 26px; border-radius: 6px;
  background: var(--color-accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 800;
}
.vb-eligibility-corp__title { font-weight: 700; color: #0F1F1E; margin: 0; font-size: 1rem; }
.vb-eligibility-corp__list { list-style: none; padding: 0; margin: 0; }
.vb-eligibility-corp__list li {
  position: relative; padding: 10px 0 10px 28px;
  font-size: 0.9375rem; line-height: 1.6; color: #0F1F1E;
  border-top: 1px dashed rgba(15,23,42,0.10);
}
.vb-eligibility-corp__list li:first-child { border-top: none; }
.vb-eligibility-corp__list li::before {
  content: "✕"; position: absolute; left: 0; top: 12px;
  color: var(--color-accent); font-weight: 800;
}
.vb-eligibility-corp__list li strong { color: var(--color-primary); }

/* ---- M9 sampling workflow horizontal step cards ---- */
.vb-workflow-corp {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  position: relative;
}
.vb-workflow-corp::before {
  content: ""; position: absolute;
  left: 0; right: 0; top: 32px;
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
  z-index: 0;
}
@media (max-width: 991px) {
  .vb-workflow-corp { grid-template-columns: repeat(2, 1fr); }
  .vb-workflow-corp::before { display: none; }
}
.vb-workflow-corp__step {
  position: relative;
  background: #fff;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  padding: 14px 12px;
  box-shadow: var(--corp-shadow-1);
  z-index: 1;
  transition: transform .3s ease, box-shadow .3s ease;
}
.vb-workflow-corp__step:hover { transform: translateY(-3px); box-shadow: var(--corp-shadow-2); }
.vb-workflow-corp__day {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-primary); color: #fff;
  font-weight: 800; font-size: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-bottom: 10px;
  box-shadow: 0 0 0 4px rgba(44,95,93,0.12);
}
.vb-workflow-corp__title { font-size: 0.875rem; font-weight: 700; margin: 0 0 4px; color: #0F1F1E; line-height: 1.3; }
.vb-workflow-corp__desc  { font-size: 0.8125rem; color: var(--corp-text-mute); margin: 0; line-height: 1.5; }
.vb-workflow-corp__dur {
  display: inline-block; margin-top: 8px;
  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  background: rgba(44,95,93,0.08); color: var(--color-primary);
  padding: 2px 6px; border-radius: 4px; font-weight: 700;
}

/* ---- M10 entry cards corporate (icon + title + 2-line desc grid) ---- */
.vb-entry-cards-corp {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 991px) { .vb-entry-cards-corp { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .vb-entry-cards-corp { grid-template-columns: 1fr; } }
.vb-entry-card-corp {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 16px;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  text-decoration: none;
  color: inherit;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.vb-entry-card-corp:hover {
  transform: translateY(-3px);
  box-shadow: var(--corp-shadow-2);
  border-color: rgba(44,95,93,0.22);
  text-decoration: none;
}
.vb-entry-card-corp__icon {
  flex-shrink: 0;
  width: 40px; height: 40px; border-radius: 8px;
  background: rgba(44,95,93,0.08);
  color: var(--color-primary);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 19px;
}
.vb-entry-card-corp__title {
  font-size: 0.9375rem; font-weight: 700; margin: 0 0 4px; color: #0F1F1E;
  text-transform: capitalize;
}
.vb-entry-card-corp__desc { font-size: 0.8125rem; color: var(--corp-text-mute); margin: 0; line-height: 1.5; }

/* ---- M10B form corporate floating-label two-col ---- */
.vb-form-corp {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: clamp(24px, 4vw, 56px);
}
@media (max-width: 991px) { .vb-form-corp { grid-template-columns: 1fr; } }
.vb-form-corp__aside {
  background: #0F1F1E; color: #FAF7F2;
  padding: clamp(24px, 3vw, 36px);
  border-radius: var(--corp-radius);
}
.vb-form-corp__aside h2 { color: #fff; font-size: clamp(1.4rem, 2vw, 1.8rem); margin: 12px 0 14px; line-height: 1.2; }
.vb-form-corp__aside h2 em { color: var(--color-secondary); }
.vb-form-corp__aside h3 { color: #fff; font-size: 0.875rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; margin: 18px 0 8px; }
.vb-form-corp__aside p, .vb-form-corp__aside li {
  color: rgba(250,247,242,0.78); font-size: 0.9375rem; line-height: 1.6;
}
.vb-form-corp__aside ul { list-style: none; padding: 0; margin: 0; }
.vb-form-corp__aside ul li {
  position: relative; padding: 5px 0 5px 18px;
}
.vb-form-corp__aside ul li::before {
  content: ""; position: absolute; left: 0; top: 13px;
  width: 8px; height: 1px; background: var(--color-secondary);
}
.vb-form-corp__aside hr {
  border: none; border-top: 1px solid rgba(250,247,242,0.12); margin: 16px 0;
}
.vb-form-corp__panel {
  background: #fff;
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  padding: clamp(20px, 3vw, 32px);
  box-shadow: var(--corp-shadow-1);
}
.vb-form-corp__panel .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 575px) { .vb-form-corp__panel .form-row-2 { grid-template-columns: 1fr; } }
.vb-form-corp__panel .form-field { margin-bottom: 14px; position: relative; }
.vb-form-corp__panel .form-field label {
  display: block; font-size: 12px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--corp-text-mute); margin-bottom: 6px;
}
.vb-form-corp__panel .form-field input[type=text],
.vb-form-corp__panel .form-field input[type=email],
.vb-form-corp__panel .form-field input[type=tel],
.vb-form-corp__panel .form-field input[type=file],
.vb-form-corp__panel .form-field select,
.vb-form-corp__panel .form-field textarea {
  width: 100%;
  padding: 12px 14px;
  border: var(--corp-border-strong);
  border-radius: var(--corp-radius-sm);
  font-family: inherit;
  font-size: 0.9375rem;
  background: #FAF7F2;
  color: #0F1F1E;
  transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.vb-form-corp__panel .form-field input:focus,
.vb-form-corp__panel .form-field select:focus,
.vb-form-corp__panel .form-field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(44,95,93,0.10);
}
.vb-form-corp__panel .form-checkbox-group {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.vb-form-corp__panel .form-field--check {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 10px;
  border: var(--corp-border);
  border-radius: 999px;
  font-size: 0.8125rem; cursor: pointer;
  transition: border-color .25s ease, background .25s ease;
}
.vb-form-corp__panel .form-field--check:hover { border-color: var(--color-primary); background: rgba(44,95,93,0.04); }
.vb-form-corp__panel .form-field--check input { margin: 0; accent-color: var(--color-primary); }
.vb-form-corp__panel .honeypot { position: absolute; left: -9999px; top: -9999px; }

/* ---- M12 FAQ accordion ---- */
.vb-faq-accordion-corp { display: grid; grid-template-columns: 1fr; gap: 8px; }
.vb-faq-item-corp {
  border: var(--corp-border);
  border-radius: var(--corp-radius);
  background: #fff;
  box-shadow: var(--corp-shadow-1);
  overflow: hidden;
  transition: border-color .3s ease;
}
.vb-faq-item-corp[open] { border-color: rgba(44,95,93,0.22); }
.vb-faq-item-corp summary {
  list-style: none;
  padding: 16px 20px;
  cursor: pointer;
  font-weight: 700; font-size: 1rem;
  color: #0F1F1E;
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.vb-faq-item-corp summary::-webkit-details-marker { display: none; }
.vb-faq-item-corp summary::after {
  content: "+"; font-size: 22px; font-weight: 400;
  color: var(--color-primary);
  transition: transform .3s ease;
  line-height: 1;
}
.vb-faq-item-corp[open] summary::after { content: "−"; transform: rotate(180deg); }
.vb-faq-item-corp__body {
  padding: 0 20px 18px;
  font-size: 0.9375rem;
  color: var(--corp-text-mute);
  line-height: 1.7;
}
.vb-faq-item-corp__body p { margin: 0 0 8px; }
.vb-faq-item-corp__body p:last-child { margin: 0; }

/* ---- v3 corp btn variants (additive — don't override existing .btn-cta--*) ---- */
.btn-corp {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 22px;
  border-radius: var(--corp-radius-sm);
  font-weight: 700; font-size: 0.9375rem;
  letter-spacing: 0.01em;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid transparent;
}
.btn-corp--primary {
  background: var(--color-primary); color: #fff;
  box-shadow: 0 6px 18px rgba(44,95,93,0.25);
}
.btn-corp--primary:hover { background: var(--color-primary-dark); transform: translateY(-1px); color: #fff; box-shadow: 0 10px 22px rgba(44,95,93,0.30); }
.btn-corp--accent  { background: var(--color-accent); color: #fff; box-shadow: 0 6px 18px rgba(230,126,34,0.25); }
.btn-corp--accent:hover { background: var(--color-accent-dark); transform: translateY(-1px); color: #fff; }
.btn-corp--ghost {
  background: transparent; color: var(--color-primary);
  border: 1px solid rgba(44,95,93,0.30);
}
.btn-corp--ghost:hover { background: rgba(44,95,93,0.06); border-color: var(--color-primary); color: var(--color-primary); }
.btn-corp--block { width: 100%; justify-content: center; }
.btn-corp::after { content: "→"; transition: transform .3s ease; }
.btn-corp:hover::after { transform: translateX(3px); }
.btn-corp.no-arrow::after { display: none; }

/* ---- corp utility: container, divider, meta-rail ---- */
.corp-meta-rail {
  display: flex; flex-wrap: wrap; gap: 16px;
  align-items: center;
  font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--corp-text-mute); font-weight: 600;
  padding: 14px 0;
  border-top: var(--corp-border);
  border-bottom: var(--corp-border);
}
.corp-meta-rail__sep { width: 1px; height: 12px; background: rgba(15,23,42,0.18); }

/* ---- corp reveal stagger compatibility (work with global-animations) ---- */
.corp-root .reveal,
.corp-root .reveal-stagger > * {
  will-change: opacity, transform;
}


/* ============================================================
   v3.2 — Section bg rhythm (break the cream/white monotony)
   Index-only modifiers (no other-page collision).
   ============================================================ */

/* DARK band: deep olive over light section */
.vb-capability-grid-corp--dark,
.vb-spec-table-corp--dark,
.vb-workflow-corp--dark {
  background: linear-gradient(180deg, var(--color-primary-dark) 0%, var(--color-primary) 100%);
  color: var(--color-text-on-dark);
}
.vb-capability-grid-corp--dark .vb-capability-card-corp,
.vb-spec-table-corp--dark .vb-spec-table-corp,
.vb-workflow-corp--dark .vb-workflow-corp__step {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  color: var(--color-text-on-dark);
}
.vb-capability-grid-corp--dark .vb-capability-card-corp__title,
.vb-capability-grid-corp--dark h2,
.vb-capability-grid-corp--dark h3,
.vb-spec-table-corp--dark h2,
.vb-spec-table-corp--dark h3,
.vb-workflow-corp--dark h2,
.vb-workflow-corp--dark h3 {
  color: var(--color-text-on-dark);
}
.vb-spec-table-corp--dark thead th {
  background: rgba(255,255,255,0.06);
  color: var(--color-secondary);
  border-bottom-color: rgba(199,165,120,0.4);
}
.vb-spec-table-corp--dark tbody td {
  color: rgba(245,235,224,0.92);
  border-bottom-color: rgba(255,255,255,0.08);
}
.vb-spec-table-corp--dark tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }
.vb-spec-table-corp--dark tbody tr:hover { background: rgba(199,165,120,0.06); }
.vb-spec-table-corp--dark .vb-spec-table-corp__tag {
  background: rgba(199,165,120,0.16);
  color: var(--color-secondary);
}
.vb-spec-table-corp--dark .vb-spec-table-corp__step {
  color: var(--color-secondary);
  opacity: 0.85;
  font-size: 1rem;
}
.vb-spec-table-corp--dark .vb-spec-table-corp__name {
  color: #FFFFFF;
}
.corp-root .vb-spec-table-corp--dark a.inline-anchor,
.corp-root .vb-capability-grid-corp--dark a.inline-anchor,
.corp-root .vb-workflow-corp--dark a.inline-anchor {
  color: var(--color-secondary);
  text-decoration: underline;
  text-decoration-color: rgba(199,165,120,0.5);
  text-underline-offset: 3px;
}
.corp-root .vb-spec-table-corp--dark a.inline-anchor:hover,
.corp-root .vb-capability-grid-corp--dark a.inline-anchor:hover,
.corp-root .vb-workflow-corp--dark a.inline-anchor:hover {
  color: var(--color-accent);
  text-decoration-color: var(--color-accent);
}

/* TAN band: warm secondary (Berunwear footer-style) */
.vb-fabric-spec-grid-corp--tan,
.vb-decoration-grid-corp--tan {
  background: linear-gradient(180deg, #DCBE99 0%, #C7A578 100%);
  color: #1F2A1B;
}
.vb-fabric-spec-grid-corp--tan .vb-fabric-spec-card-corp,
.vb-decoration-grid-corp--tan .vb-decoration-card-corp {
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(31,42,27,0.10);
}
.vb-fabric-spec-grid-corp--tan h2,
.vb-fabric-spec-grid-corp--tan h3,
.vb-decoration-grid-corp--tan h2,
.vb-decoration-grid-corp--tan h3 { color: #1F2A1B; }

/* DEEP-DARK band: near-black for highest contrast (existing M11 stats + form already use it) */
.section--ink {
  background: #0F1B14;
  color: #F0E7D8;
}

/* Soft tinted band (alt cream variants for variety) */
.bg-cream-warm { background: #EFE0CB; }   /* deeper warm cream */
.bg-cream-soft { background: #F5EBE0; }   /* default soft */

/* ============================================================
   v3.3 — Dark section text/accent overrides (legibility on dark olive)
   Fix: H2 em accent, body muted, eyebrow, bullets, links
   ============================================================ */

/* H2 emphasis span (was using primary on dark primary bg = invisible) */
.vb-capability-grid-corp--dark h2 em,
.vb-capability-grid-corp--dark h2 .em,
.vb-spec-table-corp--dark h2 em,
.vb-spec-table-corp--dark h2 .em,
.vb-workflow-corp--dark h2 em,
.vb-workflow-corp--dark h2 .em {
  color: var(--color-secondary);
  font-style: normal;
}

/* Body / paragraphs / intro / muted text */
.vb-capability-grid-corp--dark p,
.vb-capability-grid-corp--dark .vb-corp-head__intro,
.vb-capability-grid-corp--dark .vb-capability-card-corp__body,
.vb-spec-table-corp--dark p,
.vb-spec-table-corp--dark .vb-corp-head__intro,
.vb-workflow-corp--dark p,
.vb-workflow-corp--dark .vb-corp-head__intro,
.vb-workflow-corp--dark .vb-workflow-corp__step-body {
  color: rgba(245,235,224,0.86);
}

/* Card titles inside dark section */
.vb-capability-grid-corp--dark .vb-capability-card-corp__title,
.vb-workflow-corp--dark .vb-workflow-corp__step-title {
  color: var(--color-text-on-dark);
}

/* Eyebrow / rail / section-num watermark */
.vb-capability-grid-corp--dark .vb-corp-head__rail,
.vb-spec-table-corp--dark .vb-corp-head__rail,
.vb-workflow-corp--dark .vb-corp-head__rail {
  color: var(--color-secondary);
}
.vb-capability-grid-corp--dark .vb-corp-head__rail::before,
.vb-spec-table-corp--dark .vb-corp-head__rail::before,
.vb-workflow-corp--dark .vb-corp-head__rail::before {
  background: var(--color-secondary);
}

/* Bullet list items (sub-spec dots inside cards) */
.vb-capability-grid-corp--dark .vb-capability-card-corp__bullets li,
.vb-capability-grid-corp--dark ul li,
.vb-workflow-corp--dark ul li {
  color: rgba(245,235,224,0.78);
}
.vb-capability-grid-corp--dark .vb-capability-card-corp__bullets li::before,
.vb-capability-grid-corp--dark ul li::before {
  color: var(--color-secondary);
}

/* Inline anchor links (CTA-style trailing arrow) */
.vb-capability-grid-corp--dark a,
.vb-spec-table-corp--dark a,
.vb-workflow-corp--dark a {
  color: var(--color-secondary);
}
.vb-capability-grid-corp--dark a:hover,
.vb-spec-table-corp--dark a:hover,
.vb-workflow-corp--dark a:hover {
  color: #E8D2B0;
}

/* Workflow step number (Day N) — make secondary tan, large + bold */
.vb-workflow-corp--dark .vb-workflow-corp__step-num,
.vb-workflow-corp--dark .day-num {
  color: var(--color-secondary);
}

/* Card icon backdrop on dark */
.vb-capability-grid-corp--dark .vb-capability-card-corp__icon {
  background: rgba(199,165,120,0.16);
  color: var(--color-secondary);
}

/* Card hover lift on dark — keep visual feedback */
.vb-capability-grid-corp--dark .vb-capability-card-corp:hover,
.vb-workflow-corp--dark .vb-workflow-corp__step:hover {
  background: rgba(255,255,255,0.07);
  border-color: rgba(199,165,120,0.35);
}

/* TAN section text contrast (already had basic h2/h3, add body) */
.vb-fabric-spec-grid-corp--tan p,
.vb-fabric-spec-grid-corp--tan .vb-corp-head__intro,
.vb-decoration-grid-corp--tan p,
.vb-decoration-grid-corp--tan .vb-corp-head__intro {
  color: #2D3B29;
}
.vb-fabric-spec-grid-corp--tan .vb-corp-head__rail,
.vb-decoration-grid-corp--tan .vb-corp-head__rail {
  color: #1F2A1B;
}
.vb-fabric-spec-grid-corp--tan .vb-corp-head__rail::before,
.vb-decoration-grid-corp--tan .vb-corp-head__rail::before {
  background: #1F2A1B;
}
.vb-fabric-spec-grid-corp--tan h2 em,
.vb-decoration-grid-corp--tan h2 em {
  color: var(--color-primary);
  font-style: normal;
}

/* v3.6 — M2 callout dark olive base now applied directly to .vb-insight-corp__callout (line 4187) */

/* ============================================================
   v3.7 — Geometric / cut / texture section-bg system
   Goal: break flat-bg monotony with industrial/patternmaker visuals.
   Inspired by: Behance corporate, Berunwear band rhythm, factory drafts.
   ============================================================ */

/* --- Layer 1: subtle line-grid overlay (cream-tint + white sections) --- */
.section-corp--tint {
  position: relative;
  isolation: isolate;
  background-image:
    linear-gradient(to right, rgba(63,79,58,0.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(63,79,58,0.045) 1px, transparent 1px);
  background-size: 56px 56px;
  background-position: -1px -1px;
}
/* white sections get an even more subtle grid (Behance corporate doc feel) */
.section-corp--white {
  position: relative;
  isolation: isolate;
  background-image:
    linear-gradient(to right, rgba(63,79,58,0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(63,79,58,0.035) 1px, transparent 1px);
  background-size: 64px 64px;
  background-position: -1px -1px;
}

/* --- Layer 2: section-number watermark — removed per design feedback (numbers were too on-the-nose) --- */

/* --- Layer 3: diagonal section dividers (SVG wedge, sits between sections) --- */
.section-corp--wedge-tl::before,
.section-corp--wedge-tr::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: clamp(40px, 5vw, 72px);
  background: inherit;
  pointer-events: none;
  z-index: 2;
}
.section-corp--wedge-tl::before {
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.section-corp--wedge-tr::before {
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}

/* hard cut variant — section itself clipped diagonally (creates angled bottom) */
.section-corp--slope-bottom {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 56px), 0 100%);
}
.section-corp--slope-top {
  clip-path: polygon(0 56px, 100% 0, 100% 100%, 0 100%);
  margin-top: -56px;
}

/* --- Layer 4: chamfer (cut corners) on dark feature sections --- */
.section-corp--chamfer {
  clip-path: polygon(
    32px 0,
    100% 0,
    100% calc(100% - 32px),
    calc(100% - 32px) 100%,
    0 100%,
    0 32px
  );
}

/* --- Layer 5: dotted-grid overlay (alt pattern for tan/dark sections) --- */
.section-corp--dotgrid {
  position: relative;
  isolation: isolate;
}
.section-corp--dotgrid::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(245,235,224,0.10) 1.2px, transparent 1.2px);
  background-size: 28px 28px;
  background-position: 0 0;
  pointer-events: none;
  z-index: 0;
}
.section-corp--dotgrid > * { position: relative; z-index: 1; }

/* --- Layer 6: vertical inset rule (left/right architectural marker) --- */
.section-corp--rule-l::before,
.section-corp--rule-r::after {
  content: "";
  position: absolute;
  top: clamp(40px, 6vw, 80px);
  bottom: clamp(40px, 6vw, 80px);
  width: 1px;
  background: currentColor;
  opacity: 0.12;
  pointer-events: none;
}
.section-corp--rule-l::before { left: clamp(20px, 4vw, 56px); }
.section-corp--rule-r::after { right: clamp(20px, 4vw, 56px); }