/*!********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/comparison-table/style.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************/
/**
 * mea/comparison-table
 *
 * Measured from Figma node `2003:6318` ("Comparison Section" on
 * /bpo-solutions, file 9SWHsksPbiz0sj8IF30o5u), whose `Table` child is
 * `2003:6320` at 1048 x 559. This is the only instance of the shape in the
 * file, so nothing here is parameterised beyond the section insets: the
 * lesson from `mea/subpage-hero` is that a geometry axis gets opened from a
 * second Figma node, not on speculation.
 *
 * The 1440 arithmetic this reproduces:
 *   section     120 gutter, 100 top / 100 bottom, 48 gap under the headline
 *   table       1048 wide, 12 radius, rgba(255,255,255,0.6) over #edeff3
 *   header row  24 padding, H3 24/1.3 semibold  -> 79.2 tall
 *   body row    24 padding, P2 16/1.5 regular   -> 72 tall (96 when the
 *               right cell wraps to two lines, which rows 4 and 6 do)
 *   total       79.2 + 4x72 + 2x96 = 559.2 against Figma's stored 559
 *   section     100 + 49.5 + 48 + 559.2 + 100 = 856.7 against Figma's 857
 * The half-pixel shortfalls are Figma ceiling-rounding text-node heights
 * (45px at line-height 1.1 is 49.5, stored as 50). Do not tune them out.
 *
 * COLUMN GEOMETRY. Figma builds each row as a 24px-padded flex row holding a
 * fixed 500px wrapper with a 40px left inset and a fixed 400px wrapper with a
 * 30px left inset. 24 + 500 = 524 = exactly half of 1048, so the two columns
 * are 50/50 and the column divider sits on the centre line. The 400px wrapper
 * then leaves 1048 - 24 - 500 - 400 - 24 = 100px of unused table on the right,
 * which is why the right column's copy stops well short of the table edge in
 * the design. That slack is reproduced as trailing cell padding (24 + 100),
 * not discarded.
 *
 * Hairlines are drawn as inset box-shadows and one absolutely positioned
 * overlay, never as borders: Figma strokes cost no layout, and a 1px border
 * on a cell or on the frame would add its own height and push the table past
 * its 559px frame (the same trap `mea/section-header` records for full-bleed
 * section rules).
 */
.mea-comparison-table {
  /* Subpage frames use a 120px section gutter against the homepage's 88px,
     so rebind the shared gutter rather than bypass .mea-container.
     120 / 1440 = 8.3333vw. */
  --mea-gutter: clamp(20px, 8.3333vw, 120px);
  /* 2003:6319 paints the headline #021412, not the shared light-surface
     default. Rebinding --mea-fg (not `color`) is what carries it into the
     nested mea/section-header root, which reads the custom property. */
  --mea-fg: var(--mea-ink-strong);
  /* Cell geometry, stepped for the narrow sweep below. */
  --mea-comparison-pad-y: 24px;
  --mea-comparison-lead-one: 64px; /* 24 row padding + 40 wrapper inset */
  --mea-comparison-trail-one: 0; /* Figma gives column one no trailing inset */
  --mea-comparison-lead-two: 30px; /* the 400px wrapper's own inset */
  --mea-comparison-trail-two: 124px; /* 24 row padding + Figma's 100 slack */
  --mea-comparison-head-size: var(--mea-type-h3-size);
  --mea-comparison-cell-size: var(--mea-type-p2-size);
  /* Hairline colours. Figma's per-row `border-b` is rgba(0,0,0,0.15) and the
     `Column Divider` (2003:6356) is an opaque #d9d9d9 line. Neither exists in
     tokens.css - every --mea-rule-* is an opaque grey and the palette carries
     no black-alpha rule at all - so these two are the design genuinely
     differing from the token layer rather than a shortcut past it. */
  --mea-comparison-rule: rgba(0, 0, 0, 0.15);
  --mea-comparison-divider: #d9d9d9;
  box-sizing: border-box;
  padding-top: var(--mea-comparison-pt, 100px);
  padding-bottom: var(--mea-comparison-pb, 100px);
  background-color: var(--mea-surface-alt);
}
.mea-comparison-table__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* 2003:6318 is a 48px-gap column. One instance, so it stays here. */
  gap: 48px;
  box-sizing: border-box;
}
.mea-comparison-table__header {
  width: 100%;
}
.mea-comparison-table {
  /* --------------------------------------------------------------- *
   * The rounded surface. It is a wrapper div rather than the table
   * itself so `overflow: hidden` clips the dark header band's corners
   * without being asked of a table box.
   * --------------------------------------------------------------- */
}
.mea-comparison-table__frame {
  position: relative;
  width: 100%;
  /* 2003:6320. */
  max-width: 1048px;
  border-radius: 12px;
  overflow: hidden;
  /* rgba(255,255,255,0.6) in Figma. Expressed through the token with
     color-mix rather than as an rgba() literal, per the shared rule on
     varying a token's alpha. */
  background-color: color-mix(in srgb, var(--mea-on-dark) 60%, transparent);
  box-sizing: border-box;
}
.mea-comparison-table {
  /* Figma's 1px rgba(0,0,0,0.1) frame stroke. A black-alpha hairline has no
     analogue in tokens.css (every --mea-rule-* is an opaque grey), so the
     literal is the design genuinely differing from the palette. Drawn as an
     overlay so it paints above the dark header band the way a Figma stroke
     does, and so it costs the frame no height. */
}
.mea-comparison-table__frame::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: inherit;
  box-sizing: border-box;
  pointer-events: none;
}
.mea-comparison-table {
  /* --------------------------------------------------------------- *
   * The table. `fixed` layout is what pins the two columns to 50/50
   * the way Figma's fixed-width wrappers do; in the fixed algorithm a
   * cell's `width` is its border-box width, so 50% resolves to 524px
   * at the design size and the leading insets come straight off it.
   * --------------------------------------------------------------- */
}
.mea-comparison-table__table {
  width: 100%;
  table-layout: fixed;
  /* `separate` with zero spacing, so the row hairlines can be inset
     shadows: collapsed borders would take height from the cells. */
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  font-family: var(--mea-font-sans);
}
.mea-comparison-table {
  /* An accessible name for the table, read but not drawn - the design
     gives the table no visible caption. */
}
.mea-comparison-table__caption {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.mea-comparison-table__head-row {
  /* 2003:6321. */
  background-color: var(--mea-dark);
}
.mea-comparison-table__head, .mea-comparison-table__cell {
  width: 50%;
  /* border-box, and it is load-bearing. In the fixed table algorithm a
     cell's `width` is a CONTENT width by default, so 50% + the leading
     insets asked for 1266px of a 1048px table and Chrome scaled the two
     columns to 486.73 / 561.27 - which widened the right column enough
     that row 4 stopped wrapping and the table measured 535 instead of
     559. border-box makes 50% resolve to Figma's 524px column. */
  box-sizing: border-box;
  padding-top: var(--mea-comparison-pad-y);
  padding-bottom: var(--mea-comparison-pad-y);
  text-align: left;
  /* Rows 4 and 6 (2003:6341, 2003:6351) are `items-center` in Figma, so
     the single-line cell beside a wrapped one sits centred against it.
     Every other row has equal-height cells, where middle and top are
     identical - so one uniform rule reproduces all six. */
  vertical-align: middle;
  /* Figma sets `[word-break:break-word]` on every text node here. */
  overflow-wrap: break-word;
}
.mea-comparison-table__cell--one {
  padding-left: var(--mea-comparison-lead-one);
  padding-right: var(--mea-comparison-trail-one);
}
.mea-comparison-table__cell--two {
  padding-left: var(--mea-comparison-lead-two);
  padding-right: var(--mea-comparison-trail-two);
}
.mea-comparison-table {
  /* --------------------------------------------------------------- *
   * Type. Figma "H3" (Inter Semi Bold 24 / 1.3) on the header cells,
   * "P2" (Inter Regular 16 / 1.5) on the body cells. Both weights are
   * served by src/_shared/type.css.
   * --------------------------------------------------------------- */
}
.mea-comparison-table__head {
  font-weight: var(--mea-weight-semibold);
  font-size: var(--mea-comparison-head-size);
  line-height: var(--mea-type-h3-lh);
}
.mea-comparison-table__cell {
  font-weight: var(--mea-weight-regular);
  font-size: var(--mea-comparison-cell-size);
  line-height: var(--mea-type-p2-lh);
}
.mea-comparison-table {
  /* --------------------------------------------------------------- *
   * Ink and hairlines, per cell. Four ink values, all from the node,
   * each measured against the background actually painted behind it:
   *   header col 1  rgba(255,255,255,0.7) on #021412   9.46:1
   *   header col 2  #c5ff00 on #021412                15.91:1
   *   body col 1    #2e2e2b on the 60% white surface  12.92:1
   *   body col 2    #091900 on the same surface       17.31:1
   * measured against the backgrounds SAMPLED from the 1440 capture
   * (#021412 header band, #F8F9FA table surface), not the declared ones.
   * The block has no links and no interactive cells, so there is no
   * hover state to hold to the same bar.
   *
   * The row rule and the column divider ride along here as inset
   * shadows, because a cell's shadow list is one property: the divider
   * runs the full table height (header band included, which is what
   * 2003:6356 draws), while the row rule stops at the header, since
   * 2003:6321 has no bottom stroke - the colour change is its boundary.
   *
   * The divider is on the LEADING edge of column two, not the trailing
   * edge of column one. Measured: 2003:6356 rasterises at x = 720 in the
   * 1440 frame, which is the first pixel of the right column; a trailing
   * shadow on column one landed it at 719 and was the only pixel delta
   * left against the Figma render.
   * --------------------------------------------------------------- */
}
.mea-comparison-table__head.mea-comparison-table__cell--one {
  color: color-mix(in srgb, var(--mea-on-dark) 70%, transparent);
}
.mea-comparison-table {
  /* Figma paints the mea column's header lime. That is the accent used as
     emphasis on a dark surface, which is where it clears AA on its own -
     the light-surface --mea-accent-ink substitution does not apply here. */
}
.mea-comparison-table__head.mea-comparison-table__cell--two {
  color: var(--mea-accent);
  box-shadow: inset 1px 0 0 var(--mea-comparison-divider);
}
.mea-comparison-table__cell.mea-comparison-table__cell--one {
  color: var(--mea-ink);
  box-shadow: inset 0 -1px 0 var(--mea-comparison-rule);
}
.mea-comparison-table {
  /* #091900 is Figma "Style 43"; --mea-cta-ink is the only token carrying
     it. The name is the CTA's, the value is the style's. */
}
.mea-comparison-table__cell.mea-comparison-table__cell--two {
  color: var(--mea-cta-ink);
  box-shadow: inset 1px 0 0 var(--mea-comparison-divider), inset 0 -1px 0 var(--mea-comparison-rule);
}
.mea-comparison-table {
  /* --------------------------------------------------------------- *
   * Narrow viewports. INTERPOLATED: Figma supplies only the 1440
   * frame for this section, and the design audit found it the one
   * section in its slice with no drawn narrow form at all - there is
   * no 768 or 375 artwork to match, so both steps below are derived
   * from the 1440 arithmetic, not measured against a frame.
   *
   * The captain's ruling is what they implement: keep six rows and two
   * columns and reduce the text size to fit. So no stacked-card
   * reflow, no dropped column, and deliberately no horizontal
   * scroller - the table shrinks with the container, the insets
   * tighten, Figma's 100px of right-hand slack collapses back to the
   * row padding, and the type steps down.
   * --------------------------------------------------------------- */
}
@media (max-width: 1023px) {
  .mea-comparison-table {
    --mea-comparison-pad-y: 20px;
    --mea-comparison-lead-one: 32px;
    /* Column one gets a trailing inset it does not have at 1440. Figma
       gives it a 460px text measure inside a 524px column, so the copy
       never reaches the divider even with no padding; once the column
       narrows the copy fills its measure and would butt against the
       hairline. Measured on the 375 capture before this was added: "Cost
       follows headcount and volume" ended flush on the divider. */
    --mea-comparison-trail-one: 24px;
    --mea-comparison-lead-two: 24px;
    --mea-comparison-trail-two: 24px;
    --mea-comparison-head-size: 20px;
    --mea-comparison-cell-size: 15px;
    padding-top: min(var(--mea-comparison-pt, 100px), 80px);
    padding-bottom: min(var(--mea-comparison-pb, 100px), 80px);
  }
  .mea-comparison-table__inner {
    gap: 40px;
  }
}
@media (max-width: 767px) {
  .mea-comparison-table {
    --mea-comparison-pad-y: 14px;
    --mea-comparison-lead-one: 14px;
    --mea-comparison-trail-one: 12px;
    --mea-comparison-lead-two: 12px;
    --mea-comparison-trail-two: 12px;
    --mea-comparison-head-size: 15px;
    --mea-comparison-cell-size: 13px;
    padding-top: min(var(--mea-comparison-pt, 100px), 56px);
    padding-bottom: min(var(--mea-comparison-pb, 100px), 56px);
  }
  .mea-comparison-table__inner {
    gap: 28px;
  }
  .mea-comparison-table__frame {
    border-radius: 8px;
  }
}
.mea-comparison-table {
  /* ----------------------------------------------------------------- *
   * DARK VARIANT - R6's "The operating shift", a second construction.
   *
   * Nodes: 3012:10379 (13a AXIS), 3012:10724 (13b Crux), 3012:10996
   * (13c Moonrock). All three agree on every value below, so none of it is
   * an attribute. Measured off `get_design_context` on 3012:10379 and
   * checked against that node's own 1440 render.
   *
   *   section     --mea-panel-raised, 120 padding, 48 gap under the title,
   *               a 1px --mea-on-dark 10% rule above and below (the `rule`
   *               attribute, since only this variant draws them)
   *   frame       1200 wide, 16 radius, 1px --mea-on-dark 10% edge, no fill
   *   header row  --mea-on-dark 3%, 20 padding, Inter Semi Bold 14 at 1.5px
   *               tracking, UPPERCASE, --mea-accent, both columns alike
   *   body row    --mea-on-dark 1%, 24 padding, a 40px gutter between the
   *               two 50/50 columns, 16/1.5
   *   left cell   Inter Regular, --mea-on-dark-soft at 70%
   *   right cell  Inter MEDIUM, opaque --mea-on-dark
   *
   * There is NO column divider here - the light instance's #d9d9d9 line
   * (2003:6356) has no counterpart on any of the three dark nodes - and the
   * asymmetric 64/0/30/124 insets the light instance reproduces from Figma's
   * fixed-width wrappers are replaced by a symmetric 24/20/20/24, which is
   * the same 40px gutter R6 declares as a flex gap.
   * ----------------------------------------------------------------- */
}
.mea-comparison-table--dark {
  --mea-fg: var(--mea-on-dark);
  --mea-comparison-pad-y: 24px;
  --mea-comparison-lead-one: 24px;
  --mea-comparison-trail-one: 20px;
  --mea-comparison-lead-two: 20px;
  --mea-comparison-trail-two: 24px;
  --mea-comparison-rule: color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
  background-color: var(--mea-panel-raised);
  color: var(--mea-on-dark);
}
.mea-comparison-table {
  /* The section hairlines, as inset shadows: a 1px border would add its own
     height to a section whose height is content-driven - the trap AGENTS.md
     records for every full-bleed rule in this file. */
}
.mea-comparison-table--rule-top {
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
}
.mea-comparison-table--rule-bottom {
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
}
.mea-comparison-table--rule-both {
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mea-on-dark) 10%, transparent), inset 0 -1px 0 color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
}
.mea-comparison-table--dark .mea-comparison-table__frame {
  /* Full content column, not the light instance's 1048. */
  max-width: none;
  border-radius: 16px;
  background-color: transparent;
}
.mea-comparison-table--dark .mea-comparison-table__frame::after {
  border-color: color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
}
.mea-comparison-table--dark .mea-comparison-table__head-row {
  background-color: color-mix(in srgb, var(--mea-on-dark) 3%, transparent);
}
.mea-comparison-table--dark .mea-comparison-table__head {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: var(--mea-weight-semibold);
  /* 14px is this construction's own header step; no --mea-type-* pair
     carries it, and it appears nowhere else in the file. */
  font-size: 14px;
  line-height: normal;
  letter-spacing: var(--mea-type-eyebrow-ls);
  text-transform: uppercase;
}
.mea-comparison-table {
  /* Both header cells are the same lime here, where the light instance
     paints column one white-70% and only column two lime. */
}
.mea-comparison-table--dark .mea-comparison-table__head.mea-comparison-table__cell--one, .mea-comparison-table--dark .mea-comparison-table__head.mea-comparison-table__cell--two {
  color: var(--mea-accent);
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--mea-on-dark) 10%, transparent);
}
.mea-comparison-table--dark .mea-comparison-table__row {
  background-color: color-mix(in srgb, var(--mea-on-dark) 1%, transparent);
}
.mea-comparison-table--dark .mea-comparison-table__cell {
  vertical-align: top;
}
.mea-comparison-table--dark .mea-comparison-table__cell.mea-comparison-table__cell--one {
  color: color-mix(in srgb, var(--mea-on-dark-soft) 70%, transparent);
  box-shadow: inset 0 -1px 0 var(--mea-comparison-rule);
}
.mea-comparison-table {
  /* Inter MEDIUM on the right, Regular on the left - the one weight
     difference between the two columns, and the whole of the emphasis R6
     gives the "With mea" side. */
}
.mea-comparison-table--dark .mea-comparison-table__cell.mea-comparison-table__cell--two {
  color: var(--mea-on-dark);
  font-weight: var(--mea-weight-medium);
  box-shadow: inset 0 -1px 0 var(--mea-comparison-rule);
}
.mea-comparison-table {
  /* R6 draws no rule under the last row (3012:10395 carries `border-0`). */
}
.mea-comparison-table--dark tbody tr:last-child .mea-comparison-table__cell.mea-comparison-table__cell--one, .mea-comparison-table--dark tbody tr:last-child .mea-comparison-table__cell.mea-comparison-table__cell--two {
  box-shadow: none;
}

/*# sourceMappingURL=style-index.css.map*/