/* VA20Four7 v11.16 — Visual Box Model & Text Containment
   Root-cause fix for text clipping in cinematic/product visuals.
   Keeps visual concepts/content intact; fixes grid sizing, padding math and wrapping. */

/* --------------------------------------------------------------------------
   1. Every product-visual descendant uses a predictable box model.
   Padding/borders must be included in the width assigned by grid/flex.
   -------------------------------------------------------------------------- */
html body :is(
  .workflow-visual-canvas,.home940-pressure-board,.home970-flow,.home990-shell,.home1010-stack-visual,
  .va102-service-console,.va102-audience-hero-visual,.va102-orchestration-board,.va102-intelligence-board,
  .va103-audit-console,.va103-output-board,.va103-diagnostic-shell,
  .va104-mini-dashboard,.va104-resource-feature-shell,.va104-career-console,.va104-resource-console,
  .va107-signature,.va107-layer-rail,.va107-design-board,
  .va110-platform-ui,.va110-loop-visual,.va110-pricing-visual,.va110-support-demo,
  .hero-visual-system,.contact-mini-flow
),
html body :is(
  .workflow-visual-canvas,.home940-pressure-board,.home970-flow,.home990-shell,.home1010-stack-visual,
  .va102-service-console,.va102-audience-hero-visual,.va102-orchestration-board,.va102-intelligence-board,
  .va103-audit-console,.va103-output-board,.va103-diagnostic-shell,
  .va104-mini-dashboard,.va104-resource-feature-shell,.va104-career-console,.va104-resource-console,
  .va107-signature,.va107-layer-rail,.va107-design-board,
  .va110-platform-ui,.va110-loop-visual,.va110-pricing-visual,.va110-support-demo,
  .hero-visual-system,.contact-mini-flow
) *{
  box-sizing:border-box!important;
}

/* Grid/flex children are allowed to shrink to their allocated track. */
html body :is(
  .home970-flow,.workflow-visual-route,.va102-console-flow,.va102-audience-board-flow,
  .va102-intelligence-cards,.va102-orchestration-board,.va104-model-flow,
  .va107-layer-rail,.va110-price-factors,.va110-platform-panels
) > *{
  min-width:0!important;
  max-width:100%!important;
}

/* --------------------------------------------------------------------------
   2. Homepage ownership workflow — root-cause correction.
   Previous width:100% on the label filled the whole card width before its
   number column + gap + padding were added, causing the right side to clip.
   -------------------------------------------------------------------------- */
html body .home970-step{
  min-width:0!important;
  overflow:hidden!important;
}

html body .home970-step-top{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  column-gap:10px!important;
  row-gap:0!important;
  align-items:start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
}

html body .home970-step-top > span{
  grid-column:1!important;
  width:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  height:38px!important;
  min-height:38px!important;
  padding:0!important;
  margin:0!important;
}

html body .home970-step-top > em{
  grid-column:2!important;
  justify-self:stretch!important;
  align-self:start!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:38px!important;
  height:auto!important;
  padding:8px 10px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  line-height:1.22!important;
  font-size:11.5px!important;
  letter-spacing:.025em!important;
}

/* Keep enough vertical room for a legitimate two-line label. */
html body .home970-step-top:has(> em){
  min-height:38px!important;
}

html body .home970-step > strong,
html body .home970-step > p{
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

/* Meta/status labels stay inside the visual and wrap as a group when needed. */
html body .home970-flow-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  min-width:0!important;
  max-width:100%!important;
}
html body .home970-flow-meta > span,
html body .home970-flow-status{
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  white-space:normal!important;
  overflow:visible!important;
  line-height:1.25!important;
}

/* --------------------------------------------------------------------------
   3. Shared visual chip/header containment.
   Avoid fixed-content widths inside already constrained grid tracks.
   -------------------------------------------------------------------------- */
html body :is(
  .workflow-visual-head>span,.workflow-visual-step :is(span,em,strong),
  .va102-console-top span,.va102-console-bottom span,
  .va102-audience-board-top span,.va102-audience-board-bottom span,
  .va102-intelligence-top span,.va103-audit-console span,.va103-output-board span,
  .va104-profile-foot span,.va104-mini-top em,
  .va107-layer-rail :is(span,em,strong),
  .va110-platform-bar span,.va110-price-path>span,.va110-loop-visual>span
){
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

/* Text-bearing visual cards grow with their content rather than crop it. */
html body :is(
  .workflow-visual-step,.va102-console-flow article,.va102-audience-board-flow article,
  .va102-intelligence-cards article,.va102-orchestration-board article,
  .va104-model-flow article,.va107-layer-rail article,.va110-price-factors article,
  .va110-platform-panels article
){
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  max-height:none!important;
}

html body :is(
  .workflow-visual-step,.va102-console-flow article,.va102-audience-board-flow article,
  .va102-intelligence-cards article,.va102-orchestration-board article,
  .va104-model-flow article,.va107-layer-rail article,.va110-price-factors article,
  .va110-platform-panels article
) :is(h3,h4,strong,b,p,small,em,span){
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  -webkit-line-clamp:unset!important;
  line-clamp:unset!important;
  max-height:none!important;
}

/* --------------------------------------------------------------------------
   4. Breakpoint corrections — do not squeeze four workflow cards past the
   point where their labels remain readable.
   -------------------------------------------------------------------------- */
@media (max-width:1180px){
  html body .home970-flow{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body .home970-flow-line{display:none!important;}
  html body .home970-flow-status{grid-column:1/-1!important;}
}

@media (max-width:760px){
  html body .home970-flow{
    grid-template-columns:1fr!important;
  }
  html body .home970-step-top{
    grid-template-columns:40px minmax(0,1fr)!important;
  }
  html body .home970-step-top > span{
    width:40px!important;min-width:40px!important;max-width:40px!important;height:40px!important;
  }
  html body .home970-step-top > em{
    min-height:40px!important;
    font-size:12px!important;
  }
  html body .home970-flow-status{
    justify-self:stretch!important;
    width:100%!important;
    justify-content:flex-start!important;
  }
}
