/* =========================================================
   LANDING 2-2026 — EAC SYNC variant
   ─────────────────────────────────────────────────────────
   Scoped to .lp26-page--variant-eac-sync.
   All design tokens come from :root in landing-2026-v5.css.
   Per-element prefixes used on `img.` / `a.` rules where
   .lp26-page img / .lp26-page a globals would otherwise win
   (specificity trap — see feedback memory).

   Sections (in render order):
   1. Hero (illustration variant)        .lp26-eac-sync-hero
   2. Trusted by (reused)                .lp26-trusted-by
   3. Benefit cards                      .lp26-eac-sync-benefits
   4. Feature rows (extended)            .lp26-eac-features (shared)
   5. Most-XYZ stats                     .lp26-eac-sync-stats
   6. Comparison (fresh, not a table)    .lp26-eac-sync-compare
   7. Media block                        .lp26-eac-sync-media
   8. Activity capture diagram           .lp26-eac-sync-capture
   9. Testimonials (reused)              .lp26-testimonials
   10. CTA (reused)                       .lp26-cta
   ========================================================= */

/* ─────────────────────────────────────────────────────────
   1. Hero (illustration variant)
   Figma: 857:7999 — 1440 × 816, 50/50 split.
   Left bg uses --rg-olive-2; right gets a radial gradient
   from white to --rg-accent-3 sitting behind the SVG.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-hero {
  width: 100%;
  background-color: var(--rg-olive-2);
  overflow: hidden;
}

.lp26-eac-sync-hero__inner {
  display: flex;
  align-items: stretch;
  max-width: 1200px;  /* Figma row 857:8000 is 1200 — was 1440 */
  margin: 0 auto;
}

.lp26-eac-sync-hero__content-col {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  /* Figma 857:8001: pl-4 pr-48 py-64. The tiny 4px left lets the text
   * sit flush against the inner row's left edge (since the row itself
   * is 1200 centered in the section). */
  padding: var(--rg-space-9) var(--rg-space-8) var(--rg-space-9) var(--rg-space-1);
  border: 1px solid var(--rg-olive-1);
  min-height: 816px;
}

.lp26-eac-sync-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-8); /* 48 — between heading-block and button (Figma 857:8002) */
  width: 100%;
}

.lp26-eac-sync-hero__heading-block {
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-5); /* 24 — between title and description (Figma 857:8003) */
  width: 100%;
}

a.lp26-eac-sync-hero__cta {
  /* Figma button label tracking is -0.5 (body), not the lp26-btn default --rg-ls-ui (-0.1). */
  letter-spacing: var(--rg-ls-body);
}

.lp26-eac-sync-hero__heading {
  margin: 0;
}

.lp26-eac-sync-hero__desc {
  margin: 0;
  color: var(--rg-color-muted);
}

.lp26-eac-sync-hero__cta {
  align-self: flex-start;
}

/* Right column — radial gradient bg from Figma node 857:8020:
   center at (300, 176.92), inner white, outer --rg-accent-3. */
.lp26-eac-sync-hero__illustration-col {
  flex: 1;
  position: relative;
  overflow: hidden;
  min-height: 816px;
  background:
    radial-gradient(
      ellipse 600px 800px at 50% 22%,
      #ffffff 0%,
      var(--rg-accent-3) 100%
    );
}

img.lp26-eac-sync-hero__illustration {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

/* ─────────────────────────────────────────────────────────
   2. Benefit cards
   Figma: 857:8634 — section 1440 × 528, content row 1200 × 400.
   Inner is a true 1200-wide centered block (no .lp26-container
   internal padding) so each card lands at the Figma 394.67px.
   Card layout uses margin-top:auto to anchor text to the
   card bottom, matching the Figma y=240 text anchor.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-benefits {
  background-color: var(--rg-olive-2);
  padding: var(--rg-space-9) var(--rg-space-8);
}

.lp26-eac-sync-benefits__inner {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.lp26-eac-sync-benefits__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--rg-space-2);
}

.lp26-eac-sync-benefits__card {
  display: flex;
  flex-direction: column;
  background-color: var(--rg-olive-1); /* Figma --colors/rg-olive/1 #fcfdfc — subtle off-white, not pure white */
  border: 1px solid var(--rg-olive-5);
  border-radius: 0; /* Figma: cards are squared off, no rounding */
  padding: var(--rg-space-5);
  min-height: 400px;
}

.lp26-eac-sync-benefits__icon-wrap {
  width: 140px;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
}

img.lp26-eac-sync-benefits__icon {
  width: 140px;
  height: 140px;
  display: block;
}

.lp26-eac-sync-benefits__text {
  margin-top: auto; /* pins text block to card bottom — matches Figma y=240 anchor */
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-4);
}

.lp26-eac-sync-benefits__heading {
  margin: 0;
  font-family: var(--rg-font-heading);
  font-weight: 600; /* Figma Heading/Desktop/H4/SemiBold */
  font-size: var(--rg-fs-h4);
  line-height: var(--rg-lh-h4);
  letter-spacing: 0;
  color: var(--rg-accent-12);
}

.lp26-eac-sync-benefits__heading em,
.lp26-eac-sync-benefits__heading i {
  font-style: italic;
  color: var(--rg-accent-9);
}

.lp26-eac-sync-benefits__body {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 400;
  font-size: var(--rg-fs-b1);
  line-height: var(--rg-lh-b1);
  letter-spacing: var(--rg-ls-body);
  color: var(--rg-color-muted);
}

/* ─────────────────────────────────────────────────────────
   3. Feature rows — eac-sync overrides
   Reuses .lp26-eac-features from landing-2-2026-eac.css.
   eac-sync ships a narrower (single-paragraph) intro and
   a single italic green em on the title — same layout as EAC.
   Figma: 862:1109 — header 1200×140, subtitle 470 wide centered.
   ───────────────────────────────────────────────────────── */
.lp26-eac-features--eac-sync .lp26-eac-features__intro {
  max-width: 470px;
}

/* Width fix — drop the .lp26-container 48px side-padding so the inner
 * row hits Figma's true 1200 (text/image cols → 600 each). The section
 * itself takes over horizontal padding so content stays clear of the
 * viewport edge at <1296px widths. EAC variant unaffected (no modifier). */
.lp26-eac-features--eac-sync {
  padding-left: var(--rg-space-8);
  padding-right: var(--rg-space-8);
}

.lp26-eac-features--eac-sync .lp26-eac-features__header.lp26-container,
.lp26-eac-features--eac-sync .lp26-eac-features__rows.lp26-container {
  padding-left: 0;
  padding-right: 0;
}

/* Border-collapse: cells each have a 1px border which doubles to 2px on the
 * text↔image shared edge and on row↔row shared edges. Pull the right cell
 * left by -1px and each subsequent row up by -1px so shared edges sit on
 * top of each other and read as a single 1px line — matching Figma. */
.lp26-eac-features--eac-sync .lp26-eac-features__row + .lp26-eac-features__row {
  margin-top: -1px;
}

.lp26-eac-features--eac-sync .lp26-eac-features__row--text-left .lp26-eac-features__image-col,
.lp26-eac-features--eac-sync .lp26-eac-features__row--text-right .lp26-eac-features__text-col {
  margin-left: -1px;
}

/* ─────────────────────────────────────────────────────────
   3a. Trusted by — eac-sync overrides
   Figma: 857:8317. Reuses .lp26-trusted-by from
   section-trusted-by-2026-variant-2.css; we only override the
   bits that differ from the product-page defaults (heading max
   width 498, cards 240×fluid w/ 70/24 padding, larger logos).
   ───────────────────────────────────────────────────────── */
.lp26-page--variant-eac-sync .lp26-trusted-by__heading {
  max-width: 498px;
  padding-left: 0;
  padding-right: 0;
}

.lp26-page--variant-eac-sync .lp26-trusted-by__logo-item {
  height: 240px;
  padding: 70px var(--rg-space-5);
}

.lp26-page--variant-eac-sync img.lp26-trusted-by__logo-img {
  max-width: 100%;
  max-height: 100px;
}

/* ─────────────────────────────────────────────────────────
   4. Most-XYZ stats (dark band)
   Figma: 862:8121 — section bg --rg-accent-12; px 48 / py 108;
   gap 64 between groups.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-stats {
  background-color: var(--rg-accent-12);
  padding: 108px var(--rg-space-8);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rg-space-9);
  color: var(--rg-white);
}

.lp26-eac-sync-stats__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rg-space-4);
}

img.lp26-eac-sync-stats__emblem {
  width: 138.172px;
  height: 108px;
  display: block;
}

.lp26-eac-sync-stats__title {
  margin: 0;
  /* Figma 862:8122 — title container is 600px wide; the natural wrap of
     "The Most Rigorously Security-Tested Environment Available" at 40/42
     produces the two-line layout shown in design (no <br> needed). */
  width: 600px;
  max-width: 100%;
  text-align: center;
  font-family: var(--rg-font-heading);
  font-weight: 400;
  font-size: var(--rg-fs-h2);
  line-height: var(--rg-lh-h2);
  letter-spacing: 0;
  color: var(--rg-white);
}

.lp26-eac-sync-stats__title em,
.lp26-eac-sync-stats__title i {
  font-style: italic;
  color: var(--rg-accent-8);
  font-weight: inherit;
}

.lp26-eac-sync-stats__badges {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--rg-space-5);
}

img.lp26-eac-sync-stats__badge {
  display: block;
}

img.lp26-eac-sync-stats__badge--sm {
  width: 64px;
  height: 64px;
}

img.lp26-eac-sync-stats__badge--lg {
  width: 96px;
  height: 96px;
}

.lp26-eac-sync-stats__row {
  display: flex;
  width: 1200px;
  max-width: 100%;
  align-items: stretch;
}

.lp26-eac-sync-stats__cell {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-5);
  padding: var(--rg-space-6);
  min-width: 0;
}

.lp26-eac-sync-stats__cell-heading {
  margin: 0;
  font-family: var(--rg-font-heading);
  /* Figma "Heading/Desktop/H4/Regular" — Playfair Regular (400).
   * Previously set to SemiBold (600) which rendered ~10% wider and made
   * cell 3's "Deployment Flexibility" overflow to a 3rd line. */
  font-weight: var(--rg-fw-regular);
  font-size: var(--rg-fs-h4);
  line-height: var(--rg-lh-h4);
  letter-spacing: 0;
  color: var(--rg-white);
}

.lp26-eac-sync-stats__cell-heading em,
.lp26-eac-sync-stats__cell-heading i {
  font-style: italic;
  color: var(--rg-accent-8);
  font-weight: inherit;
}

.lp26-eac-sync-stats__cell-body {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 400;
  font-size: var(--rg-fs-b1);
  line-height: var(--rg-lh-b1);
  letter-spacing: var(--rg-ls-body);
  color: var(--rg-neutral-8);
}

/* ─────────────────────────────────────────────────────────
   5. Comparison block (RG vs Einstein Activity Capture)
   Figma: 862:8228 — white section, top row = logos+title left,
   dark CTA right; below = 3 cards row gap 8.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-compare {
  background-color: var(--rg-white);
  border: 1px solid #f5f5f5;
  padding: 120px var(--rg-space-8);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rg-space-8);
}

.lp26-eac-sync-compare__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 1200px;
  max-width: 100%;
  gap: var(--rg-space-5);
}

.lp26-eac-sync-compare__heading-col {
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-5);
  width: 667px;
  max-width: 100%;
}

.lp26-eac-sync-compare__logos {
  position: relative;
  width: 135.78px;
  height: 80px;
}

.lp26-eac-sync-compare__logo-pill {
  position: absolute;
  top: 0;
  width: 80px;
  height: 80px;
  background-color: var(--rg-white);
  border: 1.053px solid #bcc4ca;
  border-radius: 65.69px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16.845px;
  overflow: hidden;
  box-shadow:
    0px 4px 16px -8px rgba(0, 0, 0, 0.1),
    0px 3px 12px -4px rgba(0, 0, 0, 0.1),
    0px 2px 3px -2px rgba(0, 0, 51, 0.06);
}

.lp26-eac-sync-compare__logo-pill--first  { left: 0; }
.lp26-eac-sync-compare__logo-pill--second { left: 55.78px; }

img.lp26-eac-sync-compare__logo-img--rg {
  width: 32.975px;
  height: 32.975px;
  display: block;
}

img.lp26-eac-sync-compare__logo-img--eac {
  width: 54.109px;
  height: 54.109px;
  border-radius: 27.055px;
  display: block;
  object-fit: cover;
}

.lp26-eac-sync-compare__eyebrow {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 400;
  font-size: var(--rg-fs-h4);    /* 24 */
  line-height: var(--rg-lh-h4);  /* 24 */
  letter-spacing: 0;
  color: var(--rg-color-muted);
}

.lp26-eac-sync-compare__title {
  margin: 0;
  font-family: var(--rg-font-heading);
  font-weight: 500;
  font-size: var(--rg-fs-h2);    /* 40 */
  line-height: var(--rg-lh-h2);  /* 42 */
  letter-spacing: 0;
  color: var(--rg-accent-12);
}

.lp26-eac-sync-compare__title em,
.lp26-eac-sync-compare__title i {
  font-style: italic;
  color: var(--rg-accent-9);
  font-weight: inherit;
}

.lp26-eac-sync-compare__cta {
  flex-shrink: 0;
}

.lp26-eac-sync-compare__cards {
  display: flex;
  align-items: stretch;
  gap: var(--rg-space-2);
  width: 1200px;
  max-width: 100%;
}

.lp26-eac-sync-compare__card {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-9);
  padding: var(--rg-space-5);
  background-color: var(--rg-olive-1);
  border: 1px solid var(--rg-olive-5);
  min-width: 0;
}

.lp26-eac-sync-compare__card-icon-wrap {
  width: 108px;
  height: 108px;
  overflow: hidden;
  flex-shrink: 0;
}

img.lp26-eac-sync-compare__card-icon {
  width: 108px;
  height: 108px;
  display: block;
}

.lp26-eac-sync-compare__card-text {
  display: flex;
  flex-direction: column;
  gap: var(--rg-space-3);
}

.lp26-eac-sync-compare__card-heading {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 600;
  font-size: var(--rg-fs-h5);     /* 20 */
  line-height: var(--rg-lh-h5);   /* 24 */
  letter-spacing: 0;
  color: var(--rg-neutral-12);
}

.lp26-eac-sync-compare__card-body {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 400;
  font-size: var(--rg-fs-b1);
  line-height: var(--rg-lh-b1);
  letter-spacing: var(--rg-ls-body);
  color: var(--rg-color-muted);
}

/* ─────────────────────────────────────────────────────────
   6. Activity Capture Platform (gradient card with diagram)
   Figma: 1844:5869 — 1200×480 gradient card.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-capture {
  background-color: var(--rg-white);
  padding: 100px var(--rg-space-8);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lp26-eac-sync-capture__card {
  width: 1200px;
  max-width: 100%;
  height: 480px;
  border: 1px solid var(--rg-olive-3);
  background: linear-gradient(143.12deg, var(--rg-white) 50.043%, var(--rg-accent-3) 88.331%);
  display: flex;
  align-items: center;
  overflow: hidden;
}

.lp26-eac-sync-capture__copy {
  flex: 1 0 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--rg-space-6);
  padding: var(--rg-space-9);
  min-width: 0;
}

.lp26-eac-sync-capture__title {
  margin: 0;
  font-family: var(--rg-font-heading);
  font-weight: var(--rg-fw-medium);  /* Figma: Heading/Desktop/H3/Medium = 500 */
  font-size: 32px;
  line-height: 34px;
  letter-spacing: 0;
  color: var(--rg-accent-12);
}

.lp26-eac-sync-capture__title em,
.lp26-eac-sync-capture__title i {
  font-style: italic;
  color: var(--rg-accent-9);
  font-weight: inherit;
}

.lp26-eac-sync-capture__desc {
  margin: 0;
  font-family: var(--rg-font-body);
  font-weight: 400;
  font-size: var(--rg-fs-b1);
  line-height: var(--rg-lh-b1);
  letter-spacing: var(--rg-ls-body);
  color: var(--rg-color-muted);
}

a.lp26-eac-sync-capture__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rg-space-2);
  height: 32px;
  padding: 0 var(--rg-space-3);
  background-color: var(--rg-neutral-12);
  color: var(--rg-white);
  font-family: var(--rg-font-body);
  font-weight: 500;
  font-size: var(--rg-fs-b2);    /* 14 */
  line-height: var(--rg-lh-b2);  /* 20 */
  letter-spacing: var(--rg-ls-body);
  border-radius: var(--rg-radius-1);
  text-decoration: none;
  transition: background-color 0.15s ease;
}

a.lp26-eac-sync-capture__cta:hover,
a.lp26-eac-sync-capture__cta:focus {
  background-color: #2d3339;
  color: var(--rg-white);
  text-decoration: none;
}

.lp26-eac-sync-capture__illustration {
  width: 600px;
  height: 480px;
  flex-shrink: 0;
  position: relative;
}

img.lp26-eac-sync-capture__illustration-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* ─────────────────────────────────────────────────────────
   7. Closing CTA (dark band)
   Figma: 874:2498 — dark green section, centered title,
   green primary button, badges row below.
   ───────────────────────────────────────────────────────── */
.lp26-eac-sync-cta {
  background-color: var(--rg-accent-12);
  padding: 120px;
}

.lp26-eac-sync-cta__inner {
  width: 1200px;
  max-width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 104px;
}

.lp26-eac-sync-cta__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--rg-space-9);
  width: 100%;
}

.lp26-eac-sync-cta__title {
  margin: 0;
  width: 728px;
  max-width: 100%;
  text-align: center;
  font-family: var(--rg-font-heading);
  font-weight: 400;
  font-size: var(--rg-fs-h2);
  line-height: var(--rg-lh-h2);
  letter-spacing: 0;
  color: var(--rg-white);
}

.lp26-eac-sync-cta__title em,
.lp26-eac-sync-cta__title i {
  font-style: italic;
  color: var(--rg-accent-8);
  font-weight: inherit;
}

a.lp26-eac-sync-cta__button {
  /* Figma button label tracking is -0.5 (body), not the default
   * lp26-btn --rg-ls-ui (-0.1) used elsewhere. */
  letter-spacing: var(--rg-ls-body);
}

.lp26-eac-sync-cta__badges {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25.211px;
  flex-wrap: wrap;
}

img.lp26-eac-sync-cta__badge {
  height: 68px;
  width: auto;
  display: block;
}

img.lp26-eac-sync-cta__badge--aicpa {
  height: 68px;
  width: auto;
}

/* ─────────────────────────────────────────────────────────
   Mobile (≤ 900px)
   Figma: 2460:16099 — same composition as desktop, but tighter
   side padding, smaller H1, and the badges row collapses to a
   small-gap inline strip that fits the 358px content width.
   This block was missing entirely so desktop padding/sizes
   were leaking to mobile, breaking the section visually.
   ───────────────────────────────────────────────────────── */
@media (max-width: 900px) {

    /* Hero — Figma 949:5530 (heading block) + 2012:3949 (illustration).
       Stacks the 50/50 desktop split into content-on-top, illustration
       below. Section's --rg-olive-2 flows through the heading half;
       illustration-col keeps its radial gradient. */
    .lp26-eac-sync-hero__inner {
        flex-direction: column;
    }

    .lp26-eac-sync-hero__content-col {
        /* Figma 949:5530: py-9 (64) px-4 (16), items-center, text-center.
           Desktop's invisible 1px olive-1 border isn't in the mobile frame. */
        padding: var(--rg-space-9) var(--rg-space-4);
        border: 0;
        align-items: center;
        text-align: center;
        min-height: 0;
    }

    .lp26-eac-sync-hero__heading-block {
        /* Figma 949:5533 — title→desc gap is 20px, between --rg-space-4
           (16) and --rg-space-5 (24); no token at this step. */
        gap: 20px;
    }

    .lp26-eac-sync-hero__heading {
        /* Figma: Heading/Mobile/H1/Regular — Playfair 36/38, ls 0.
           Matches the raw values used in .lp26-eac-sync-cta__title mobile. */
        font-size: 36px;
        line-height: 38px;
        letter-spacing: 0;
    }

    .lp26-eac-sync-hero__cta {
        align-self: center;
    }

    .lp26-eac-sync-hero__illustration-col {
        min-height: 0;
        /* Aspect ratio from Figma 2012:3949 (390 × 530.4). */
        aspect-ratio: 390 / 530;
    }

    img.lp26-eac-sync-hero__illustration {
        position: static;
        width: 100%;
        height: 100%;
    }

    /* Benefit cards — Figma 949:8499 (390-wide column).
       Three cards stack into a single column with 8px gap on the
       section's --rg-olive-2 bg; card visuals (border, padding,
       typography) are unchanged from desktop and match Figma mobile. */
    .lp26-eac-sync-benefits {
        padding: var(--rg-space-9) var(--rg-space-4);
    }

    .lp26-eac-sync-benefits__grid {
        grid-template-columns: 1fr;
    }

    /* Feature rows — Figma 949:9943.
       Three issues need a variant-scoped override at mobile:
       1. The all-viewports .lp26-eac-features--eac-sync padding override
          (rg-space-8) outranks the shared mobile rule (rg-space-4).
       2. Shared EAC mobile rule sets title color to neutral-12; eac-sync
          Figma 949:9945 keeps it on rg-green/12 (--rg-accent-12).
       3. Image col on mobile must be a 1:1 square (Figma 358×358);
          inherited min-height + cover was cropping the 1200×1200 PNGs. */
    .lp26-eac-features--eac-sync {
        padding-left: var(--rg-space-4);
        padding-right: var(--rg-space-4);
    }

    .lp26-eac-features--eac-sync .lp26-eac-features__title {
        color: var(--rg-accent-12);
    }

    /* Rows container — Figma 949:9947 wraps each row as a separate
       bordered card on the section's --rg-olive-1 bg, with 64px gap
       between cards. Undo desktop's border-collapse trick (negative
       margins) so cards sit fully separated. */
    .lp26-eac-features--eac-sync .lp26-eac-features__rows {
        gap: var(--rg-space-9); /* 64px */
    }

    .lp26-eac-features--eac-sync .lp26-eac-features__row + .lp26-eac-features__row {
        margin-top: 0;
    }

    .lp26-eac-features--eac-sync .lp26-eac-features__row--text-left .lp26-eac-features__image-col,
    .lp26-eac-features--eac-sync .lp26-eac-features__row--text-right .lp26-eac-features__text-col {
        margin-left: 0;
    }

    /* Card stacking order — Figma 949:9948: image on top, text below
       on every row, regardless of the desktop alternation modifier.
       Beats the EAC shared mobile rule that places text first. */
    .lp26-eac-features--eac-sync .lp26-eac-features__row .lp26-eac-features__image-col,
    .lp26-eac-features--eac-sync .lp26-eac-features__row--text-right .lp26-eac-features__image-col {
        order: 1;
    }

    .lp26-eac-features--eac-sync .lp26-eac-features__row .lp26-eac-features__text-col,
    .lp26-eac-features--eac-sync .lp26-eac-features__row--text-right .lp26-eac-features__text-col {
        order: 2;
    }

    /* Image col — square 1:1 (Figma 1785:2108 = 358×358) with full
       --rg-olive-3 border (overrides the EAC mobile olive-4 partial
       border). The bottom edge becomes the divider seam with text-col. */
    .lp26-eac-features--eac-sync .lp26-eac-features__image-col {
        min-height: 0;
        aspect-ratio: 1 / 1;
        border: 1px solid var(--rg-olive-3);
    }

    /* Text col — Figma 949:10052: px-4 py-7 (16/40), items-center.
       Three borders only; image-col's bottom border serves as the seam. */
    .lp26-eac-features--eac-sync .lp26-eac-features__text-col {
        padding: var(--rg-space-7) var(--rg-space-4); /* 40 16 */
        align-items: center;
        gap: var(--rg-space-6); /* 32 — Figma 949:10053 gap-32 */
        border: 1px solid var(--rg-olive-3);
        border-top: none;
    }

    /* Stats — Figma 949:12383.
       Section squeezes to px-4, title shrinks to mobile-H3, emblem
       scales down, and the badges + cell rows both flip to vertical
       stacks (Figma 949:12397 + 949:12476). */
    .lp26-eac-sync-stats {
        padding: 108px var(--rg-space-4);
    }

    .lp26-eac-sync-stats__title {
        /* Figma 949:12383 — Heading/Mobile/H2/Regular = 32/34, ls 0. */
        width: auto;
        font-size: var(--rg-fs-mobile-h2);
        line-height: var(--rg-lh-mobile-h2);
    }

    img.lp26-eac-sync-stats__emblem {
        /* Figma 949:12385 — emblem scales to 103.628 × 81 on mobile. */
        width: 103.628px;
        height: 81px;
    }

    .lp26-eac-sync-stats__badges {
        /* Figma 949:12397 — badges stack vertically, gap-28.444. */
        flex-direction: column;
        gap: 28.444px;
    }

    .lp26-eac-sync-stats__row {
        /* Figma 949:12476 — cells stack vertically, no row gap (each
           cell carries its own py-6 = 32px vertical padding). */
        flex-direction: column;
        width: auto;
    }

    .lp26-eac-sync-stats__cell {
        /* Figma 949:12477 — py-6 only (no horizontal padding); the
           section's px-4 supplies the side gutter. */
        padding: var(--rg-space-6) 0;
    }

    /* Compare block — Figma 958:1292 ─────────────────────────── */
    .lp26-eac-sync-compare {
        /* py-100 px-16 */
        padding: 100px var(--rg-space-4);
    }

    .lp26-eac-sync-compare__header {
        /* Stack header column then CTA, gap 32. */
        flex-direction: column;
        align-items: flex-start;
        gap: var(--rg-space-6);
        width: auto;
    }

    .lp26-eac-sync-compare__heading-col {
        width: 100%;
    }

    .lp26-eac-sync-compare__eyebrow {
        /* Figma 958:1306 — Heading/Mobile/H5/Regular = 20/24. */
        font-size: var(--rg-fs-h5);
        line-height: var(--rg-lh-h5);
    }

    .lp26-eac-sync-compare__title {
        /* Figma 958:1307 — Heading/Mobile/H3/Medium = 28/30 Playfair.
           Scoped here pending a systemic check on --rg-fs-mobile-h3
           (currently 24/24 in v5). */
        font-size: 28px;
        line-height: 30px;
    }

    .lp26-eac-sync-compare__cards {
        /* Figma 1785:2266 — cards stack vertically, gap-2 (8). */
        flex-direction: column;
        width: auto;
    }

    /* Capture diagram — Figma 1903:3334 ─────────────────────── */
    .lp26-eac-sync-capture {
        /* py-80 px-16 (was 100/48 desktop) */
        padding: 80px var(--rg-space-4);
    }

    .lp26-eac-sync-capture__card {
        /* Stack copy then illustration; mobile gradient angle differs. */
        flex-direction: column;
        align-items: stretch;
        height: auto;
        padding: 0 var(--rg-space-4);
        background: linear-gradient(105.48deg, var(--rg-white) 50.043%, var(--rg-accent-3) 88.331%);
    }

    .lp26-eac-sync-capture__copy {
        /* Container provides px-16; copy keeps py-48 only. */
        flex: 0 0 auto;
        height: auto;
        padding: var(--rg-space-8) 0;
        width: 100%;
    }

    .lp26-eac-sync-capture__illustration {
        /* Figma: 326×357 inside ~358 container — fill width, hold ratio. */
        width: 100%;
        height: auto;
        aspect-ratio: 326 / 357;
    }

    .lp26-eac-sync-cta {
        /* Figma: 120 top/bottom, 16 sides (358 inside 390). */
        padding: 120px var(--rg-space-4);
    }

    .lp26-eac-sync-cta__inner {
        width: auto;
        max-width: 100%;
        /* Figma 949:5719 — gap 64 (--rg-space-9) between title-block and badges. */
        gap: var(--rg-space-9);
    }

    .lp26-eac-sync-cta__head {
        gap: var(--rg-space-9);
    }

    .lp26-eac-sync-cta__title {
        /* Figma 949:5721 — Heading/Blog Mobile/Display/Regular = 32/34
           (smaller than the hero's Mobile/H1 which is 36/38). */
        width: auto;
        max-width: 100%;
        font-size: var(--rg-fs-mobile-h2); /* 32 — same metric */
        line-height: var(--rg-lh-mobile-h2); /* 34 */
    }

    .lp26-eac-sync-cta__badges {
        /* Figma 949:5723 — items-center, justify-between, w-full. */
        justify-content: space-between;
        gap: 0;
        flex-wrap: nowrap;
        width: 100%;
    }

    img.lp26-eac-sync-cta__badge,
    img.lp26-eac-sync-cta__badge--aicpa {
        /* Figma 51.658×59.434 (G2) and 60.266×60.388 (AICPA) → height ~60. */
        height: 60px;
    }
}
