.bg-mctb-hero {
  
  /* Hero01 owns the section grid, heading, copy scale and CTA styling. */
  .bg-mctb-hero__marker {
    min-inline-size: 0;
    min-block-size: 0;
  }

  .bg-mctb-hero__benefits {
    list-style: none;
    padding: 0;
    display: grid;
    gap: var(--space-xs);
    margin-block: 0 var(--space-m);
    font-size: var(--text-m);
    font-weight: 500;
  }

  .bg-mctb-hero__benefit {
    display: flex;
    align-items: flex-start;
    gap: var(--space-xs);
  }

  .bg-mctb-hero__benefit > .bg-mctb-hero__glyph {
    color: var(--relative-link-color, var(--primary));
    margin-block-start: 0.1em;
  }

  .bg-mctb-hero__lead {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-mctb-hero__offer {
    margin-block-end: var(--space-m);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-s) var(--space-m);
  }

  .bg-mctb-hero__client-price {
    inline-size: auto;
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  .bg-mctb-hero__amount {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h1);
    font-weight: var(--heading-font-weight);
    line-height: 1;
    letter-spacing: var(--heading-letter-spacing);
  }

  .bg-mctb-hero__price-label,
  .bg-mctb-hero__standard-price {
    font-size: var(--text-s);
    line-height: 1.4;
  }

  .bg-mctb-hero__standard-price {
    inline-size: auto;
    padding-inline-start: var(--space-m);
    border-inline-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-mctb-hero__included {
    margin-block: var(--space-s) var(--space-m);
    font-size: var(--text-s);
    font-weight: 600;
  }

  .bg-mctb-hero__terms {
    max-inline-size: 65ch;
    margin-block-start: var(--space-s);
    font-size: var(--text-s);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-mctb-hero__visual {
    container: mctb-visual / inline-size;
    inline-size: min(100%, 36rem);
    min-inline-size: 0;
    justify-self: center;
    /* Remove the browser's default figure indentation. */
    margin: 0;
  }

  .bg-mctb-hero__scene {
    position: relative;
    isolation: isolate;
    min-block-size: 0;
    grid-template-columns: minmax(0, 1fr);
    display: grid;
    align-items: start;
    justify-items: center;
    padding-block: var(--space-m) calc(var(--space-xxl) + var(--space-m));
  }

  .bg-mctb-hero__scene::before,
  .bg-mctb-hero__scene::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    translate: -50% -50%;
    inline-size: 100%;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    background: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 6%, transparent);
  }

  .bg-mctb-hero__scene::after { inline-size: 76%; }

  .bg-mctb-hero__phone {
    inline-size: 65%;
    grid-column: 1 / -1;
    padding: calc(var(--space-xs) / 2);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-s) var(--space-l) color-mix(in srgb, var(--base) 24%, transparent);
  }

  .bg-mctb-hero__screen {
    display: flex;
    flex-direction: column;
    min-block-size: 33rem;
    border-radius: inherit;
    overflow: hidden;
    font-size: var(--text-s);
    line-height: 1.45;
  }

  .bg-mctb-hero__phone-header {
    color: var(--relative-heading-color, var(--heading-color));
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    display: grid;
    justify-items: center;
    gap: calc(var(--space-xs) / 2);
    padding: var(--space-m) var(--space-s) var(--space-s);
  }

  .bg-mctb-hero__avatar,
  .bg-mctb-hero__icon {
    display: inline-grid;
    place-items: center;
    flex: none;
    inline-size: 2.4em;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    font-weight: 700;
  }

  .bg-mctb-hero__messages {
    display: grid;
    gap: var(--space-xs);
    padding: var(--space-s);
  }

  .bg-mctb-hero__timestamp {
    text-align: center;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-xs);
  }

  .bg-mctb-hero__message {
    max-inline-size: 94%;
    padding: var(--space-xs);
    border-radius: var(--radius);
  }

  .bg-mctb-hero__reply {
    color: var(--relative-heading-color, var(--heading-color));
    justify-self: end;
  }

  .bg-mctb-hero__glyph {
    inline-size: 1.4em;
    block-size: 1.4em;
    flex: none;
  }

  .bg-mctb-hero__card {
    position: absolute;
    padding: var(--space-s);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in srgb, var(--base) 16%, transparent);
    font-size: var(--text-s);
    line-height: 1.4;
  }

  .bg-mctb-hero__missed,
  .bg-mctb-hero__sent,
  .bg-mctb-hero__inbox-heading {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  .bg-mctb-hero__missed {
    color: var(--relative-heading-color, var(--heading-color));
    inset-inline-start: calc(var(--space-m) * -1);
    inset-block-start: var(--space-xl);
    inline-size: 45%;
    max-inline-size: 45%;
  }

  .bg-mctb-hero__copy { display: grid; gap: 0.2em; }
  .bg-mctb-hero__small { font-size: var(--text-xs); color: var(--relative-text-color, var(--text-color)); }

  .bg-mctb-hero__sent {
    inset-inline-end: calc(var(--space-l) * -1);
    inset-block-start: calc(var(--space-xxl) + var(--space-xs));
    inline-size: 48%;
    max-inline-size: 48%;
    font-weight: 600;
  }

  .bg-mctb-hero__sent > .bg-mctb-hero__glyph { color: var(--relative-link-color, var(--primary)); }

  .bg-mctb-hero__inbox {
    inset-inline-end: calc(var(--space-m) * -1);
    inset-block-end: 0;
    inline-size: 58%;
    display: grid;
    gap: var(--space-xs);
  }

  .bg-mctb-hero__inbox-heading {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
  }

  .bg-mctb-hero__badge {
    justify-self: start;
    padding: calc(var(--space-xs) / 2) var(--space-xs);
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 600;
  }

  .bg-mctb-hero__note {
    inset-inline-end: 0;
    inset-block-start: 0;
    inline-size: 54%;
    max-inline-size: 54%;
    font-family: var(--font-handwritten);
    font-size: calc(var(--text-l) * 1.1);
    font-weight: 600;
    line-height: 1.15;
    rotate: 4deg;
  }

  .bg-mctb-hero__caption {
    padding-block-start: var(--space-s);
    text-align: center;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-xs);
  }

  /* Hero01 controls section stacking. Narrow artwork becomes an ordered flow. */
  @container mctb-visual (inline-size < 26rem) {
    .bg-mctb-hero__scene { grid-template-columns: minmax(0, 1fr); min-block-size: 0; gap: var(--space-s); padding-block: var(--space-s); }
    .bg-mctb-hero__phone { inline-size: min(100%, 22rem); order: 2; }
    .bg-mctb-hero__screen { min-block-size: 0; }
    .bg-mctb-hero__card { position: static; inline-size: min(100%, 22rem); max-inline-size: 100%; }
    .bg-mctb-hero__missed { order: 1; }
    .bg-mctb-hero__sent { order: 3; }
    .bg-mctb-hero__inbox { order: 4; }
    .bg-mctb-hero__note { display: none; }
  }

  @container (inline-size < 24rem) {
    .bg-mctb-hero__offer { gap: var(--space-s); }
    .bg-mctb-hero__standard-price { padding-inline-start: var(--space-s); }
  }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-mctb-hero__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-mctb-hero__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

/* The shared custom-hero motion layer supplies the grid and glow. */
.bg-mctb-hero__scene::before, .bg-mctb-hero__scene::after { content: none; }
.bg-mctb-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }
.bg-mctb-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }

.bg-mctb-hero__avatar.surface-primary, .bg-mctb-hero__sent > .bg-mctb-hero__glyph { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-reviews-maths {
  
/* General Section owns the 45/55 introduction/content layout and its existing 64rem stacking behaviour. */
  display: grid;
  gap: var(--space-m);
  min-inline-size: 0;
  margin: 0;
  container: reviews-maths / inline-size;
  &.bg-reviews-maths__figure { gap: var(--space-s); }
  .bg-reviews-maths__description, &.bg-reviews-maths__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-reviews-maths__comparison { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: var(--space-xs); }
  .bg-reviews-maths__value-card { min-inline-size: 0; display: grid; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }
  .bg-reviews-maths__value-label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 600; text-transform: uppercase; line-height: 1.3; }
  .bg-reviews-maths__value { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25em; color: var(--relative-heading-color, var(--heading-color)); font-size: calc(var(--h4) * 1.125); line-height: 1.2; }
  .bg-reviews-maths__per-month { font-size: var(--text-m); font-weight: 400; }
  .bg-reviews-maths__versus { align-self: center; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; }
  .bg-reviews-maths__caption { color: var(--relative-link-color, var(--primary)); font-family: var(--font-handwritten); font-size: calc(var(--text-l) * 1.1); font-weight: 600; font-style: normal; line-height: 1.2; inline-size: fit-content; max-inline-size: 100%; justify-self: start; rotate: -3deg; translate: 0 var(--space-s); }
  .bg-reviews-maths__search-panel { overflow: hidden; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-2); }
  .bg-reviews-maths__search-bar { display: flex; align-items: center; gap: var(--space-xs); margin: var(--space-s) var(--space-m); padding: var(--space-xs) var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 24%, transparent); border-radius: var(--radius); background: var(--bg-ultra-light); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); }
  .bg-reviews-maths__search-icon { display: block; flex: none; inline-size: 1.25em; block-size: 1.25em; color: var(--relative-text-color, var(--text-color)); }
  .bg-reviews-maths__results { display: grid; gap: var(--space-s); list-style: none; margin: 0; padding: var(--space-m); }
  .bg-reviews-maths__result { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: var(--space-s); padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); border-radius: var(--radius); }
  .bg-reviews-maths__result--featured { border: 2px solid var(--relative-link-color, var(--primary)); }
  .bg-reviews-maths__avatar { display: grid; place-items: center; inline-size: 2.25em; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-maths__business { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-reviews-maths__business-name { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.3; }
  .bg-reviews-maths__rating { display: flex; flex-wrap: wrap; align-items: center; gap: .4em; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-reviews-maths__rating-value { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }
  .bg-reviews-maths__stars { display: inline-flex; gap: .1em; color: var(--bg-review-stars-color); }
  .bg-reviews-maths__star { display: block; inline-size: 1em; block-size: 1em; fill: currentColor; }
  .bg-reviews-maths__star--muted { color: var(--neutral-light); }
  .bg-reviews-maths__result-note { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  /* These Call labels belong to the illustration and are deliberately not interactive controls. */
  .bg-reviews-maths__call { align-self: center; padding: .45em .7em; border: 1px solid transparent; border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; line-height: 1.2; }
  .bg-reviews-maths__call--outline { color: var(--relative-text-color, var(--text-color)); border-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 24%, transparent); }
  .bg-reviews-maths__example-note { padding: 0 var(--space-m) var(--space-s); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); text-align: end; }
  @container reviews-maths (inline-size < 30rem) {
    .bg-reviews-maths__results { padding: var(--space-s); }
    .bg-reviews-maths__search-bar { margin-inline: var(--space-s); }
    .bg-reviews-maths__result { gap: var(--space-xs); }
  }
  @container reviews-maths (inline-size < 23rem) {
    .bg-reviews-maths__comparison { grid-template-columns: minmax(0, 1fr); }
    .bg-reviews-maths__versus { justify-self: center; }
    .bg-reviews-maths__result { grid-template-columns: auto minmax(0, 1fr); }
    .bg-reviews-maths__call { grid-column: 2; justify-self: start; }
  }

}
.bg-reviews-website {
  
/* General Section owns the 45/55 layout and stacks it below 64rem. */
  display: grid;
  gap: var(--space-s);
  min-inline-size: 0;
  margin: 0;
  container: reviews-website / inline-size;
  &.bg-reviews-website__copy { gap: var(--space-m); container-type: normal; }
  .bg-reviews-website__lead { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.4; }
  .bg-reviews-website__description { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-reviews-website__actions { display: flex; flex-wrap: wrap; }
  .bg-reviews-website__caption { color: var(--relative-link-color, var(--primary)); font-family: var(--font-handwritten); font-size: calc(var(--text-l) * 1.1); font-weight: 600; font-style: normal; line-height: 1.2; inline-size: fit-content; max-inline-size: 100%; justify-self: end; rotate: -3deg; translate: 0 var(--space-s); }
  .bg-reviews-website__browser { overflow: hidden; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-2); }
  .bg-reviews-website__browser-bar { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs); }
  .bg-reviews-website__window-dots { display: flex; gap: .35rem; flex-shrink: 0; }
  .bg-reviews-website__window-dot { min-inline-size: 0; min-block-size: 0; inline-size: .55rem; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-reviews-website__address { min-inline-size: 0; flex: 1; padding: .35em .65em; border-radius: var(--radius); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); overflow-wrap: anywhere; }
  .bg-reviews-website__site-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-s); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-reviews-website__brand { color: var(--relative-link-color, var(--primary)); font-size: var(--text-m); }
  .bg-reviews-website__nav { display: flex; flex-wrap: wrap; gap: var(--space-xs); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-reviews-website__site-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-m); padding: var(--space-s); }
  .bg-reviews-website__service { display: grid; gap: var(--space-xs); }
  .bg-reviews-website__service-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); font-weight: 700; line-height: 1.3; }
  .bg-reviews-website__placeholder { min-block-size: 0; inline-size: 70%; block-size: .45rem; border-radius: var(--radius); background: var(--neutral-ultra-light); }
  .bg-reviews-website__placeholder--short { inline-size: 52%; }
  .bg-reviews-website__widget { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); border: 2px solid var(--primary); border-radius: var(--radius); }
  .bg-reviews-website__widget-label { position: absolute; inset-block-start: 0; inset-inline-start: var(--space-s); transform: translateY(-50%); padding: .3em .65em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-website__rating { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); }
  .bg-reviews-website__rating-value { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.2; }
  .bg-reviews-website__rating-source { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-reviews-website__stars { display: inline-flex; gap: .1em; color: var(--bg-review-stars-color); }
  .bg-reviews-website__star { display: block; inline-size: 1em; block-size: 1em; fill: currentColor; }
  .bg-reviews-website__reviews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xs); }
  .bg-reviews-website__review { display: flex; flex-direction: column; gap: var(--space-xs); min-inline-size: 0; padding: var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); }
  .bg-reviews-website__quote { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-reviews-website__author { margin-block-start: auto; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 600; }
  /* These labels are part of the illustration, not working website controls. */
  .bg-reviews-website__site-actions { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
  .bg-reviews-website__sample-action { padding: .6em .8em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; }
  @container reviews-website (inline-size < 32rem) {
    .bg-reviews-website__reviews { grid-template-columns: minmax(0, 1fr); }
    .bg-reviews-website__site-body, .bg-reviews-website__widget { padding: var(--space-s); }
  }

}
.bg-mctb-cta {
  display: grid;
  justify-items: center;
  gap: var(--space-s);
  text-align: center;
  .bg-mctb-cta__actions { display: flex; justify-content: center; inline-size: 100%; }
  .bg-mctb-cta__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs) var(--space-m); list-style: none; padding-inline-start: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; }
  .bg-mctb-cta__terms { max-inline-size: 75ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-mctb-cta__terms a { color: var(--relative-link-color, var(--link-color)); text-decoration: underline; text-underline-offset: .16em; }
  .bg-mctb-cta__terms a:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: .2em; }
  @container (inline-size < 36rem) {
    .bg-mctb-cta__actions .bg-button-wrap, .bg-mctb-cta__actions .bg-button { inline-size: 100%; }
    .bg-mctb-cta__actions .bg-button { justify-content: center; }
  }
}
.bg-hero {
    /* One item type scale shared by Dashboard, Summary, Checklist and Process. */
  --bg-hero-item-title-size: var(--text-m);
  --bg-hero-item-headline-size: calc(var(--text-s) * 1.16);
  --bg-hero-item-note-size: calc(var(--text-s) * 1.08);

/* Hero layout and visual styles. Shared icons are styled by the Icon component. */

  --bg-hero-content-heading: var(--relative-heading-color, var(--heading-color));
  --bg-hero-content-text: var(--relative-text-color, var(--text-color));
  --bg-hero-content-muted: var(--relative-text-color, var(--text-color));
  --bg-hero-accent: var(--bg-brand-accent, var(--primary));
  --bg-hero-accent-surface: var(--bg-primary-soft);
  --bg-hero-accent-text: var(--relative-link-color, var(--primary));
  --bg-hero-accent-border: var(--primary-light);
  --bg-hero-accent-solid-surface: var(--relative-link-color, var(--primary));
  --bg-hero-accent-solid-text: var(--bg-accent-on-solid, var(--text-light));
  --bg-hero-accent-solid-border: var(--relative-link-color, var(--primary));
  --bg-hero-content-min: 0;
  --bg-hero-content-share: 1.5fr;
  --bg-hero-visual-min: 18rem;
  --bg-hero-visual-share: 1fr;
  --bg-hero-shell-radius: var(--radius);
  --bg-hero-shell-padding: var(--space-l);
  --bg-hero-shell-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 10%, transparent);
  --bg-hero-title-size: var(--h1);
  --bg-hero-title-measure: 100%;
  --bg-hero-title-accent-shadow: none;
  --bg-hero-title-accent-highlight: transparent;
  --bg-hero-title-accent-highlight-border: transparent;
  --bg-hero-lede-gap-before: var(--space-s);
  --bg-hero-lede-gap-after: var(--space-m);
  --bg-hero-actions-gap-before: var(--space-m);
  --bg-hero-content-max: 52rem;
  --bg-hero-standalone-content-max: 64rem;
  --bg-hero-inner-max: 88rem;
  --bg-hero-card-radius: var(--radius);
  --bg-hero-visual-standard-size: 36rem;
  --bg-hero-visual-compact-size: 30rem;
  --bg-hero-visual-circle-compact-size: 24rem;
  --bg-hero-visual-mobile-size: 19.5rem;
  --bg-hero-visual-narrow-size: 15.5rem;
  --bg-hero-visual-standard-aspect: 1.28 / 1;
  --bg-hero-visual-compact-aspect: 1.28 / 1;
  --bg-hero-image-curve-radius: var(--radius);
  --bg-hero-background-min-block-size: auto;
  --bg-hero-background-layout-min-block-size: 0;

  container-type: inline-size;

  .bg-hero__inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-l);
    inline-size: min(100%, var(--bg-hero-inner-max));
    margin-inline: auto;
  }

  .bg-hero__layout {
    display: grid;
    min-inline-size: 0;
    grid-template-columns: minmax(var(--bg-hero-content-min), var(--bg-hero-content-share)) minmax(var(--bg-hero-visual-min), var(--bg-hero-visual-share));
    align-items: center;
    gap: var(--space-xl);
  }

  .bg-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    max-inline-size: var(--bg-hero-content-max);
    color: var(--bg-hero-content-text);
  }

  .bg-hero__title {
    margin: 0;
    padding: 0;
    max-inline-size: var(--bg-hero-title-measure);
    color: var(--bg-hero-content-heading);
    font-family: var(--heading-font-family);
    font-size: var(--bg-hero-title-size);
    font-weight: var(--heading-font-weight);
    line-height: var(--heading-line-height);
    letter-spacing: var(--heading-letter-spacing);
    text-transform: var(--heading-text-transform);
    text-wrap: var(--heading-text-wrap);
  }

  .bg-hero__eyebrow {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.5rem;
    inline-size: fit-content;
    max-inline-size: 100%;
    box-sizing: border-box;
    margin: 0 0 var(--space-xs);
    padding: 0.375rem 0.875rem;
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
    word-spacing: normal;
  }

  .bg-hero__eyebrow-dot {
    min-inline-size: 0;
    min-block-size: 0;
    inline-size: 0.375rem;
    block-size: 0.375rem;
    flex: 0 0 auto;
    margin-block-start: calc((var(--text-s) * 1.2 - 0.375rem) / 2);
    border-radius: var(--radius-50);
    background: currentColor;
  }

  .bg-hero__eyebrow-text {
    display: block;
    min-inline-size: 0;
    letter-spacing: inherit;
    text-transform: uppercase;
    word-spacing: inherit;
    overflow-wrap: break-word;
  }

  .bg-hero__eyebrow-text::first-letter {
    text-transform: uppercase;
  }

  &.bg-hero--eyebrow-plain .bg-hero__eyebrow {
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--bg-hero-accent);
    box-shadow: none;
  }

  &.bg-hero--eyebrow-plain .bg-hero__eyebrow-dot {
    display: none;
  }

  .bg-hero__lede {
    max-inline-size: 38rem;
    margin: var(--bg-hero-lede-gap-before) 0 var(--bg-hero-lede-gap-after);
    color: var(--bg-hero-content-text);
    font-size: var(--text-m);

    & :where(figure) {
      margin-inline: 0;
    }

    & :where(img, video, iframe) {
      display: block;
      max-inline-size: 100%;
    }

    & :where(img, video) {
      block-size: auto;
    }
  }

  .bg-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-s);
    margin-block-start: 0;
  }

  .bg-hero__actions :where(.bg-button) {
    min-block-size: 3rem;
    padding-inline: var(--space-m);
    font-size: var(--text-m);
  }

  .bg-hero__title + .bg-hero__actions {
    margin-block-start: var(--bg-hero-actions-gap-before);
  }

  .bg-hero__compact-trust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-s);
    margin-block-start: var(--space-s);
    color: var(--bg-hero-content-text);
    font-size: var(--text-m);
  }

  .bg-hero__compact-trust-item {
    display: inline-flex;
    align-items: flex-start;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-hero__compact-trust-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 1.15em;
    inline-size: 1.15em;
    block-size: 1.15em;
    aspect-ratio: 1;
    border: 1px solid currentColor;
    border-radius: var(--radius-circle);
    color: var(--bg-hero-accent);
    font-size: 1em;
    font-weight: 700;
    line-height: 1;
    margin-block-start: 0.05em;
  }

  .bg-hero__compact-trust-icon::before {
    content: '\2713';
    font-size: 0.72em;
    line-height: 1;
    transform: translateY(-0.03em);
  }

  .bg-hero__stars {
    color: var(--bg-review-stars-color, var(--bg-brand-accent, var(--primary)));
    letter-spacing: 0.08em;
  }

  .bg-hero__stars:empty::before {
    content: '\2605\2605\2605\2605\2605';
  }

  .bg-hero__visual {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  .bg-hero__background {
    display: none;
  }

  .bg-hero__visual-shell {
    box-sizing: border-box;
    overflow: hidden;
    inline-size: min(100%, var(--bg-hero-visual-standard-size));
    max-inline-size: var(--bg-hero-visual-standard-size);
    min-block-size: 0;
    aspect-ratio: var(--bg-hero-visual-standard-aspect);
    padding: var(--bg-hero-shell-padding);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--bg-hero-shell-radius);
    background: var(--bg-decoration-surface, var(--body-bg-color));
    box-shadow: var(--bg-hero-shell-shadow);
  }

  .bg-hero__visual-shell--compact {
    inline-size: min(100%, var(--bg-hero-visual-compact-size));
    max-inline-size: var(--bg-hero-visual-compact-size);
    aspect-ratio: var(--bg-hero-visual-compact-aspect);
    --bg-hero-shell-padding: var(--space-m);
  }

  .bg-hero__visual-shell--image {
    min-block-size: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .bg-hero__visual-shell--dashboard,
  .bg-hero__visual-shell--checklist,
  .bg-hero__visual-shell--mini-checklist,
  .bg-hero__visual-shell--summary,
  .bg-hero__visual-shell--process {
    overflow: visible;
    padding: 0;
    border: 0;
    border-radius: var(--bg-hero-shell-radius);
    background: transparent;
    box-shadow: none;
  }

  .bg-hero__visual-panel {
    display: grid;
    inline-size: 100%;
    block-size: 100%;
    min-block-size: 0;
  }

  .bg-hero__visual-panel--dashboard,
  .bg-hero__visual-panel--checklist,
  .bg-hero__visual-panel--mini-checklist,
  .bg-hero__visual-panel--summary,
  .bg-hero__visual-panel--process,
  .bg-hero__visual-panel--image {
    gap: var(--space-s);
  }

  .bg-hero__visual-panel--image {
    block-size: 100%;
  }

  &.bg-hero--visual-image .bg-hero__visual-panel--image {
    position: relative;
    overflow: hidden;
  }

  &.bg-hero--visual-image.bg-hero--image-effect-muted img.bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-effect-muted picture.bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-effect-muted .bg-hero__visual-image:not(img):not(picture) img {
    filter: saturate(0.8) contrast(0.98);
  }

  &.bg-hero--visual-image.bg-hero--image-effect-greyscale img.bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-effect-greyscale picture.bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-effect-greyscale .bg-hero__visual-image:not(img):not(picture) img {
    filter: grayscale(1);
  }

  &.bg-hero--visual-image.bg-hero--image-background {
    --blockquote-text-color: var(--relative-heading-color, var(--heading-color));
    --bg-hero-background-wash: var(--bg-decoration-surface, var(--body-bg-color));
    --bg-hero-button-outline-surface: color-mix(in srgb, var(--bg-hero-background-wash) 14%, transparent);
    --bg-hero-button-outline-surface-hover: var(--bg-hero-content-heading);
    --bg-hero-button-outline-text: var(--bg-hero-content-heading);
    --bg-hero-button-outline-text-hover: var(--bg-hero-background-wash);
    --bg-hero-button-outline-border: color-mix(in srgb, var(--bg-hero-content-heading) 58%, transparent);
    --bg-hero-lede-gap-before: var(--space-s);
    --bg-hero-title-accent-shadow:
      0 0.08em 0.24em color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 38%, transparent),
      0 0 0.035em color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 24%, transparent);

    position: relative;
    isolation: isolate;
    inline-size: 100vw;
    width: 100vw;
    max-inline-size: none;
    max-width: none;
    margin-inline: calc(50% - 50vw);
    overflow: clip;
    min-block-size: var(--bg-hero-background-min-block-size);
    padding-inline: 0;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__inner {
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    padding-inline: var(--gutter);
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    inline-size: 100%;
    width: 100%;
    block-size: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-colour-light {
    --bg-hero-background-wash: var(--text-dark);
    --bg-hero-content-heading: var(--text-light);
    --bg-hero-content-text: var(--text-light);
    --bg-hero-content-muted: var(--text-light);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-colour-dark {
    --bg-hero-content-heading: var(--text-dark);
    --bg-hero-content-text: var(--text-dark);
    --bg-hero-content-muted: var(--text-dark);
    --bg-hero-button-outline-text-hover: var(--text-light);
    --bg-hero-title-accent-shadow:
      0 0.08em 0.24em color-mix(in srgb, var(--text-light) 34%, transparent),
      0 0 0.04em color-mix(in srgb, var(--text-dark) 26%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--eyebrow-plain .bg-hero__eyebrow {
    color: var(--bg-hero-content-text);
  }

  &.bg-hero--visual-image.bg-hero--image-background:not(.bg-hero--accent-colour-heading) {
    --bg-hero-title-accent-shadow: none;
    --bg-hero-title-accent-highlight: color-mix(in srgb, var(--bg-hero-accent-surface) 66%, transparent);
    --bg-hero-title-accent-highlight-border: color-mix(in srgb, var(--bg-hero-accent-border) 26%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-colour-dark:not(.bg-hero--accent-colour-heading) {
    --bg-hero-title-accent-highlight: color-mix(in srgb, var(--bg-hero-accent-surface) 72%, transparent);
    --bg-hero-title-accent-highlight-border: color-mix(in srgb, var(--bg-hero-accent-border) 22%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background .bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background .bg-hero__visual-image picture,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background .bg-hero__visual-image img {
    inline-size: 100%;
    max-inline-size: none;
    block-size: 100%;
    aspect-ratio: auto;
    border-radius: 0;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background .bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background .bg-hero__visual-image img {
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: var(--bg-hero-visual-image-position, center);
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__background::after {
    content: '';
    position: absolute;
    inset: 0;
    background: color-mix(in srgb, var(--bg-hero-background-wash) 34%, transparent);
    pointer-events: none;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__trustline,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust {
    --bg-hero-trustline-wash: 48%;

    position: relative;
    align-items: center;
    box-sizing: border-box;
    isolation: isolate;
    padding-block: 0.55rem;
    padding-inline: 0.8rem;
    border-block-start: 0;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust {
    inline-size: fit-content;
    max-inline-size: 100%;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust-icon {
    color: currentColor;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-subtle-wash .bg-hero__trustline,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-subtle-wash .bg-hero__compact-trust {
    --bg-hero-trustline-wash: 54%;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-wash .bg-hero__trustline,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-wash .bg-hero__compact-trust {
    --bg-hero-trustline-wash: 66%;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-strong-wash .bg-hero__trustline,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-strong-wash .bg-hero__compact-trust {
    --bg-hero-trustline-wash: 78%;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-extra-strong-wash .bg-hero__trustline,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--content-protection-extra-strong-wash .bg-hero__compact-trust {
    --bg-hero-trustline-wash: 86%;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__trustline::before,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0;
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--bg-hero-background-wash) var(--bg-hero-trustline-wash), transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bg-hero-content-text) 16%, transparent);
    -webkit-backdrop-filter: blur(7px) saturate(1.04);
    backdrop-filter: blur(7px) saturate(1.04);
    pointer-events: none;
  }

  &.bg-hero--visual-dashboard .bg-hero__visual,
  &.bg-hero--visual-checklist .bg-hero__visual,
  &.bg-hero--visual-summary .bg-hero__visual,
  &.bg-hero--visual-process .bg-hero__visual,
  &.bg-hero--visual-image .bg-hero__visual {
    justify-self: start;
  }

  .bg-hero__visual-card {
    --bg-hero-visual-surface: var(--bg-decoration-surface, var(--body-bg-color));
    --bg-hero-visual-accent: var(--bg-hero-accent);
    --bg-hero-visual-accent-text: var(--bg-hero-accent-text);
    --bg-hero-visual-accent-soft: var(--bg-hero-accent-surface);
    --bg-hero-visual-accent-solid-surface: var(--bg-hero-accent-solid-surface);
    --bg-hero-visual-accent-solid-text: var(--bg-hero-accent-solid-text);
    --bg-hero-visual-text: var(--relative-heading-color, var(--heading-color));
    --bg-hero-visual-muted: var(--relative-text-color, var(--text-color));
    --bg-hero-visual-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    --bg-hero-visual-radius: var(--radius);
    --bg-hero-visual-item-radius: var(--radius);

    box-sizing: border-box;
    display: grid;
    inline-size: 100%;
    block-size: 100%;
    min-block-size: 0;
    aspect-ratio: inherit;
    overflow: hidden;
    border: 1px solid var(--bg-hero-visual-border);
    border-radius: var(--bg-hero-visual-radius);
    box-shadow: var(--bg-hero-shell-shadow);
  }

  .bg-hero__visual-heading,
  .bg-hero__visual-footer-copy,
  .bg-hero__summary-item-copy,
  .bg-hero__process-copy {
    min-inline-size: 0;
  }

  .bg-hero__visual-kicker,
  .bg-hero__visual-title,
  .bg-hero__visual-subtitle,
  .bg-hero__visual-footer-title,
  .bg-hero__visual-footer-text {
    margin: 0;
  }

  /* Dashboard visual: cards, graphics, compact sizing and responsive layouts. */

  .bg-hero__dashboard {
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0.9rem;
    padding: clamp(0.8rem, 2.1cqi, 1rem);
  }

  .bg-hero__dashboard-card-title,
  .bg-hero__dashboard-headline,
  .bg-hero__dashboard-note,
  .bg-hero__dashboard-donut {
    margin: 0;
  }

  .bg-hero__dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: clamp(0.55rem, 1.35cqi, 0.75rem);
    min-block-size: 0;
  }

  .bg-hero__dashboard-card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    min-block-size: 0;
    overflow: hidden;
    padding: clamp(0.62rem, 1.65cqi, 0.78rem);
    border: 1px solid color-mix(in srgb, var(--bg-hero-visual-text) 16%, transparent);
    border-radius: var(--bg-hero-visual-item-radius);
    background: var(--bg-hero-visual-surface);
  }

  .bg-hero__dashboard-card--icon {
    padding-block-end: clamp(0.42rem, 1.25cqi, 0.55rem);
  }

  .bg-hero__dashboard-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-xs);
  }

  .bg-hero__dashboard-card-title {
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 800;
    line-height: 1.2;
  }

  .bg-hero__dashboard-checkmark svg {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-hero__dashboard-headline {
    margin-block-start: 0.45rem;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: 0;
  }

  .bg-hero__dashboard-card--icon .bg-hero__dashboard-headline {
    margin-block-start: 0.28rem;
  }

  .bg-hero__dashboard-note {
    margin-block-start: 0.35rem;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
  }

  .bg-hero__dashboard-card--icon .bg-hero__dashboard-note {
    margin-block-start: 0.12rem;
  }

  .bg-hero__dashboard-chart--line {
    margin-block-start: auto;
    padding-block-start: var(--space-xs);
    color: var(--bg-hero-visual-accent);
    min-block-size: 0;
  }

  .bg-hero__dashboard-chart--line svg {
    display: block;
    inline-size: 100%;
    block-size: min(2.8rem, 100%);
    overflow: visible;
  }

  .bg-hero__dashboard-line-fill {
    fill: currentColor;
    opacity: 0.12;
  }

  .bg-hero__dashboard-line {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
  }

  .bg-hero__dashboard-line-dot {
    fill: currentColor;
  }

  .bg-hero__dashboard-chart--bars {
    display: grid;
    grid-template-columns: repeat(4, minmax(1rem, 1fr));
    align-items: end;
    gap: 0.65rem;
    block-size: min(2.5rem, 100%);
    margin-block-start: auto;
    border-block-end: 1px solid var(--bg-hero-visual-border);
  }

  .bg-hero__dashboard-chart--bars span {
    display: block;
    block-size: var(--bar-height);
    min-block-size: 1.1rem;
    border-radius: var(--radius) var(--radius) 0 0;
    background: var(--bg-hero-visual-accent-soft);
  }

  .bg-hero__dashboard-chart--bars span:nth-child(1) {
    --bar-height: 24%;
    background: color-mix(in srgb, var(--bg-hero-visual-accent) 12%, var(--bg-hero-visual-surface));
  }

  .bg-hero__dashboard-chart--bars span:nth-child(2) {
    --bar-height: 46%;
    background: color-mix(in srgb, var(--bg-hero-visual-accent) 18%, var(--bg-hero-visual-surface));
  }

  .bg-hero__dashboard-chart--bars span:nth-child(3) {
    --bar-height: 70%;
    background: color-mix(in srgb, var(--bg-hero-visual-accent) 26%, var(--bg-hero-visual-surface));
  }

  .bg-hero__dashboard-chart--bars span:nth-child(4) {
    --bar-height: 95%;
    background: var(--bg-hero-visual-accent-solid-surface);
  }

  .bg-hero__dashboard-donut {
    display: grid;
    place-items: center;
    inline-size: 3.25rem;
    aspect-ratio: 1;
    margin: auto auto 0;
    color: var(--bg-hero-visual-accent);
  }

  .bg-hero__dashboard-donut svg {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    overflow: visible;
  }

  .bg-hero__dashboard-donut-track,
  .bg-hero__dashboard-donut-segment {
    fill: none;
    stroke-width: 7;
    transform: rotate(-90deg);
    transform-origin: center;
  }

  .bg-hero__dashboard-donut-track {
    stroke: color-mix(in srgb, var(--bg-hero-visual-accent) 12%, var(--bg-hero-visual-surface));
  }

  .bg-hero__dashboard-donut-segment {
    stroke-linecap: butt;
  }

  .bg-hero__dashboard-donut-segment--primary {
    stroke: currentColor;
    stroke-dasharray: 66 34;
  }

  .bg-hero__dashboard-donut-segment--soft {
    stroke: color-mix(in srgb, var(--bg-hero-visual-accent) 36%, var(--bg-hero-visual-surface));
    stroke-dasharray: 24 76;
    stroke-dashoffset: -68;
  }

  .bg-hero__dashboard-calendar {
    position: relative;
    display: grid;
    place-items: center;
    inline-size: 2.8rem;
    aspect-ratio: 1;
    margin: 0.7rem auto 0;
    border: 2px solid var(--bg-hero-visual-accent);
    border-radius: var(--radius);
    background: transparent;
    color: var(--bg-hero-visual-accent);
  }

  .bg-hero__dashboard-calendar::before {
    content: '';
    position: absolute;
    inset-block-start: 0.92rem;
    inset-inline: 0.5rem;
    border-block-start: 1px solid currentColor;
  }

  .bg-hero__dashboard-calendar-rings::before,
  .bg-hero__dashboard-calendar-rings::after {
    content: '';
    position: absolute;
    inset-block-start: -0.35rem;
    inline-size: 0.28rem;
    block-size: 0.7rem;
    border: 2px solid currentColor;
    border-radius: var(--radius-circle);
    background: var(--bg-hero-visual-surface);
  }

  .bg-hero__dashboard-calendar-rings::before {
    inset-inline-start: 0.85rem;
  }

  .bg-hero__dashboard-calendar-rings::after {
    inset-inline-end: 0.85rem;
  }

  .bg-hero__dashboard-calendar-days {
    position: absolute;
    inset-block-start: 1.18rem;
    inset-inline-start: 50%;
    display: grid;
    grid-template-columns: repeat(3, 0.24rem);
    grid-auto-rows: 0.24rem;
    gap: 0.2rem 0.32rem;
    margin: 0;
    transform: translateX(-50%);
  }

  .bg-hero__dashboard-calendar-days span {
    inline-size: 0.24rem;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    background: currentColor;
    opacity: 0.36;
  }

  .bg-hero__dashboard-calendar-days span:nth-child(5) {
    opacity: 1;
  }

  .bg-hero__dashboard-checkmark {
    display: grid;
    place-items: center;
    inline-size: 2.65rem;
    aspect-ratio: 1;
    margin: auto auto 0;
    border: 2px solid var(--bg-hero-visual-accent);
    border-radius: var(--radius-circle);
    color: var(--bg-hero-visual-accent);
  }

  .bg-hero__dashboard-checkmark svg {
    inline-size: 52%;
    block-size: 52%;
    stroke-width: 1.95;
  }

  .bg-hero__dashboard-lower-icon {
    --bg-icon-size: 2.75rem;
    --bg-icon-glyph-size: 100%;

    display: grid;
    place-items: center;
    inline-size: var(--bg-icon-size);
    block-size: var(--bg-icon-size);

    margin: auto auto 0;
    color: var(--bg-hero-visual-accent);
  }

  .bg-hero__dashboard-lower-icon > .bg-icon {
    --bg-icon-size: inherit;
    --bg-icon-glyph-size: 100%;

    margin: 0;
  }

  .bg-hero__dashboard-card--check .bg-hero__dashboard-checkmark svg {
    inline-size: 52%;
    block-size: 52%;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.6;
  }

  .bg-hero__dashboard-card--check .bg-hero__dashboard-checkmark svg path {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
  }

  /* Explicit compact visual size. */

  .bg-hero__visual-shell--compact .bg-hero__dashboard {
    padding: clamp(0.6rem, 1.45cqi, 0.8rem);
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-grid {
    gap: 0.45rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-card {
    padding: 0.5rem 0.6rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-card--icon {
    padding-block-end: 0.38rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-card-title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.12;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-headline {
    margin-block-start: 0.3rem;
    font-size: var(--bg-hero-item-headline-size);
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-card--icon .bg-hero__dashboard-headline {
    margin-block-start: 0.22rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-note {
    margin-block-start: 0.2rem;
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.15;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-card--icon .bg-hero__dashboard-note {
    margin-block-start: 0.1rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-chart--line {
    padding-block-start: 0.25rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-chart--line svg {
    block-size: 2rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-chart--bars {
    gap: 0.45rem;
    block-size: 2rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-donut {
    inline-size: 3.25rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-calendar {
    inline-size: 2.35rem;
    margin-block-start: 0.75rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-checkmark {
    inline-size: 2.7rem;
    margin-block-start: 0.45rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard-lower-icon {
    --bg-icon-size: 2.55rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__dashboard {
    gap: 0.45rem;
  }

  &.bg-hero--visual-dashboard .bg-hero__visual-card--dashboard,
  &.bg-hero--visual-dashboard .bg-hero__dashboard-card {
    overflow: hidden;
  }

  &.bg-hero--visual-dashboard .bg-hero__dashboard-calendar,
  &.bg-hero--visual-dashboard .bg-hero__dashboard-checkmark,
  &.bg-hero--visual-dashboard .bg-hero__dashboard-lower-icon,
  &.bg-hero--visual-dashboard .bg-hero__dashboard-donut {
    flex: 0 0 auto;
    margin-block-start: auto;
    margin-block-end: 0;
  }

  &.bg-hero--visual-dashboard .bg-hero__dashboard-card--calendar .bg-hero__dashboard-calendar {
    margin-block-start: auto;
  }

  @container (inline-size < 86rem) {
    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard {
      gap: 0.45rem;
      padding: clamp(0.6rem, 1.45cqi, 0.8rem);
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-grid {
      gap: 0.45rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-card {
      padding: 0.5rem 0.6rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-card--icon {
      padding-block-end: 0.38rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-card-title {
      font-size: var(--bg-hero-item-title-size);
      line-height: 1.12;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-headline {
      margin-block-start: 0.3rem;
      font-size: var(--bg-hero-item-headline-size);
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-card--icon .bg-hero__dashboard-headline {
      margin-block-start: 0.22rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-note {
      margin-block-start: 0.2rem;
      font-size: var(--bg-hero-item-note-size);
      line-height: 1.15;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-card--icon .bg-hero__dashboard-note {
      margin-block-start: 0.1rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-chart--line {
      padding-block-start: 0.25rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-chart--line svg {
      block-size: 2rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-chart--bars {
      gap: 0.45rem;
      block-size: 2rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-donut {
      inline-size: 3.25rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-calendar {
      inline-size: 2.35rem;
      margin-block-start: 0.75rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-checkmark {
      inline-size: 2.7rem;
      margin-block-start: 0.45rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__dashboard-lower-icon {
      --bg-icon-size: 2.55rem;
    }
  }

  @container (inline-size < 37.5rem) {
    .bg-hero__dashboard-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(2, auto);
    }

    .bg-hero__dashboard-headline {
      line-height: 1.04;
    }

    .bg-hero__dashboard-chart--line svg,
    .bg-hero__dashboard-chart--bars,
    .bg-hero__dashboard-calendar,
    .bg-hero__dashboard-donut,
    .bg-hero__dashboard-checkmark,
    .bg-hero__dashboard-lower-icon {
      display: none;
    }
  }

  @container (inline-size < 20rem) {
    .bg-hero__dashboard-grid {
      grid-template-columns: 1fr;
    }

    .bg-hero__dashboard-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: start;
      column-gap: var(--space-xs);
      row-gap: 0.2rem;
      min-block-size: 0;
    }

    .bg-hero__dashboard-card-header {
      display: contents;
    }

    .bg-hero__dashboard-card-title {
      grid-column: 1;
      grid-row: 1;
    }

    .bg-hero__dashboard-headline {
      grid-column: 1;
      grid-row: 2;
    }

    .bg-hero__dashboard-note {
      grid-column: 1;
      grid-row: 3;
    }

    .bg-hero__dashboard-chart {
      display: none;
    }
  }

  /* Studio HTML import needs one root. This neutral wrapper adds no layout box,
     so the card and artwork retain their existing grid/positioning behaviour. */
  .bg-hero__mini-checklist-group {
    display: contents;
  }

  .bg-hero__mini-checklist {
    /* Keep this light card independent of the parent hero background. */
    --bg-hero-mini-card-surface: var(--body-bg-color);
    --bg-hero-mini-card-heading: var(--heading-color);
    --bg-hero-mini-card-text: var(--text-color);
    --bg-hero-mini-card-accent: var(--primary);
    --bg-hero-mini-card-accent-text: var(--text-light);
    --bg-hero-mini-card-border: color-mix(in oklch, var(--bg-hero-mini-card-heading) 16%, transparent);

    position: relative;
    z-index: 1;
    align-self: center;
    inline-size: min(70%, 16.5rem);
    max-inline-size: 16.5rem;
    block-size: auto;
    min-block-size: 18.5rem;
    grid-template-rows: auto auto auto;
    align-content: center;
    gap: var(--space-s);
    padding: clamp(0.9rem, 2.2cqi, 1.2rem);
    border-color: var(--bg-hero-mini-card-border);
    background: var(--bg-hero-mini-card-surface);
    box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    backdrop-filter: blur(5px);
  }

  &.bg-hero--mini-checklist-art-image .bg-hero__mini-checklist {
    background: var(--bg-hero-mini-card-surface);
  }

  .bg-hero__mini-checklist-artwork-frame {
    object-fit: cover;
    object-position: center;
    max-inline-size: none;
    border-radius: var(--radius);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
  }

  &.bg-hero--mini-checklist-art-image .bg-hero__mini-checklist-art {
    inset-inline: 45% 0;
  }

  &.bg-hero--mini-checklist-art-image .bg-hero__mini-checklist-artwork-frame {
    inline-size: 100%;
    block-size: 100%;
  }

  .bg-hero__mini-checklist-title,
  .bg-hero__mini-checklist-trust p {
    margin: 0;
  }

  .bg-hero__mini-checklist-title {
    color: var(--bg-hero-mini-card-heading);
    font-size: calc(var(--text-l) * 0.88);
    font-weight: 800;
    line-height: 1.1;
  }

  .bg-hero__mini-checklist-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-hero__mini-checklist-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    padding-block: 0.48rem;
    border-block-end: 0;
    color: var(--bg-hero-mini-card-text);
    font-size: var(--text-s);
    font-weight: 500;
    line-height: 1.25;
  }

  .bg-hero__mini-checklist-check {
    display: inline-grid;
    place-items: center;
    inline-size: 1.25rem;
    block-size: 1.25rem;
    border-radius: var(--radius-circle);
    background: var(--bg-hero-mini-card-accent);
    color: var(--bg-hero-mini-card-accent-text);
  }

  .bg-hero__mini-checklist-check svg {
    inline-size: 58%;
    block-size: 58%;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.2;
  }

  .bg-hero__visual-panel--mini-checklist {
    position: relative;
    display: grid;
    align-items: center;
    overflow: visible;
  }

  .bg-hero__mini-checklist-art {
    /* The illustration may use the contextual contrast accent, but its cloud
       must remain a separate, quiet background colour. */
    --bg-hero-mini-art-primary: var(--bg-hero-accent);
    --bg-hero-mini-art-primary-deep: color-mix(in srgb, var(--bg-hero-accent) 84%, var(--relative-heading-color, var(--heading-color)));
    --bg-hero-mini-art-detail: var(--primary-light);
    --bg-hero-mini-art-cloud: color-mix(in srgb, var(--body-bg-color) 85%, var(--primary));
    --bg-hero-mini-art-line: color-mix(in srgb, var(--bg-hero-accent) 38%, var(--relative-heading-color, var(--heading-color)));
    --bg-hero-mini-art-surface: var(--bg-decoration-surface, var(--body-bg-color));
    --bg-hero-mini-art-heading: var(--relative-heading-color, var(--heading-color));

    position: absolute;
    z-index: 0;
    inset: 0;
    display: grid;
    justify-items: end;
    align-items: center;
    pointer-events: none;
    transform: translateY(-20%);
  }

  .bg-hero__mini-checklist-svg,
  .bg-hero__mini-checklist-art > svg {
    inline-size: 100%;
    max-inline-size: 100%;
    block-size: auto;
    overflow: visible;
  }

  /* The uploaded SVGs can retain empty shadow filters after sanitisation.
     Bypass those filters so their illustration groups remain visible. */
  .bg-hero__mini-checklist-art svg [filter] {
    filter: none;
  }

  /* Specialist illustrations use filled groups and their original SVG line weights.
     Apply inheritance to the shapes themselves so icon outline rules cannot flatten them. */
  .bg-hero__mini-checklist-art svg :where(g, path, circle, rect, ellipse, line, polyline, polygon) {
    fill: inherit;
    stroke: none;
    stroke-linecap: butt;
    stroke-linejoin: miter;
    vector-effect: none;
  }

  .bg-hero__mini-checklist-art svg :where([fill="#e2e2e2"]) { fill: var(--bg-hero-mini-art-cloud); }
  .bg-hero__mini-checklist-art svg :where([fill="#cccccc"]) { fill: color-mix(in srgb, var(--bg-hero-mini-art-cloud) 62%, var(--bg-hero-mini-art-surface)); }
  .bg-hero__mini-checklist-art svg :where([fill="#ffffff"]) { fill: var(--bg-hero-mini-art-surface); }
  .bg-hero__mini-checklist-art svg :where([fill="#666666"]) { fill: var(--bg-hero-mini-art-primary); }
  .bg-hero__mini-checklist-art svg :where([fill="#444444"]) { fill: var(--bg-hero-mini-art-primary-deep); }
  .bg-hero__mini-checklist-art svg :where([fill="#2f2f2f"]) { fill: var(--bg-hero-mini-art-heading); }
  .bg-hero__mini-checklist-art svg :where([fill="#8a8a8a"]) { fill: var(--bg-hero-mini-art-detail); }
  .bg-hero__mini-checklist-art svg :where([fill="#222222"]) { fill: #222222; }
  .bg-hero__mini-checklist-art svg :where([fill="none"]) { fill: none; }

  .bg-hero__mini-checklist-art svg :where([stroke="#444444"]) { stroke: var(--bg-hero-mini-art-primary-deep); }
  .bg-hero__mini-checklist-art svg :where([stroke="#666666"]) { stroke: var(--bg-hero-mini-art-primary); }
  .bg-hero__mini-checklist-art svg :where([stroke="#aaaaaa"]) { stroke: var(--bg-hero-mini-art-line); }
  .bg-hero__mini-checklist-art svg :where([stroke="#ffffff"]) { stroke: var(--bg-hero-mini-art-surface); }
  .bg-hero__mini-checklist-art svg :where([stroke="var(--bg-hero-mini-art-primary-deep, #444444)"]) { stroke: var(--bg-hero-mini-art-primary-deep); }

  /* Preserve the stroke-width attributes present in the ten uploaded illustrations. */
  .bg-hero__mini-checklist-art svg :where([stroke-width="4"]) { stroke-width: 4; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="5"]) { stroke-width: 5; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="6"]) { stroke-width: 6; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="7"]) { stroke-width: 7; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="8"]) { stroke-width: 8; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="9"]) { stroke-width: 9; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="10"]) { stroke-width: 10; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="11"]) { stroke-width: 11; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="12"]) { stroke-width: 12; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="13"]) { stroke-width: 13; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="14"]) { stroke-width: 14; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="15"]) { stroke-width: 15; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="16"]) { stroke-width: 16; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="18"]) { stroke-width: 18; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="20"]) { stroke-width: 20; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="30"]) { stroke-width: 30; }
  .bg-hero__mini-checklist-art svg :where([stroke-width="34"]) { stroke-width: 34; }

  .bg-hero__mini-checklist-art svg :where([stroke-linecap="round"]) { stroke-linecap: round; }
  .bg-hero__mini-checklist-art svg :where([stroke-linecap="square"]) { stroke-linecap: square; }
  .bg-hero__mini-checklist-art svg :where([stroke-linejoin="round"]) { stroke-linejoin: round; }

  /* Use the stable artwork wrapper: imported SVG root classes can vary. */
  .bg-hero__mini-checklist-svg-soft,
  .bg-hero__mini-checklist-art .art-soft { fill: var(--bg-hero-mini-art-cloud); }
  .bg-hero__mini-checklist-svg-soft-2,
  .bg-hero__mini-checklist-art .art-soft-2 { fill: color-mix(in srgb, var(--bg-hero-mini-art-cloud) 62%, var(--bg-hero-mini-art-surface)); }
  .bg-hero__mini-checklist-svg-surface,
  .bg-hero__mini-checklist-art .art-white,
  .bg-hero__mini-checklist-art .art-house { fill: var(--bg-hero-mini-art-surface); }
  .bg-hero__mini-checklist-svg-primary,
  .bg-hero__mini-checklist-art .art-primary { fill: var(--bg-hero-mini-art-primary); }
  .bg-hero__mini-checklist-svg-primary-deep,
  .bg-hero__mini-checklist-art .art-primary-deep { fill: var(--bg-hero-mini-art-primary-deep); }
  .bg-hero__mini-checklist-art .art-primary-dark { fill: var(--bg-hero-mini-art-heading); }
  .bg-hero__mini-checklist-svg-secondary,
  .bg-hero__mini-checklist-art .art-secondary { fill: var(--bg-hero-mini-art-detail); }
  .bg-hero__mini-checklist-svg-primary-stroke,
  .bg-hero__mini-checklist-art .art-primary-stroke { fill: none; stroke: var(--bg-hero-mini-art-primary); }
  .bg-hero__mini-checklist-art .art-secondary-stroke { fill: none; stroke: var(--bg-hero-mini-art-detail); }
  .bg-hero__mini-checklist-svg-deep-stroke,
  .bg-hero__mini-checklist-art .art-deep-stroke { fill: none; stroke: var(--bg-hero-mini-art-primary-deep); }
  .bg-hero__mini-checklist-art .art-line-stroke { fill: none; stroke: var(--bg-hero-mini-art-line); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
  .bg-hero__mini-checklist-art .art-tree-line { fill: none; stroke: var(--bg-hero-mini-art-line); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }

  .bg-hero__mini-checklist-art .art-dashed {
    fill: none;
    stroke: var(--bg-hero-mini-art-line);
    stroke-width: 6;
    stroke-linecap: round;
    stroke-dasharray: 2 13;
  }

  .bg-hero__mini-checklist-trust-star {
    display: inline-block;
    flex: 0 0 auto;
    inline-size: 2.4rem;
    block-size: 2.4rem;
    color: var(--bg-hero-mini-card-accent);
  }

  .bg-hero__mini-checklist-trust-star svg {
    inline-size: 100%;
    block-size: 100%;
    fill: currentColor;
  }

  .bg-hero__mini-checklist-trust-star svg path {
    fill: currentColor;
    stroke: none;
  }

  .bg-hero__mini-checklist-trust {
    display: flex;
    gap: 0.55rem;
    align-items: center;
    padding-block-start: var(--space-s);
    border-block-start: 1px solid var(--bg-hero-mini-card-border);
    color: var(--bg-hero-mini-card-accent);
    font-size: var(--text-s);
    font-weight: 800;
    line-height: 1.25;
  }

  /* Process visual: structure, standard/compact sizing and responsive connectors. */

  .bg-hero__process {
    grid-template-rows: auto auto auto;
    padding: clamp(0.9rem, 2.1cqi, 1.1rem);
  }

  .bg-hero__process-step-title,
  .bg-hero__process-step-headline,
  .bg-hero__process-step-text {
    margin: 0;
  }

  .bg-hero__process-number {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: var(--radius-circle);
    position: relative;
    z-index: 1;
    background: var(--bg-hero-visual-accent-soft);
    color: var(--bg-hero-visual-accent-text);
    font-size: calc(var(--text-s) * 1.08);
    font-weight: 800;
    line-height: 1;
  }

  .bg-hero__process-list {
    display: grid;
    gap: var(--bg-hero-process-list-gap);
    min-block-size: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: bg-hero-process;
  }

  .bg-hero__process-item {
    position: relative;
    display: grid;
    grid-template-columns: 2.95rem minmax(0, 1fr);
    align-items: start;
    gap: 0.85rem;
    min-inline-size: 0;
    min-block-size: 0;
    padding: var(--bg-hero-process-item-padding-block) 0;
    counter-increment: bg-hero-process;
  }

  .bg-hero__process-number::before {
    content: counter(bg-hero-process);
  }

  .bg-hero__process-step-title {
    display: inline;
    margin-inline-end: 0.4rem;
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: break-word;
  }

  .bg-hero__process-step-title::after,
  .bg-hero__process-step-headline::after {
    content: '';
  }

  .bg-hero__process-step-headline {
    display: inline;
    margin-inline-end: 0.4rem;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 800;
    line-height: 1.16;
    overflow-wrap: break-word;
  }

  .bg-hero__process-step-text {
    display: inline;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.22;
    overflow-wrap: break-word;
  }

  .bg-hero__visual-shell--compact .bg-hero__process {
    padding: clamp(0.8rem, 1.75cqi, 1rem);
  }

  .bg-hero__visual-shell--compact .bg-hero__process-number {
    font-size: calc(var(--text-s) * 1.04);
  }

  .bg-hero__visual-shell--compact .bg-hero__process-item {
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: 0.7rem;
    padding: var(--bg-hero-process-item-padding-block) 0;
  }

  &.bg-hero.bg-hero--visual-process .bg-hero__process {
    --bg-hero-process-number-size: 2.95rem;
    --bg-hero-process-list-gap: clamp(0.95rem, 2.1cqi, 1.35rem);
    --bg-hero-process-item-padding-block: clamp(0.35rem, 0.75cqi, 0.5rem);

    gap: clamp(0.25rem, 0.75cqi, 0.45rem);
  }

  &.bg-hero.bg-hero--visual-process .bg-hero__process-number {
    inline-size: var(--bg-hero-process-number-size);
    block-size: var(--bg-hero-process-number-size);
  }

  &.bg-hero.bg-hero--visual-process .bg-hero__process-item:not(:last-child)::after {
    content: '';
    position: absolute;
    z-index: 0;
    inset-block-start: calc(var(--bg-hero-process-item-padding-block) + var(--bg-hero-process-number-size));
    inset-block-end: calc(-1 * (var(--bg-hero-process-list-gap) + var(--bg-hero-process-item-padding-block)));
    inset-inline-start: calc(var(--bg-hero-process-number-size) / 2);
    block-size: auto;
    border-inline-start: 1px solid var(--bg-hero-visual-accent);
    opacity: 0.42;
    transform: translateX(-50%);
    pointer-events: none;
  }

  &.bg-hero.bg-hero--visual-process .bg-hero__visual-footer {
    margin-block-start: clamp(0.7rem, 1.5cqi, 1rem);
  }

  &.bg-hero.bg-hero--visual-process .bg-hero__visual-shell--compact .bg-hero__process {
    --bg-hero-process-number-size: 2.25rem;
    --bg-hero-process-list-gap: clamp(0.75rem, 1.65cqi, 1.05rem);
    --bg-hero-process-item-padding-block: clamp(0.3rem, 0.65cqi, 0.45rem);
  }

  @container (inline-size < 86rem) {
    &.bg-hero.bg-hero--visual-process .bg-hero__process {
      --bg-hero-process-number-size: 2.25rem;
      --bg-hero-process-list-gap: clamp(0.75rem, 1.65cqi, 1.05rem);
      --bg-hero-process-item-padding-block: clamp(0.3rem, 0.65cqi, 0.45rem);

      gap: 0.4rem;
      padding: clamp(0.8rem, 1.75cqi, 1rem);
    }

    &.bg-hero.bg-hero--visual-process .bg-hero__process-item {
      grid-template-columns: 2.25rem minmax(0, 1fr);
      gap: 0.7rem;
      padding: var(--bg-hero-process-item-padding-block) 0;
    }

    &.bg-hero.bg-hero--visual-process .bg-hero__process-number {
      font-size: calc(var(--text-s) * 1.04);
    }

    &.bg-hero.bg-hero--visual-process .bg-hero__visual-footer {
      margin-block-start: 0.45rem;
    }
  }



  .bg-hero__visual-image {
    --bg-hero-visual-image-position: center;

    display: block;
    inline-size: 100%;
    block-size: 100%;
    aspect-ratio: inherit;
    overflow: hidden;
    object-fit: cover;
    object-position: var(--bg-hero-visual-image-position);
    border-radius: var(--radius);
  }

  .bg-hero__visual-image picture,
  .bg-hero__visual-image img {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    border-radius: inherit;
  }

  .bg-hero__visual-image img {
    object-fit: cover;
    object-position: var(--bg-hero-visual-image-position);
  }

  .bg-hero__visual-image--center {
    --bg-hero-visual-image-position: center;
  }

  .bg-hero__visual-image--top {
    --bg-hero-visual-image-position: center top;
  }

  .bg-hero__visual-image--upper {
    --bg-hero-visual-image-position: center 35%;
  }

  .bg-hero__visual-image--bottom {
    --bg-hero-visual-image-position: center bottom;
  }

  .bg-hero__visual-image--left {
    --bg-hero-visual-image-position: left center;
  }

  .bg-hero__visual-image--right {
    --bg-hero-visual-image-position: right center;
  }

  .bg-hero__stats {
    --bg-hero-stat-gap: var(--space-s);
    --bg-hero-stat-border: color-mix(in srgb, color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent) 82%, transparent);
    --bg-hero-stat-soft-line: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    --bg-hero-stat-shadow: 0 0.75rem 1.75rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 8%, transparent);

    display: grid;
    grid-template-columns: var(--grid-4);
    gap: var(--bg-hero-stat-gap);
    min-inline-size: 0;
  }

  .bg-hero__stat {
    box-sizing: border-box;
    position: relative;
    min-inline-size: 0;
    padding: 1.75rem 1.5rem;
    border-radius: var(--bg-hero-card-radius);
  }

  .bg-hero__stat:not(.surface-panel) {
    background: var(--bg-decoration-surface, var(--bg-light));
  }

  .bg-hero__stat-copy {
    min-inline-size: 0;
  }

  .bg-hero__stat-value {
    margin: 0;
    max-inline-size: 100%;
    font-size: calc(var(--text-xl) * 2);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    color: var(--relative-link-color, var(--primary));
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: normal;
    text-wrap: balance;
  }

  .bg-hero__stat-label {
    margin: calc(var(--space-xs) / 2) 0 0;
    font-size: calc(var(--text-s)*1.15);
    font-weight: 600;
    line-height: 1.25;
    color: var(--relative-link-color, var(--primary));
    overflow-wrap: anywhere;
  }

  &.bg-hero--stat-treatment-soft .bg-hero__stat {
    background: color-mix(in srgb, var(--bg-decoration-surface, var(--bg-light)) 56%, var(--bg-decoration-surface, var(--body-bg-color)));
  }

  &.bg-hero--stat-treatment-soft .bg-hero__stat-value {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 82%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-soft .bg-hero__stat-label {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 68%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-tint .bg-hero__stat {
    border: 1px solid color-mix(in srgb, var(--relative-link-color, var(--primary)) 14%, color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent));
    background: color-mix(in srgb, var(--bg-decoration-surface, var(--bg-light)) 34%, color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 76%, transparent));
    box-shadow: 0 0.65rem 1.5rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 6%, transparent);
  }

  &.bg-hero--stat-treatment-tint .bg-hero__stat-value {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 74%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-tint .bg-hero__stat-label {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 52%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-glass .bg-hero__stat {
    border: 1px solid color-mix(in srgb, color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent) 52%, transparent);
    background: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 58%, transparent);
    box-shadow: 0 0.75rem 1.65rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 10%, transparent);
    -webkit-backdrop-filter: blur(7px) saturate(1.08);
    backdrop-filter: blur(7px) saturate(1.08);
  }

  &.bg-hero--stat-treatment-glass .bg-hero__stat-value {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 84%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-glass .bg-hero__stat-label {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 44%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-wash .bg-hero__stat,
  &.bg-hero--stat-treatment-mono .bg-hero__stat {
    border: 1px solid color-mix(in srgb, color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent) 76%, transparent);
    background: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 74%, transparent);
    box-shadow: 0 0.75rem 1.75rem color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 8%, transparent);
  }

  &.bg-hero--stat-treatment-wash .bg-hero__stat-value {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 68%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-wash .bg-hero__stat-label {
    color: color-mix(in srgb, var(--relative-link-color, var(--primary)) 42%, var(--relative-heading-color, var(--heading-color)));
  }

  &.bg-hero--stat-treatment-mono .bg-hero__stat-value {
    color: var(--relative-heading-color, var(--heading-color));
  }

  &.bg-hero--stat-treatment-mono .bg-hero__stat-label {
    color: var(--relative-text-color, var(--text-color));
  }

  &.bg-hero--stat-layout-inline .bg-hero__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding-block: var(--space-l);
  }

  &.bg-hero--stat-layout-inline:has(.bg-hero__trustline) .bg-hero__inner,
  &.bg-hero--stat-layout-inline:has(.bg-hero__compact-trust) .bg-hero__inner {
    gap: var(--space-s);
  }

  &.bg-hero--stat-layout-inline:has(.bg-hero__trustline) .bg-hero__stats,
  &.bg-hero--stat-layout-inline:has(.bg-hero__compact-trust) .bg-hero__stats {
    padding-block: var(--space-xs);
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: var(--space-xs);
    padding: 0 var(--space-m);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat:first-of-type {
    padding-inline-start: 0;
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat:not(:last-of-type) {
    border-inline-end: 1px solid var(--bg-hero-stat-soft-line);
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat-copy {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    column-gap: 0.35rem;
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat-value {
    font-size: var(--text-m);
    letter-spacing: 0;
  }

  &.bg-hero--stat-layout-inline .bg-hero__stat-label {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    font-weight: 500;
  }

  &.bg-hero--stat-layout-editorial .bg-hero__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    align-items: end;
    padding-block: var(--space-xs);
  }

  &.bg-hero--stat-layout-editorial .bg-hero__stat {
    padding: 0 clamp(var(--space-s), 3cqi, var(--space-xl));
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  &.bg-hero--stat-layout-editorial .bg-hero__stat:not(:last-of-type) {
    border-inline-end: 1px solid var(--bg-hero-stat-soft-line);
  }

  &.bg-hero--stat-layout-editorial .bg-hero__stat-value {
    font-size: clamp(calc(var(--text-xl) * 1.55), 5cqi, calc(var(--text-xl) * 2.15));
    max-inline-size: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: normal;
  }

  &.bg-hero--stat-layout-editorial .bg-hero__stat-label {
    color: var(--relative-text-color, var(--text-color));
    font-weight: 500;
  }

  &.bg-hero--stat-layout-editorial:has(.bg-hero__trustline) .bg-hero__inner {
    gap: var(--space-s);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stats {
    grid-template-columns: minmax(14rem, 0.68fr) minmax(0, 1.32fr);
    column-gap: var(--space-m);
    row-gap: 0;
    align-items: stretch;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat {
    border: 1px solid var(--bg-hero-stat-border);
    background: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 88%, var(--bg-decoration-surface, var(--bg-light)));
    box-shadow: var(--bg-hero-stat-shadow);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:first-of-type {
    display: grid;
    grid-row: 1 / span 3;
    place-content: center;
    justify-items: center;
    min-block-size: 7rem;
    padding: var(--space-m);
    text-align: center;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:first-of-type .bg-hero__stat-value {
    font-size: clamp(calc(var(--text-xl) * 1.28), 4.1cqi, calc(var(--text-xl) * 1.78));
    max-inline-size: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: normal;
    text-wrap: balance;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:first-of-type .bg-hero__stat-label {
    text-wrap: balance;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-xs);
    grid-column: 2;
    min-block-size: 0;
    padding: clamp(0.45rem, 1cqi, 0.6rem) var(--space-s);
    border-radius: 0;
    border-inline: 0;
    border-block-start: 0;
    box-shadow: none;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:nth-of-type(2) {
    border-start-start-radius: var(--bg-hero-card-radius);
    border-start-end-radius: var(--bg-hero-card-radius);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:last-of-type {
    border-end-start-radius: var(--bg-hero-card-radius);
    border-end-end-radius: var(--bg-hero-card-radius);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type):not(:last-of-type) {
    border-block-end: 1px solid var(--bg-hero-stat-soft-line);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) .bg-hero__stat-copy {
    --bg-hero-featured-list-value-column: 9rem;

    display: grid;
    grid-template-columns: var(--bg-hero-featured-list-value-column) minmax(0, 1fr);
    align-items: center;
    column-gap: var(--space-s);
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) .bg-hero__stat-value {
    font-size: calc(var(--text-xl) * 0.88);
    letter-spacing: 0;
  }

  &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) .bg-hero__stat-label {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 500;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(var(--space-m), 4cqi, var(--space-xl));
    align-items: start;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat {
    --bg-hero-stat-seal-size: clamp(8rem, 13.5cqi, 9.75rem);

    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: var(--bg-hero-stat-seal-size) auto;
    justify-items: center;
    align-content: start;
    min-block-size: calc(var(--bg-hero-stat-seal-size) + 2.5rem);
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat::before,
  &.bg-hero--stat-layout-seals .bg-hero__stat::after {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 50%;
    inline-size: var(--bg-hero-stat-seal-size);
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    transform: translateX(-50%);
    pointer-events: none;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat::before {
    border: 1px solid color-mix(in srgb, var(--relative-link-color, var(--primary)) 74%, transparent);
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat::after {
    inset-block-start: 0.6rem;
    inline-size: calc(var(--bg-hero-stat-seal-size) - 1.2rem);
    border: 1px dashed color-mix(in srgb, var(--relative-link-color, var(--primary)) 42%, transparent);
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat-value,
  &.bg-hero--stat-layout-seals .bg-hero__stat-label {
    grid-column: 1;
    justify-self: center;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat-copy {
    display: contents;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat-value {
    grid-row: 1;
    z-index: 1;
    align-self: center;
    max-inline-size: calc(var(--bg-hero-stat-seal-size) - 0.9rem);
    margin-block-start: 1.05rem;
    font-size: clamp(calc(var(--text-xl) * 0.78), 2.55cqi, calc(var(--text-xl) * 1.04));
    line-height: 0.95;
    text-align: center;
    white-space: nowrap;
  }

  &.bg-hero--stat-layout-seals .bg-hero__stat-label {
    grid-row: 2;
    z-index: 1;
    margin-block-start: var(--space-s);
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 700;
    line-height: 1.1;
  }

  &.bg-hero--stat-layout-rail .bg-hero__stats {
    grid-template-columns: minmax(5.8rem, 7.2rem) minmax(0, 1fr);
    gap: var(--space-xs);
    align-items: stretch;
    max-inline-size: 38rem;
  }

  &.bg-hero--stat-layout-rail .bg-hero__stats:not(:has(.bg-hero__stats-rail)) {
    grid-template-columns: minmax(0, 1fr);
  }

  &.bg-hero--stat-layout-rail .bg-hero__stat {
    --bg-hero-rail-icon-size: 1.8rem;
    --bg-hero-rail-value-column: 7rem;

    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.45rem;
    grid-column: 2;
    padding: 0 0 0.48rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  &.bg-hero--stat-layout-rail .bg-hero__stats:not(:has(.bg-hero__stats-rail)) .bg-hero__stat {
    grid-column: auto;
  }

  &.bg-hero--stat-layout-rail .bg-hero__stat-copy {
    display: grid;
    grid-template-columns: minmax(var(--bg-hero-rail-value-column), max-content) minmax(0, 1fr);
    align-items: baseline;
    column-gap: var(--space-s);
  }

  &.bg-hero--stat-layout-rail .bg-hero__stat-value {
    font-size: calc(var(--text-xl) * 0.92);
    letter-spacing: 0;
  }

  &.bg-hero--stat-layout-rail .bg-hero__stat-label {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stats {
    position: relative;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(var(--space-m), 4cqi, var(--space-xl));
    padding-block-start: 3.2rem;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stats::before {
    content: '';
    position: absolute;
    inset-block-start: 1.55rem;
    inset-inline: 1.5rem;
    border-block-start: 2px solid var(--bg-hero-stat-soft-line);
    pointer-events: none;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stat {
    display: grid;
    justify-items: center;
    padding: 1.55rem 0 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stat::before {
    content: '';
    position: absolute;
    inset-block-start: -2.45rem;
    inset-inline-start: 50%;
    inline-size: 2.2rem;
    aspect-ratio: 1;
    border: 2px solid currentColor;
    border-radius: var(--radius-circle);
    background:
      radial-gradient(circle, var(--relative-link-color, var(--primary)) 0 42%, transparent 44%),
      var(--bg-decoration-surface, var(--body-bg-color));
    color: var(--relative-link-color, var(--primary));
    transform: translateX(-50%);
    pointer-events: none;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stat::after {
    content: '';
    position: absolute;
    inset-block-start: -0.25rem;
    inset-inline-start: 50%;
    block-size: 1.3rem;
    border-inline-start: 2px dotted color-mix(in srgb, var(--relative-link-color, var(--primary)) 44%, transparent);
    transform: translateX(-50%);
    pointer-events: none;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stat-value {
    font-size: clamp(calc(var(--text-xl) * 1.2), 4cqi, calc(var(--text-xl) * 1.65));
    letter-spacing: 0;
  }

  &.bg-hero--stat-layout-timeline .bg-hero__stat-label {
    color: var(--relative-text-color, var(--text-color));
    font-weight: 500;
  }

  .bg-hero__trustline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-xs);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    padding-block-start: var(--space-s);
    color: var(--bg-hero-content-muted);
    font-size: var(--text-m);
  }

  .bg-hero__google {
    margin: 0;
  }

  .bg-hero__google-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 1.5rem;
    block-size: 1.5rem;
  }

  .bg-hero__trustline-item {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    min-inline-size: 0;
  }

  .bg-hero__trustline-item + .bg-hero__trustline-item {
    position: relative;
    padding-inline-start: calc(var(--space-s) + 0.55rem);
  }

  .bg-hero__trustline-item + .bg-hero__trustline-item::before {
    content: '';
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: calc(var(--space-s) / 2);
    inline-size: 0.5rem;
    aspect-ratio: 1;
    background: var(--bg-hero-accent);
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .bg-hero__trustline-item + .bg-hero__credential {
    padding-inline-start: 0;
  }

  .bg-hero__trustline-item + .bg-hero__credential::before {
    content: none;
  }

  .bg-hero__credential {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(var(--space-xs) / 2);
    margin-inline-start: auto;
    min-inline-size: 0;
  }

  .bg-hero__credential-badge {
    display: inline-block;
    padding: calc(var(--space-xs) / 3) var(--space-xs);
    border: 1px solid currentColor;
    font-size: var(--text-xs);
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-hero__credential-badge:empty {
    display: none;
  }

  &.bg-hero--visual-none,
  &.bg-hero--visual-image.bg-hero--image-background {
    --bg-hero-content-max: 100%;
    --bg-hero-title-measure: min(90%, 28ch);
  }

  &.bg-hero--visual-none .bg-hero__layout,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__layout {
    grid-template-columns: 1fr;
  }

  &.bg-hero--visual-none .bg-hero__content,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(max-content, 32rem);
    align-items: start;
    column-gap: var(--space-l);
    row-gap: 0;
  }

  /* A no-visual hero has no second focal point, so keep its CTAs in the
     reading flow beneath the lede rather than floating them beside it. */
  &.bg-hero--visual-none .bg-hero__content {
    display: flex;
    flex-direction: column;
  }

  &.bg-hero--visual-none .bg-hero__eyebrow,
  &.bg-hero--visual-none .bg-hero__title,
  &.bg-hero--visual-none .bg-hero__compact-trust,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__eyebrow,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__title,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust {
    grid-column: 1 / -1;
  }

  &.bg-hero--visual-none .bg-hero__lede,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__lede {
    grid-column: 1;
  }

  &.bg-hero--visual-none .bg-hero__actions,
  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__actions {
    grid-column: 2;
    align-self: start;
    justify-self: start;
    margin-block-start: 0;
  }

  &.bg-hero--visual-image.bg-hero--image-background:not(.bg-hero--content-centre) .bg-hero__actions {
    margin-block-start: var(--bg-hero-lede-gap-before);
  }

  &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__content,
  &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__content {
    display: flex;
    align-items: center;
    max-inline-size: min(100%, var(--bg-hero-standalone-content-max));
    margin-inline: auto;
    text-align: center;
  }

  &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__title,
  &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__title {
    align-items: center;
  }

  &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__actions,
  &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__compact-trust,
  &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__actions,
  &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__compact-trust {
    align-self: center;
    justify-content: center;
  }

  @container (inline-size < 70rem) {
    .bg-hero__stats {
      --bg-hero-stat-flow-min: 12.5rem;
      --bg-hero-stat-flow-max: 17rem;

      grid-template-columns: repeat(2, minmax(min(100%, var(--bg-hero-stat-flow-min)), var(--bg-hero-stat-flow-max)));
      justify-content: start;
    }

    &.bg-hero--stat-layout-inline .bg-hero__stats,
    &.bg-hero--stat-layout-editorial .bg-hero__stats,
    &.bg-hero--stat-layout-timeline .bg-hero__stats {
      --bg-hero-stat-flow-min: 10.5rem;
      --bg-hero-stat-flow-max: 16rem;

      grid-template-columns: repeat(2, minmax(min(100%, var(--bg-hero-stat-flow-min)), var(--bg-hero-stat-flow-max)));
      justify-content: start;
    }

    &.bg-hero--stat-layout-inline .bg-hero__stats {
      column-gap: var(--space-m);
      row-gap: var(--space-s);
    }

    &.bg-hero--stat-layout-inline .bg-hero__stat,
    &.bg-hero--stat-layout-editorial .bg-hero__stat {
      border-inline-end: 0;
    }

    &.bg-hero--stat-layout-inline .bg-hero__stat {
      padding-inline: 0;
    }

    &.bg-hero--stat-layout-editorial .bg-hero__stats {
      column-gap: var(--space-m);
      row-gap: var(--space-s);
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stats {
      column-gap: var(--space-l);
      row-gap: calc(var(--space-xl) * 1.15);
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stats::before {
      content: none;
    }
  }

  @container (inline-size < 62rem) {
    .bg-hero__layout {
      grid-template-columns: 1fr;
    }

    .bg-hero__visual,
    .bg-hero__visual-shell,
    .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-compact-size));
      max-inline-size: var(--bg-hero-visual-compact-size);
    }

    .bg-hero__visual-shell--compact {
      margin-inline-start: 0;
    }

    .bg-hero__content {
      max-inline-size: 100%;
    }

    &.bg-hero--visual-none .bg-hero__content,
    &.bg-hero--visual-image.bg-hero--image-background .bg-hero__content {
      display: flex;
    }

    &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__content,
    &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__content {
      max-inline-size: 100%;
      margin-inline-start: 0;
    }

    &.bg-hero--content-centre.bg-hero--visual-none .bg-hero__content,
    &.bg-hero--content-centre.bg-hero--visual-image.bg-hero--image-background .bg-hero__content {
      margin-inline-end: 0;
    }

    &.bg-hero--visual-none .bg-hero__actions,
    &.bg-hero--visual-image.bg-hero--image-background .bg-hero__actions {
      align-self: auto;
      justify-self: auto;
    }

    &.bg-hero--stat-layout-rail .bg-hero__stats {
      max-inline-size: 100%;
    }
  }

  @container (inline-size < 60rem) {
    &.bg-hero--stat-layout-seals .bg-hero__stats {
      --bg-hero-stat-seal-track: 13.5rem;

      grid-template-columns: repeat(2, minmax(min(100%, var(--bg-hero-stat-seal-track)), var(--bg-hero-stat-seal-track)));
      justify-content: start;
      gap: calc(var(--space-xl) * 1.15) clamp(var(--space-l), 7cqi, calc(var(--space-xl) * 1.75));
    }
  }

  @container (inline-size < 52rem) {
    .bg-hero__trustline {
      align-items: center;
      row-gap: calc(var(--space-xs) * 1.2);
    }

    .bg-hero__credential {
      inline-size: 100%;
      margin-inline-start: 0;
      justify-content: flex-start;
    }

    .bg-hero__credential-badge {
      max-inline-size: 100%;
      overflow-wrap: anywhere;
    }
  }

  @container (inline-size < 37.5rem) {
    .bg-hero__title {
      max-inline-size: 100%;
    }

    .bg-hero__eyebrow {
      border-radius: var(--radius);
    }

    .bg-hero__visual {
      justify-self: start;
    }

    .bg-hero__visual,
    .bg-hero__visual-shell,
    .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-mobile-size));
      max-inline-size: var(--bg-hero-visual-mobile-size);
    }

    .bg-hero__checklist {
      padding: 0.65rem;
    }

    .bg-hero__stats {
      grid-template-columns: minmax(0, 1fr);
    }

    .bg-hero__stat {
      padding: 1.25rem 1rem;
    }

    .bg-hero__stat-value {
      font-size: clamp(calc(var(--text-xl) * 1.25), 9.5cqi, calc(var(--text-xl) * 1.6));
    }

    &.bg-hero--stat-layout-inline .bg-hero__stats,
    &.bg-hero--stat-layout-editorial .bg-hero__stats,
    &.bg-hero--stat-layout-featured-list .bg-hero__stats,
    &.bg-hero--stat-layout-seals .bg-hero__stats,
    &.bg-hero--stat-layout-rail .bg-hero__stats,
    &.bg-hero--stat-layout-timeline .bg-hero__stats {
      grid-template-columns: minmax(0, 1fr);
    }

    &.bg-hero--stat-layout-inline .bg-hero__stats {
      gap: var(--space-xs);
      padding-block: 0;
    }

    &.bg-hero--stat-layout-editorial .bg-hero__stats {
      gap: var(--space-l);
      padding-block: 0;
    }

    &.bg-hero--stat-layout-inline .bg-hero__stat {
      padding-inline: 0;
      padding-block: var(--space-xs);
      border-inline-end: 0;
      border-block-end: 0;
    }

    &.bg-hero--stat-layout-editorial .bg-hero__stat {
      padding-inline: 0;
      border-inline-end: 0;
      border-block-end: 0;
    }

    &.bg-hero--stat-layout-featured-list .bg-hero__stat:first-of-type {
      grid-column: 1;
      grid-row: auto;
      min-block-size: auto;
      padding: var(--space-m);
    }

    &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) {
      grid-column: 1;
      padding: var(--space-xs) 0;
    }

    &.bg-hero--stat-layout-featured-list .bg-hero__stat:not(:first-of-type) .bg-hero__stat-copy,
    &.bg-hero--stat-layout-rail .bg-hero__stat-copy {
      grid-template-columns: minmax(0, 1fr);
      row-gap: 0.15rem;
    }

    &.bg-hero--stat-layout-rail .bg-hero__stat {
      grid-column: auto;
    }

    &.bg-hero--stat-layout-seals .bg-hero__stat {
      --bg-hero-stat-seal-size: 8.75rem;
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stats {
      gap: calc(var(--space-xl) * 1.25);
      padding-block-start: 2.65rem;
      padding-inline-start: 0;
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stats::before {
      content: none;
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stat::after {
      content: '';
      position: absolute;
      inset-block-start: -0.55rem;
      inset-inline-start: 50%;
      block-size: 1.5rem;
      border-inline-start: 2px dotted color-mix(in srgb, var(--relative-link-color, var(--primary)) 44%, transparent);
      transform: translateX(-50%);
      pointer-events: none;
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stat {
      justify-items: center;
      padding-block-start: 1.55rem;
      text-align: center;
    }

    &.bg-hero--stat-layout-timeline .bg-hero__stat::before {
      content: '';
      inset-block-start: -2.3rem;
      inset-inline-start: 50%;
      inline-size: 1.85rem;
      background:
        radial-gradient(circle, var(--relative-link-color, var(--primary)) 0 40%, transparent 42%),
        var(--bg-decoration-surface, var(--body-bg-color));
      transform: translateX(-50%);
    }
  }

  @container (inline-size < 20rem) {
    .bg-hero__visual,
    .bg-hero__visual-shell,
    .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-narrow-size));
      max-inline-size: var(--bg-hero-visual-narrow-size);
    }

    .bg-hero__visual-card {
      padding: var(--space-xs);
    }

    .bg-hero__stats {
      grid-template-columns: var(--grid-1);
    }
  }

  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-dashboard .bg-hero__visual-shell,
    &.bg-hero--visual-checklist .bg-hero__visual-shell,
    &.bg-hero--visual-summary .bg-hero__visual-shell,
    &.bg-hero--visual-process .bg-hero__visual-shell,
    .bg-hero__visual-card {
      block-size: auto;
      aspect-ratio: auto;
    }

    .bg-hero__visual-card {
      overflow: visible;
    }
  }

  .bg-hero__visual-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1.1rem;
    padding-block-end: 1rem;
    border-block-end: 0;
  }

  .bg-hero__visual-kicker {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.2;
  }

  .bg-hero__visual-title {
    margin-block-start: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: calc(var(--text-l) * 1.32);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: 0;
  }

  .bg-hero__visual-subtitle {
    display: block;
    margin-block-start: 0.25rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    line-height: 1.25;
  }

  .bg-hero__visual-footer {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.6rem;
    margin-block-start: 1.35rem;
    padding: 0.7rem;
    border-radius: var(--radius);
    background: linear-gradient(90deg, var(--bg-primary-soft), color-mix(in srgb, var(--bg-primary-soft) 62%, var(--bg-decoration-surface, var(--body-bg-color))));
  }

  .bg-hero__visual-footer-title {
    display: block;
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-s);
    font-weight: 800;
    line-height: 1.1;
    overflow-wrap: break-word;
  }

  .bg-hero__visual-footer-text {
    display: block;
    margin-block-start: 0.15rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-xs);
    line-height: 1.2;
    overflow-wrap: break-word;
  }

  .bg-hero__checklist-item-title,
  .bg-hero__summary-item-title,
  .bg-hero__process-step-title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.2;
  }

  .bg-hero__checklist-item-text,
  .bg-hero__process-step-text {
    display: inline;
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
  }

  .bg-hero__checklist-item-headline,
  .bg-hero__process-step-headline {
    font-size: var(--bg-hero-item-headline-size);
    line-height: 1.16;
  }

  @container (inline-size < 37.5rem) {
    .bg-hero__visual-header {
      gap: 0.75rem;
      padding-block-end: 0.55rem;
    }

    .bg-hero__visual-title {
      font-size: calc(var(--text-m) * 1.08);
      line-height: 1.05;
    }

    .bg-hero__visual-subtitle {
      font-size: calc(var(--text-xs) * 0.92);
      line-height: 1.15;
    }

    .bg-hero__visual-footer {
      gap: 0.45rem;
      margin-block-start: 0.95rem;
      padding: 0.55rem;
    }

    .bg-hero__visual-footer-title,
    .bg-hero__visual-footer-text {
      font-size: calc(var(--text-xs) * 0.92);
      line-height: 1.08;
    }
  }

  .bg-hero__visual-shell--compact .bg-hero__visual-header {
    gap: 0.9rem;
    padding-block-end: 0.2rem;
  }

  .bg-hero__visual-shell--compact .bg-hero__visual-kicker {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.2;
  }

  .bg-hero__visual-shell--compact .bg-hero__visual-title {
    margin-block-start: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: calc(var(--text-l) * 1.04);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: 0;
  }

  .bg-hero__visual-shell--compact .bg-hero__visual-subtitle {
    display: block;
    margin-block-start: 0.2rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    line-height: 1.2;
  }

  @container (inline-size < 37.5rem) {
    .bg-hero__visual-shell--compact .bg-hero__visual-header {
      gap: 0.75rem;
      padding-block-end: 0.35rem;
    }

    .bg-hero__visual-shell--compact .bg-hero__visual-title {
      font-size: calc(var(--text-m) * 1.08);
    }
  }

  @container (inline-size < 20rem) {
    .bg-hero__visual-header {
      grid-template-columns: auto minmax(0, 1fr);
    }

    .bg-hero__visual-title {
      font-size: var(--text-s);
    }

    .bg-hero__visual-subtitle,
    .bg-hero__visual-footer-text {
      display: none;
    }

    .bg-hero__visual-footer {
      grid-template-columns: auto minmax(0, 1fr);
      margin-block-start: 0.65rem;
    }

    .bg-hero__visual-footer-title {
      font-size: var(--text-xs);
    }
  }

  @container (inline-size < 62rem) {
    &.bg-hero--visual-image.bg-hero--image-background {
      min-block-size: auto;
    }

    &.bg-hero--visual-image.bg-hero--image-background .bg-hero__layout {
      min-block-size: var(--bg-hero-background-layout-min-block-size);
    }
  }

  @container (inline-size < 37.5rem) {

    &.bg-hero--visual-image.bg-hero--image-background .bg-hero__visual-image {
      inline-size: 100%;
      max-inline-size: none;
    }

    &.bg-hero--visual-image.bg-hero--image-background.bg-hero--background-image-mobile-hide .bg-hero__layout {
      min-block-size: 0;
    }

    &.bg-hero--visual-image.bg-hero--image-background.bg-hero--background-image-mobile-hide .bg-hero__background {
      display: none;
    }

    &.bg-hero--visual-image.bg-hero--image-background.bg-hero--background-image-mobile-hide .bg-hero__trustline::before,
    &.bg-hero--visual-image.bg-hero--image-background.bg-hero--background-image-mobile-hide .bg-hero__compact-trust::before {
      content: none;
    }
  }

  /* Circular image: one size variable controls desktop, compact and mobile. */
  &.bg-hero--visual-image.bg-hero--image-circle {
    --bg-hero-visual-circle-size: var(--bg-hero-visual-compact-size);
  }

  &.bg-hero--visual-image.bg-hero--image-circle:has(.bg-hero__visual-shell--compact) {
    --bg-hero-visual-circle-size: var(--bg-hero-visual-circle-compact-size);
  }

  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-shell,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-panel--image,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-card {
    inline-size: min(100%, var(--bg-hero-visual-circle-size));
    max-inline-size: var(--bg-hero-visual-circle-size);
  }

  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-shell--image,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-panel--image,
  &.bg-hero--visual-image.bg-hero--image-circle .bg-hero__visual-image {
    aspect-ratio: 1;
    block-size: auto;
    border-radius: var(--radius-circle);
  }

  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-image.bg-hero--image-circle,
    &.bg-hero--visual-image.bg-hero--image-circle:has(.bg-hero__visual-shell--compact) {
      --bg-hero-visual-circle-size: var(--bg-hero-visual-mobile-size);
    }
  }

  @container (inline-size < 20rem) {
    &.bg-hero--visual-image.bg-hero--image-circle,
    &.bg-hero--visual-image.bg-hero--image-circle:has(.bg-hero__visual-shell--compact) {
      --bg-hero-visual-circle-size: var(--bg-hero-visual-narrow-size);
    }
  }

  /* Checklist visual: structure, sizing and responsive rules. */

  .bg-hero__checklist {
    grid-template-rows: auto 1fr auto;
    gap: 0.8rem;
    padding: clamp(0.8rem, 2.1cqi, 1rem);
  }

  .bg-hero__checklist-item-title,
  .bg-hero__checklist-item-headline,
  .bg-hero__checklist-item-text {
    margin: 0;
  }

  .bg-hero__checklist-check,
  .bg-hero__checklist-item-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: var(--radius-circle);
    background: var(--bg-hero-visual-accent-soft);
    color: var(--bg-hero-visual-accent-text);
  }

  .bg-hero__checklist-check svg {
    inline-size: 54%;
    block-size: 54%;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
  }

  .bg-hero__checklist-item-icon svg {
    inline-size: var(--bg-icon-glyph-size);
    block-size: var(--bg-icon-glyph-size);
    stroke-width: var(--bg-icon-stroke-width);
  }

  .bg-hero__checklist-check svg * {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
  }

  .bg-hero__checklist-items {
    display: grid;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    min-block-size: 0;
  }

  .bg-hero__checklist-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
    min-inline-size: 0;
    min-block-size: 0;
    overflow: hidden;
    padding-block: 0.3rem;
    /* Keep dividers visible when the active background has no border token. */
    border-block-end: 1px solid var(--bg-hero-visual-border, color-mix(in oklch, var(--bg-hero-visual-text) 14%, transparent));
  }

  .bg-hero__checklist-check {
    inline-size: 1.35rem;
    block-size: 1.35rem;
  }

  .bg-hero__checklist-item-icon {
    --bg-icon-size: 1.8rem;

    --bg-icon-stroke-width: 2.15;

    inline-size: var(--bg-icon-size);
    block-size: var(--bg-icon-size);
    background: transparent;
    color: var(--bg-hero-visual-accent);
  }

  .bg-hero__checklist-item-copy {
    display: block;
    min-inline-size: 0;
  }

  .bg-hero__checklist-item-title {
    display: inline;
    margin-inline-end: 0.35rem;
    min-inline-size: 0;
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: break-word;
  }

  .bg-hero__checklist-item-title::after,
  .bg-hero__checklist-item-headline::after {
    content: '';
  }

  .bg-hero__checklist-item-headline {
    display: inline;
    margin-inline-end: 0.35rem;
    min-inline-size: 0;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: break-word;
  }

  .bg-hero__checklist-item-text {
    display: inline;
    min-inline-size: 0;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
    overflow-wrap: break-word;
  }

  @container (inline-size < 37.5rem) {
    .bg-hero__checklist-item {
      gap: 0.45rem;
    }
  }

  .bg-hero__visual-shell--compact .bg-hero__checklist {
    gap: 0.55rem;
  }

  @container (inline-size < 20rem) {
    .bg-hero__checklist-items {
      grid-template-rows: none;
      gap: 0.25rem;
    }

    .bg-hero__checklist-item {
      align-items: start;
      min-block-size: auto;
      overflow: visible;
      padding-block: 0.5rem;
    }

    .bg-hero__checklist-item-copy {
      display: grid;
      gap: 0.12rem;
    }

    .bg-hero__checklist-item-title,
    .bg-hero__checklist-item-headline,
    .bg-hero__checklist-item-text {
      display: block;
      margin-inline-end: 0;
    }
  }

  /* Summary visual: readable two-column cards, with a shared centre divider. */
  .bg-hero__summary {
    --bg-hero-summary-icon-size: 3rem;
    --bg-hero-summary-divider: color-mix(in srgb, var(--bg-hero-visual-text) 16%, transparent);
    grid-template-rows: auto auto auto;
    padding: var(--space-s);
  }

  .bg-hero__summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
    gap: 0;
    margin-block: var(--space-xs);
    min-inline-size: 0;
  }

  .bg-hero__summary-item {
    display: grid;
    grid-template-columns: var(--bg-hero-summary-icon-size) minmax(0, 1fr);
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    min-inline-size: 0;
    padding: calc(var(--space-xs) * 0.6);
  }

  .bg-hero__summary-item:nth-child(odd) {
    border-inline-end: 1px solid var(--bg-hero-summary-divider);
  }

  .bg-hero__summary-item:nth-child(-n + 2) {
    border-block-end: 1px solid var(--bg-hero-summary-divider);
  }

  .bg-hero__summary-icon {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-hero-summary-icon-size);
    block-size: var(--bg-hero-summary-icon-size);
    color: var(--bg-hero-visual-accent-text);
  }

  .bg-hero__summary-item-copy {
    display: grid;
    gap: calc(var(--space-xs) / 3);
    min-inline-size: 0;
  }

  .bg-hero__summary-item-title,
  .bg-hero__summary-item-text,
  .bg-hero__summary-item-headline {
    margin: 0;
    min-inline-size: 0;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }

  .bg-hero__summary-item-title {
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 800;
  }

  .bg-hero__summary-item-text {
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
  }

  .bg-hero__summary-item-headline {
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 800;
    letter-spacing: 0;
  }

  .bg-hero__summary-item:not(:has(.bg-hero__summary-icon)) {
    grid-template-columns: minmax(0, 1fr);
  }

  .bg-hero__visual-shell--compact .bg-hero__summary {
    --bg-hero-summary-icon-size: 2.5rem;
  }

  @container (inline-size < 86rem) {
    &.bg-hero--visual-summary .bg-hero__summary {
      --bg-hero-summary-icon-size: 2.5rem;
    }
  }

  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-summary .bg-hero__summary-grid {
      grid-template-columns: minmax(0, 1fr);
    }
    &.bg-hero--visual-summary .bg-hero__summary-item {
      border-inline-end: 0;
      border-block-end: 0;
    }
    &.bg-hero--visual-summary .bg-hero__summary-item:not(:last-child) {
      border-block-end: 1px solid var(--bg-hero-summary-divider);
    }
  }

  /* Text visuals grow with their content instead of clipping fixed-height rows. */
  &.bg-hero--visual-summary .bg-hero__visual-shell,
  &.bg-hero--visual-process .bg-hero__visual-shell,
  &.bg-hero--visual-summary .bg-hero__visual-panel,
  &.bg-hero--visual-process .bg-hero__visual-panel,
  &.bg-hero--visual-summary .bg-hero__visual-card,
  &.bg-hero--visual-process .bg-hero__visual-card {
    aspect-ratio: auto;
    block-size: auto;
  }

  /*
    Hero layout adjustments.
    The repeated base class preserves the existing selector priority.
  */
  &.bg-hero {
    --bg-hero-visual-compact-size: 25.5rem;
    --bg-hero-visual-circle-compact-size: 21rem;
  }

  &.bg-hero--heading-standard {
    --bg-hero-title-size: var(--h1);
  }

  &.bg-hero--heading-large {
    --bg-hero-title-size: calc(var(--h1) * 1.08);
  }

  &.bg-hero--heading-display {
    --bg-hero-title-size: calc(var(--h1) * 1.18);
  }

  &.bg-hero.bg-hero--visual-dashboard,
  &.bg-hero.bg-hero--visual-checklist,
  &.bg-hero.bg-hero--visual-mini-checklist,
  &.bg-hero.bg-hero--visual-summary,
  &.bg-hero.bg-hero--visual-process {
    --bg-hero-visual-standard-aspect: 1.08 / 1;
    --bg-hero-visual-compact-aspect: 1.08 / 1;
  }

  &.bg-hero.bg-hero--visual-mini-checklist {
    --bg-hero-visual-standard-size: 34rem;
    --bg-hero-visual-standard-aspect: 1.35 / 1;
    --bg-hero-visual-compact-aspect: 1.35 / 1;
  }

  &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual {
    justify-self: center;
    inline-size: min(100%, var(--bg-hero-visual-standard-size));
    max-inline-size: var(--bg-hero-visual-standard-size);
    margin-inline: auto;
  }

  &.bg-hero.bg-hero--visual-dashboard:has(.bg-hero__visual-shell--compact) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-checklist:has(.bg-hero__visual-shell--compact) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-summary:has(.bg-hero__visual-shell--compact) .bg-hero__visual,
  &.bg-hero.bg-hero--visual-process:has(.bg-hero__visual-shell--compact) .bg-hero__visual {
    inline-size: min(100%, var(--bg-hero-visual-compact-size));
    max-inline-size: var(--bg-hero-visual-compact-size);
  }

  &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-shell,
  &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-shell,
  &.bg-hero.bg-hero--visual-summary .bg-hero__visual-shell,
  &.bg-hero.bg-hero--visual-process .bg-hero__visual-shell,
  &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-card,
  &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-card,
  &.bg-hero.bg-hero--visual-summary .bg-hero__visual-card,
  &.bg-hero.bg-hero--visual-process .bg-hero__visual-card {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  @container (inline-size < 86rem) {
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) {
      --bg-hero-visual-share: var(--bg-hero-visual-compact-size);
      --bg-hero-visual-standard-size: var(--bg-hero-visual-compact-size);
    }

    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-compact-size));
      max-inline-size: var(--bg-hero-visual-compact-size);
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-header,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-header,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual-header,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual-header {
      gap: 0.9rem;
      padding-block-end: 0.2rem;
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-title,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-title,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual-title,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual-title {
      font-size: calc(var(--text-l) * 1.04);
    }

    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-subtitle,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-subtitle,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual-subtitle,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual-subtitle {
      margin-block-start: 0.2rem;
      font-size: var(--text-s);
      line-height: 1.2;
    }
  }

  @container (inline-size < 62rem) {
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background),
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) {
      --bg-hero-visual-standard-size: var(--bg-hero-visual-compact-size);
    }

    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-dashboard:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-checklist:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-summary:not(.bg-hero--image-background) .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-process:not(.bg-hero--image-background) .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-compact-size));
      max-inline-size: var(--bg-hero-visual-compact-size);
    }
  }

  @container (inline-size < 37.5rem) {
    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual,
    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual-shell,
    &.bg-hero.bg-hero--visual-dashboard .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-checklist .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-summary .bg-hero__visual-card,
    &.bg-hero.bg-hero--visual-process .bg-hero__visual-card {
      inline-size: min(100%, var(--bg-hero-visual-mobile-size));
      max-inline-size: var(--bg-hero-visual-mobile-size);
    }
  }

  /* The overlapping mini-checklist uses its full composition width, even when
     another visual has left the shared Size prop set to Compact. */
  &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__visual {
    justify-self: end;
    inline-size: min(100%, var(--bg-hero-visual-standard-size));
    max-inline-size: var(--bg-hero-visual-standard-size);
  }

  &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__visual-shell {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  /* Stack the mini-checklist slightly earlier, while retaining the same
     visual width as the two-column layout. */
  @container (inline-size < 72rem) {
    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__layout {
      grid-template-columns: 1fr;
    }

    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__visual {
      justify-self: start;
      margin-block-start: 2rem;
      inline-size: min(100%, calc(var(--bg-hero-visual-standard-size) * 1.3));
      max-inline-size: calc(var(--bg-hero-visual-standard-size) * 1.3);
      margin-block-end: 3rem;
    }

    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__visual-shell {
      inline-size: min(100%, calc(var(--bg-hero-visual-standard-size) * 1.3));
      max-inline-size: calc(var(--bg-hero-visual-standard-size) * 1.3);
      aspect-ratio: auto;
      overflow: visible;
    }

    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__mini-checklist-art {
      justify-items: start;
      transform: translateY(-25%);
    }

    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__mini-checklist-svg {
      inline-size: 100%;
      max-inline-size: 100%;
    }

    &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__visual-card--mini-checklist {
      align-self: start;
      inline-size: min(70%, 16.5rem);
      max-inline-size: 16.5rem;
    }

  }

  /* The hero visual rule centres compact panels by default. On wider
     split heroes, align the panel to the outer edge and let the copy use the
     otherwise empty column gap. */
  @container (inline-size >= 62rem) {
    &.bg-hero:not(.bg-hero--visual-mini-checklist):not(.bg-hero--visual-image.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__layout {
      grid-template-columns: minmax(0, 1fr) minmax(0, var(--bg-hero-visual-compact-size));
    }

    &.bg-hero:not(.bg-hero--visual-mini-checklist):not(.bg-hero--visual-image.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__visual {
      justify-self: end;
      margin-inline: 0;
    }
  }

  .bg-hero__title mark {
    display: inline;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--bg-hero-accent);
    font: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-shadow: var(--bg-hero-title-accent-shadow);
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__title mark {
    position: relative;
    isolation: isolate;
    padding: 0 0.08em 0.01em;
    border-radius: var(--radius);
    background: transparent;
    box-shadow: none;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }

  &.bg-hero--visual-image.bg-hero--image-background .bg-hero__title mark::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0.2em 0 0.15em;
    border-radius: inherit;
    background: var(--bg-hero-title-accent-highlight);
    box-shadow: inset 0 0 0 1px var(--bg-hero-title-accent-highlight-border);
    pointer-events: none;
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-light,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-light,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-light {
    --bg-hero-background-wash: var(--text-light);
    --bg-hero-content-heading: var(--text-dark);
    --bg-hero-content-text: var(--text-dark);
    --bg-hero-content-muted: var(--text-dark);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-dark,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-dark,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-dark {
    --bg-hero-background-wash: var(--text-dark);
    --bg-hero-content-heading: var(--text-light);
    --bg-hero-content-text: var(--text-light);
    --bg-hero-content-muted: var(--text-light);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-light:not(.bg-hero--accent-colour-heading),
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-light:not(.bg-hero--accent-colour-heading),
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-light:not(.bg-hero--accent-colour-heading) {
    --bg-hero-title-accent-highlight: color-mix(in srgb, var(--bg-hero-accent-surface) 72%, transparent);
    --bg-hero-title-accent-highlight-border: color-mix(in srgb, var(--bg-hero-accent-border) 22%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-dark:not(.bg-hero--accent-colour-heading),
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-dark:not(.bg-hero--accent-colour-heading),
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-dark:not(.bg-hero--accent-colour-heading) {
    --bg-hero-title-accent-highlight: color-mix(in srgb, var(--bg-hero-accent-surface) 66%, transparent);
    --bg-hero-title-accent-highlight-border: color-mix(in srgb, var(--bg-hero-accent-border) 26%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-light .bg-hero__background::after,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-subtle-dark .bg-hero__background::after {
    background: color-mix(in srgb, var(--bg-hero-background-wash) 22%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-light .bg-hero__background::after,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-balanced-dark .bg-hero__background::after {
    background: color-mix(in srgb, var(--bg-hero-background-wash) 34%, transparent);
  }

  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-light .bg-hero__background::after,
  &.bg-hero--visual-image.bg-hero--image-background.bg-hero--image-readability-strong-dark .bg-hero__background::after {
    background: color-mix(in srgb, var(--bg-hero-background-wash) 46%, transparent);
  }

  /* Standard and curved images: display mode, shape and responsive scaling. */

  &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--compact {
    inline-size: min(100%, var(--bg-hero-visual-standard-size));
    max-inline-size: var(--bg-hero-visual-standard-size);
    aspect-ratio: var(--bg-hero-visual-standard-aspect);
  }

  &.bg-hero--visual-image.bg-hero--image-display-full:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--image,
  &.bg-hero--visual-image.bg-hero--image-display-full:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-panel--image {
    block-size: auto;
    height: auto;
    aspect-ratio: auto;
  }

  &.bg-hero--visual-image.bg-hero--image-display-full:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-image,
  &.bg-hero--visual-image.bg-hero--image-display-full:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-image picture,
  &.bg-hero--visual-image.bg-hero--image-display-full:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-image img {
    block-size: auto;
    height: auto;
    aspect-ratio: auto;
    object-fit: contain;
  }

  &.bg-hero--visual-image.bg-hero--image-display-square:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--image {
    aspect-ratio: 1;
  }

  &.bg-hero--visual-image.bg-hero--image-curved .bg-hero__visual-shell--image {
    border-radius: var(--bg-hero-image-curve-radius) 0 0 var(--bg-hero-image-curve-radius);
  }

  &.bg-hero--visual-image.bg-hero--image-curved.bg-hero--image-curve-right .bg-hero__visual-shell--image {
    border-radius: 0 var(--bg-hero-image-curve-radius) var(--bg-hero-image-curve-radius) 0;
  }

  &.bg-hero--visual-image.bg-hero--image-curved .bg-hero__visual-image {
    border-radius: inherit;
  }

  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-image.bg-hero--image-curved .bg-hero__visual-shell--image {
      border-radius: var(--bg-hero-image-curve-radius) 0 0 var(--bg-hero-image-curve-radius);
    }

    &.bg-hero--visual-image.bg-hero--image-curved.bg-hero--image-curve-right .bg-hero__visual-shell--image {
      border-radius: 0 var(--bg-hero-image-curve-radius) var(--bg-hero-image-curve-radius) 0;
    }
  }

  @container (inline-size >= 80rem) {
    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__layout,
    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__layout,
    &.bg-hero.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__layout,
    &.bg-hero.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__layout {
      grid-template-columns: minmax(0, 1fr) minmax(0, 44rem);
    }

    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual {
      justify-self: end;
    }

    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual {
      justify-self: start;
    }

    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) {
      overflow-x: clip;
    }
  }

  @container (inline-size >= 62rem) {
    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background):not(.bg-hero--image-scale-large):not(.bg-hero--image-scale-right-bleed):has(.bg-hero__visual-shell--compact) .bg-hero__layout {
      grid-template-columns: minmax(var(--bg-hero-content-min), var(--bg-hero-content-share)) minmax(var(--bg-hero-visual-min), var(--bg-hero-visual-share));
    }

    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background) {
      --bg-hero-visual-share: clamp(28rem, 41cqw, var(--bg-hero-visual-standard-size));
    }

    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--image {
      inline-size: clamp(32rem, 55cqw, 44rem);
      max-inline-size: 44rem;
    }

    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual {
      inline-size: min(56cqw, 52rem);
      max-inline-size: none;
      transform: translateX(clamp(3rem, 7vw, 7rem));
    }

    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--image {
      inline-size: 100%;
      max-inline-size: none;
    }
  }

  @container (inline-size < 86rem) {
    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background):not(.bg-hero--image-scale-large):not(.bg-hero--image-scale-right-bleed) .bg-hero__visual,
    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background):not(.bg-hero--image-scale-large):not(.bg-hero--image-scale-right-bleed) .bg-hero__visual-shell--image {
      inline-size: min(100%, clamp(28rem, 41cqw, var(--bg-hero-visual-standard-size)));
      max-inline-size: clamp(28rem, 41cqw, var(--bg-hero-visual-standard-size));
    }
  }

  @container (inline-size < 62rem) {
    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero--visual-image:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual-shell--image {
      inline-size: min(100%, 44rem);
      max-inline-size: 44rem;
    }
  }

  @container (inline-size >= 62rem) and (inline-size < 80rem) {
    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__layout,
    &.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__layout,
    &.bg-hero.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__layout,
    &.bg-hero.bg-hero--visual-image.bg-hero--image-scale-right-bleed:not(.bg-hero--image-circle):not(.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__layout {
      grid-template-columns: 32rem minmax(0, 1fr);
    }

    &.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background) .bg-hero__visual,
    &.bg-hero.bg-hero--visual-image.bg-hero--image-scale-large:not(.bg-hero--image-circle):not(.bg-hero--image-background):has(.bg-hero__visual-shell--compact) .bg-hero__visual {
      justify-self: start;
      margin-inline: 0;
    }
  }

  /* When the image is hidden, background colours must win over readability presets. */
  @container (inline-size < 37.5rem) {
    &.bg-hero.bg-hero--visual-image.bg-hero--image-background.bg-hero--background-image-mobile-hide {
      --bg-hero-content-heading: var(--relative-heading-color, var(--heading-color));
      --bg-hero-content-text: var(--relative-text-color, var(--text-color));
      --bg-hero-content-muted: var(--relative-text-color, var(--text-color));
      --bg-hero-title-accent-shadow: none;
      --bg-hero-title-accent-highlight: transparent;
      --bg-hero-title-accent-highlight-border: transparent;

      min-block-size: auto;
    }
  }

  /* Shared Icon components fit the existing visual markers. */
  .bg-hero__checklist-item-icon > .bg-icon,
  .bg-hero__summary-icon > .bg-icon {
    --bg-icon-size: 100%;
    color: inherit;
  }




  /* Photos share the card’s vertical centre; illustration offsets apply only to SVGs. */
  &.bg-hero.bg-hero--visual-mini-checklist .bg-hero__mini-checklist-art--image {
    transform: none;
  }

  /* Readable shared headings and footer copy for the four main visual cards. */
  &.bg-hero:is(.bg-hero--visual-summary, .bg-hero--visual-process, .bg-hero--visual-checklist, .bg-hero--visual-dashboard) {
    & .bg-hero__visual-kicker,
    & .bg-hero__visual-footer-text {
      font-size: var(--text-s);
      line-height: 1.25;
    }

    & .bg-hero__visual-title {
      font-size: calc(var(--text-l) * 1.1);
      line-height: 1.1;
    }

    & .bg-hero__visual-shell--compact .bg-hero__visual-title {
      font-size: calc(var(--text-l) * 0.95);
    }

    @container (inline-size < 86rem) {
      & .bg-hero__visual-title {
        font-size: calc(var(--text-l) * 0.95);
      }
    }

    @container (inline-size < 37.5rem) {
      & .bg-hero__visual-title,
      & .bg-hero__visual-shell--compact .bg-hero__visual-title {
        font-size: calc(var(--text-m) * 1.05);
      }
    }
  }

/* Badge colours use ACSS directly; plain and dark text-led treatments above remain in charge. */
&:not(.bg-hero--eyebrow-plain) .bg-hero__eyebrow:not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary, .bg-hero__eyebrow--accent, .bg--light, .bg--ultra-light, .bg--dark, .bg--ultra-dark)) { background: var(--bg-light); color: var(--bg-light-link, var(--primary-semi-dark)); }


  /* Compact headings reuse the existing Cards layout for descriptive highlights. */
  &.bg-hero--stat-type-highlights.bg-hero--stat-layout-cards {
    & .bg-hero__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    & .bg-hero__stat {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      align-content: start;
      gap: var(--space-xs);
      padding: var(--space-m);
      border: 1px solid var(--border-color-dark);
      box-shadow: none;
    }
    /* ACSS Panel owns the background and foreground relationship. */
    & .bg-hero__stat-value {
      color: var(--relative-heading-color, var(--heading-color));
      font-size: var(--text-l);
      font-weight: var(--heading-font-weight);
      line-height: 1.2;
      text-wrap: pretty;
      overflow-wrap: normal;
    }
    & .bg-hero__stat-label {
      color: var(--relative-text-color, var(--text-color));
      font-size: var(--text-s);
      font-weight: 400;
      line-height: 1.5;
      margin-block-start: calc(var(--space-xs) / 2);
    }
    @container (inline-size < 70rem) {
      & .bg-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; }
    }
    @container (inline-size < 37.5rem) {
      & .bg-hero__stats { grid-template-columns: minmax(0, 1fr); }
    }
  }

/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-hero__eyebrow.bg-hero__eyebrow--accent {
  --bg-decoration-surface: var(--body-bg-color);
  background-color: var(--bg-decoration-surface);
}

/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
&:not(.bg-hero--eyebrow-plain) .bg-hero__eyebrow.bg--light {
  --relative-text-color: var(--bg-soft-primary-text);
  --relative-heading-color: var(--bg-soft-primary-text);
  --icon-color: var(--bg-soft-primary-text);
  color: var(--relative-text-color);
}
.bg-hero__eyebrow.bg-hero__eyebrow--accent.bg--ultra-light {
  --relative-text-color: var(--bg-soft-primary-text);
  --relative-heading-color: var(--bg-soft-primary-text);
  --icon-color: var(--bg-soft-primary-text);
  color: var(--relative-text-color);
}

/* Optional Primary image washes. ACSS owns the colour family and dark text palette.
   Values end in "-dark" to use Hero 01's existing light-content prop mapping. */
&.bg-hero--visual-image.bg-hero--image-background:is(
  .bg-hero--image-readability-primary-balanced-dark,
  .bg-hero--image-readability-primary-strong-dark,
  .bg-hero--image-readability-primary-maximum-dark
) {
  --bg-hero-background-wash: var(--primary-dark);
  --bg-hero-content-heading: var(--bg-dark-heading);
  --bg-hero-content-text: var(--bg-dark-text);
  --bg-hero-content-muted: var(--bg-dark-text);
  --bg-hero-accent: var(--primary-light);
  --bg-hero-title-accent-highlight: transparent;
  --bg-hero-title-accent-highlight-border: transparent;
  --bg-hero-wash-near: 40%;
  --bg-hero-wash-middle: 25%;
  --bg-hero-wash-far: 8%;
  --bg-hero-wash-mobile: 50%;

  & .bg-hero__background::after {
    background: linear-gradient(90deg,
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-near), transparent),
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-middle), transparent) 65%,
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-far), transparent));
  }
  &.bg-hero--content-centre .bg-hero__background::after {
    background: radial-gradient(ellipse at center,
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-near), transparent) 30%,
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-middle), transparent) 70%,
      color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-far), transparent));
  }
  &.bg-hero--image-readability-primary-strong-dark {
    --bg-hero-wash-near: 55%;
    --bg-hero-wash-middle: 36%;
    --bg-hero-wash-far: 13%;
    --bg-hero-wash-mobile: 65%;
  }
  &.bg-hero--image-readability-primary-maximum-dark {
    --bg-hero-wash-near: 70%;
    --bg-hero-wash-middle: 48%;
    --bg-hero-wash-far: 18%;
    --bg-hero-wash-mobile: 78%;
  }

  /* Native outline buttons need the dark relationship foreground over the photo. */
  & .bg-hero__actions .btn--primary.btn--outline {
    --btn-text-color: var(--bg-hero-button-outline-text);
    --btn-border-color: var(--bg-hero-button-outline-text);
    --btn-background-hover: var(--bg-hero-button-outline-surface-hover);
    --btn-text-color-hover: var(--bg-hero-button-outline-text-hover);
    --btn-border-color-hover: var(--bg-hero-button-outline-surface-hover);
  }
  /* Descendants query the hero width, including inside the builder canvas. */
  @container (inline-size < 48rem) {
    & .bg-hero__background::after,
    &.bg-hero--content-centre .bg-hero__background::after {
      background: color-mix(in oklch, var(--bg-hero-background-wash) var(--bg-hero-wash-mobile), transparent);
    }
  }
  /* Preserve the existing mobile image-hide control. */
  @container (inline-size < 37.5rem) {
    &.bg-hero--background-image-mobile-hide .bg-hero__inner {
      --bg-hero-content-heading: var(--relative-heading-color, var(--heading-color));
      --bg-hero-content-text: var(--relative-text-color, var(--text-color));
      --bg-hero-content-muted: var(--bg-hero-content-text);
      --bg-hero-accent: var(--bg-brand-accent, var(--primary));
      --bg-hero-button-outline-text: var(--relative-link-color, var(--link-color));
      --bg-hero-button-outline-surface-hover: var(--relative-link-color, var(--link-color));
      --bg-hero-button-outline-text-hover: var(--bg-accent-on-solid, var(--text-light));
    }
  }
}
/* Header overlap only adds space when the shared header activates it. */
&.is-header-overlay > .bg-hero__inner {
  padding-block-start: var(--bg-hero-header-height, 0px);
}

/* Background photographs use one calm layout; stored choices resume in other designs. */
&.bg-hero--visual-image.bg-hero--image-background {
  --bg-hero-title-measure: 22ch;
  --bg-hero-content-max: 38rem;
  --bg-hero-title-size: max(var(--text-xl), calc(var(--h1) * .8));
  --bg-hero-lede-gap-after: 0;

  & .bg-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    inline-size: min(100%, var(--bg-hero-content-max));
    text-align: start;
    margin-inline: 0;
  }
  & .bg-hero__title { max-inline-size: 100%; font-size: var(--bg-hero-title-size); }
  & .bg-hero__lede { max-inline-size: 48ch; }
  & .bg-hero__actions {
    justify-content: flex-start;
    margin-block-start: var(--space-s);
  }
  & .bg-hero__inner { gap: var(--space-l); }
  & .bg-hero__stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-l);
    margin-block-start: var(--space-l);
    padding: 0;
    align-items: start;
  }
  & .bg-hero__stat {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: start;
  }
  & .bg-hero__stat:not(:last-of-type) { border: 0; }
  & .bg-hero__stat-value {
    font-size: var(--h3);
    line-height: 1.15;
    color: var(--bg-hero-content-heading);
    text-wrap: pretty;
  }
  & .bg-hero__stat-label {
    color: var(--bg-hero-content-text);
    font-size: var(--text-s);
    font-weight: 400;
    line-height: 1.5;
  }
  & .bg-hero__trustline,
  & .bg-hero__compact-trust {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--bg-hero-content-text);
    font-size: var(--text-s);
    line-height: 1.5;
    gap: var(--space-xs) var(--space-s);
    opacity: 1;
  }
  & .bg-hero__trustline::before,
  & .bg-hero__compact-trust::before { content: none; }
  & .bg-hero__trustline-item { gap: calc(var(--space-xs) / 2); }
  & .bg-hero__trustline-item + .bg-hero__trustline-item { padding-inline-start: var(--space-s); }
  & .bg-hero__trustline-item + .bg-hero__trustline-item::before {
    inline-size: .2rem;
    border-radius: 50%;
    background: currentColor;
    transform: translate(-50%, -50%);
    inset-inline-start: 0;
  }
  & .bg-hero__credential { margin-inline-start: auto; }
  & .bg-hero__credential-badge { font-weight: 600; letter-spacing: .04em; }
  & .bg-hero__google-mark { inline-size: 1.15rem; block-size: 1.15rem; }

  /* Separate lower wash leaves the chosen upper wash and photograph intact. */
  & .bg-hero__background::before {
    content: '';
    position: absolute;
    inset: 35% 0 0;
    z-index: 1;
    background: linear-gradient(to bottom,
      transparent,
      color-mix(in oklch, var(--bg-hero-background-wash) 70%, transparent) 65%,
      color-mix(in oklch, var(--bg-hero-background-wash) 90%, transparent));
    pointer-events: none;
  }
  @container (inline-size < 60rem) {
    & .bg-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-m); }
    & .bg-hero__credential { margin-inline-start: 0; }
  }
  @container (inline-size < 37.5rem) {
    & .bg-hero__content { inline-size: 100%; }
    & .bg-hero__stats { margin-block-start: var(--space-s); }
    & .bg-hero__trustline { align-items: flex-start; }
    & .bg-hero__trustline-item { flex-wrap: wrap; }
    & .bg-hero__trustline-item + .bg-hero__trustline-item { padding-inline-start: 0; }
    & .bg-hero__trustline-item + .bg-hero__trustline-item::before { content: none; }
  }
}


/* Background-image refinements: closer desktop copy and cards without a mobile photo. */
&.bg-hero--visual-image.bg-hero--image-background {
  @media (width >= 60rem) {
    padding-block-start: max(var(--space-l), calc(var(--section-padding-block) - var(--space-m)));
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--background-image-mobile-hide {
      & .bg-hero__stats { gap: var(--space-s); align-items: stretch; }
      & .bg-hero__stat {
        padding: var(--space-s);
        border-radius: var(--bg-hero-card-radius);
        background: var(--bg-light);
      }
      & .bg-hero__stat-value { color: var(--bg-light-heading, var(--heading-color)); }
      & .bg-hero__stat-label { color: var(--bg-light-text, var(--text-color)); }
    }
  }
}


/* Separate photographs: one shape-following shadow with a close edge and downward lift. */
&.bg-hero--visual-image:is(.bg-hero--image-card, .bg-hero--image-curved, .bg-hero--image-circle) {
  --bg-hero-image-shadow:
    0 .65rem 1.1rem -.25rem color-mix(in srgb, var(--text-dark) 28%, transparent),
    0 .15rem .35rem color-mix(in srgb, var(--text-dark) 16%, transparent);

  & .bg-hero__visual-shell--image { box-shadow: var(--bg-hero-image-shadow); }
}

/* Optional desktop minimum: content can grow; smaller screens stay natural. */
@media (width >= 62rem) {
  &.bg-hero.bg-hero--height-screen {
    min-block-size: max(0px, calc(100svh - var(--bg-hero-viewport-offset, 0px)));
    justify-content: center;
  }
}


/* Click-to-play YouTube visual. ACSS controls colours, spacing and radius. */
&.bg-hero--visual-video {
  /* Only Standard needs the quieter heading and closer columns. Compact keeps the selected heading size and normal gap. */
  &:not(:has(.bg-hero__video--compact)) .bg-hero__title { font-size: min(var(--bg-hero-title-size), calc(var(--h1) * .9)); }
  &:not(:has(.bg-hero__video--compact)) .bg-hero__layout { gap: var(--space-l); }
  & .bg-hero__video-visual {
    inline-size: 100%;
    max-inline-size: 44rem;
    justify-self: end;
  }
  & .bg-hero__video-visual:has(.bg-hero__video--compact) { max-inline-size: 30rem; }

  /* Change the tracks as well as the cap: both sizes must not share one narrow column. */
  @container (inline-size >= 62rem) {
    & .bg-hero__layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
    &:has(.bg-hero__video--compact) .bg-hero__layout {
      grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr);
    }
  }
  @container (inline-size < 62rem) {
    & .bg-hero__video-visual { justify-self: start; }
  }
}
.bg-hero__video-frame {
  position: relative;
  inline-size: 100%;
  aspect-ratio: 16 / 9;
  min-block-size: 200px;
  overflow: hidden;
  border-radius: var(--radius);
}
.bg-hero__video-cover,
.bg-hero__video-player {
  display: block;
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  border: 0;
}
.bg-hero__video-cover { object-fit: cover; }
.bg-hero__video-play {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  position: absolute;
  /* Centre the control within the lower third at every video size. */
  inset: 83.333333% 0 auto;
  margin: 0 auto;
  transform: translateY(-50%);
  inline-size: max-content;
  block-size: max-content;
  min-block-size: 44px;
  z-index: 1;
}
.bg-hero__video-play::before {
  content: '';
  inline-size: .75em;
  block-size: .85em;
  background: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.bg-hero__video-play:focus-visible { outline-offset: 4px; }
.bg-hero__video-status {
  display: grid;
  place-items: center;
  min-block-size: 200px;
  padding: var(--space-m);
  margin: 0;
}
.bg-hero__video [hidden] { display: none; }


/* Shared hero pattern and glow. Edit the pattern here once for every hero.
   Native accent colours follow the accountant's configured background pairing. */
position: relative;
isolation: isolate;
overflow-x: clip;

/* One pattern source: change these two gradients to a radial dot pattern here. */
&::before {
  --bg-hero-grid-line: color-mix(in srgb, var(--bg-brand-accent, var(--primary)) 13%, transparent);
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    linear-gradient(to right, var(--bg-hero-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--bg-hero-grid-line) 1px, transparent 1px);
  background-size: 4rem 4rem;
  background-position: center top;
  mask-image:
    linear-gradient(to right, rgb(0 0 0 / .18), rgb(0 0 0 / .35) 40%, black 78%),
    linear-gradient(to bottom, transparent, black 12%, black 78%, transparent);
  mask-composite: intersect;
}

/* Keep decoration above background photographs and below all content. */
& .bg-hero__inner,
&.bg-hero--visual-image.bg-hero--image-background .bg-hero__inner {
  position: relative;
  z-index: 2;
}
& .bg-hero__visual {
  position: relative;
  isolation: isolate;
}

& .bg-hero__visual::before,
&:not(:has(.bg-hero__visual))::after {
  content: '';
  position: absolute;
  pointer-events: none;
  background: radial-gradient(ellipse at 60% 45%,
    color-mix(in srgb, var(--bg-brand-accent, var(--primary)) 52%, transparent),
    color-mix(in srgb, var(--bg-brand-accent, var(--primary)) 24%, transparent) 32%,
    transparent 65%);
  filter: blur(24px);
  opacity: .65;
}

/* A concentrated halo behind artwork or video. */
& .bg-hero__visual::before {
  z-index: -1;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  transform: translate(-50%, -50%);
  inline-size: 155%;
  aspect-ratio: 1;
  border-radius: 50%;
}

/* Text-only and background-photo heroes place the same glow to the right. */
&:not(:has(.bg-hero__visual))::after {
  z-index: 1;
  inset: 0 0 0 25%;
}

@container (inline-size < 37.5rem) {
  &::before {
    background-size: 3rem 3rem;
    opacity: .55;
    mask-image: linear-gradient(to bottom, rgb(0 0 0 / .25), black 45%, black 80%, transparent);
  }
  & .bg-hero__visual::before { inline-size: 135%; }
  &:not(:has(.bg-hero__visual))::after { inset-inline-start: 0; }
}

/* Reduced-motion visitors retain the static glow; no JavaScript needed. */
@media (prefers-reduced-motion: no-preference) {
  & .bg-hero__visual::before,
  &:not(:has(.bg-hero__visual))::after {
    animation: bg-glow-breathe 10s ease-in-out infinite;
  }
}

/* Pointer response moves only the existing glow, never content or scrolling. */
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  &.u-motion-pointer .bg-hero__visual::before,
  &.u-motion-pointer:not(:has(.bg-hero__visual))::after {
    translate: var(--bg-motion-glow-x, 0px) var(--bg-motion-glow-y, 0px);
    transition: translate 650ms var(--bg-motion-ease, ease-out);
  }
}

/* Text-led heroes can align both columns at the top. */
&.bg-hero--vertical-top .bg-hero__layout { align-items: start; }
/* A custom statistics slot owns its internal grid; do not cap its parent tracks. */
&.bg-hero--stat-layout-custom .bg-hero__stats { grid-template-columns: minmax(0, 1fr); }

}
.bg-content-list-02 {
  container-type: inline-size;

  & .bg-content-list-02__container {
    display: grid;
    grid-template-columns: minmax(0, 21.25rem) minmax(0, 1fr);
    align-items: start;
    column-gap: clamp(5rem, 8cqi, 8rem);
    row-gap: var(--space-xl);
  }

  & .bg-content-list-02__aside {
    display: grid;
    align-content: start;
    justify-items: start;
    gap: var(--space-m);
  }

  & .bg-content-list-02__head {
    max-inline-size: 23.75rem;
  }

  & .bg-content-list-02__list {
    display: grid;
    margin: 0;
    padding: 0;
    counter-reset: bg-content-list-02-item;
    list-style: none;
  }

  & .bg-content-list-02__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-m);
    padding-block: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    counter-increment: bg-content-list-02-item;
  }

  & .bg-content-list-02__item:last-child {
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  & .bg-content-list-02__item:nth-child(4n + 1) {
    --bg-content-list-02-number-color: var(--primary);
  }

  & .bg-content-list-02__item:nth-child(4n + 2) {
    --bg-content-list-02-number-color: var(--secondary-semi-dark);
  }

  & .bg-content-list-02__item:nth-child(4n + 3) {
    --bg-content-list-02-number-color: var(--secondary-semi-dark);
  }

  & .bg-content-list-02__item:nth-child(4n) {
    --bg-content-list-02-number-color: var(--tertiary);
  }

  & .bg-content-list-02__number {
    min-inline-size: 3rem;
    color: var(--bg-content-list-02-number-color);
    font-size: var(--h3);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
  }

  & .bg-content-list-02__number::before {
    content: counter(bg-content-list-02-item, decimal-leading-zero);
  }

  & .bg-content-list-02__copy {
    display: grid;
    gap: 0;
    min-inline-size: 0;
  }

  & .bg-content-list-02__title {
    font-size: var(--h4);
    font-weight: 800;
    line-height: 1.2;
    text-wrap: balance;
  }

  & .bg-content-list-02__text {
    max-inline-size: 68ch;
    font-size: var(--text-m);
    line-height: 1.55;
    text-wrap: pretty;
  }

  @container (inline-size < 58rem) {
    & .bg-content-list-02__container {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }

    & .bg-content-list-02__head {
      max-inline-size: 38.75rem;
    }
  }

  @container (inline-size < 38rem) {
    & .bg-content-list-02__item {
      gap: var(--space-s);
      padding-block: var(--space-s);
    }

    & .bg-content-list-02__number {
      min-inline-size: 2.375rem;
      font-size: var(--h4);
    }
  }
  & .bg-content-list-02__title + .bg-content-list-02__text { margin-block-start: var(--paragraph-spacing); }
}
.bg-beangrower-ai-cta {
  min-inline-size: 0;

  .bg-beangrower-ai-cta__content {
    position: relative;
    z-index: 1;
    display: grid;
    row-gap: 0;
    align-content: center;
  }

  .bg-beangrower-ai-cta__intro {
    max-inline-size: 40.625rem;
    /* Preserve the original heading-to-introduction spacing. */
    margin: calc(var(--space-m) - var(--space-xs)) 0 0;
  }

  .bg-beangrower-ai-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-s);
    /* Half the previous grid gap plus action margin. */
    margin-block-start: calc((var(--space-m) + var(--space-xs)) / 2);
  }

  .bg-beangrower-ai-cta__actions .bg-button {
    min-inline-size: min(100%, 16.25rem);
    justify-content: center;
  }

  .bg-beangrower-ai-cta__reassurance {
    display: grid;
    grid-template-columns: 3.25rem minmax(0, 1fr);
    align-items: center;
    gap: var(--space-s);
    max-inline-size: 40.625rem;
    margin: calc((var(--space-m) + var(--space-xs)) / 2) 0 0;
    padding-block-start: calc(var(--space-s) / 2);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-beangrower-ai-cta__reassurance-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 3.25rem;
    block-size: 3.25rem;
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-cta__reassurance-icon svg {
    display: block;
    inline-size: 2.125rem;
    block-size: 2.125rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.65;
  }

  .bg-beangrower-ai-cta__reassurance p {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-beangrower-ai-cta__visual {
    position: relative;
    z-index: 1;
    display: grid;
    align-self: center;
    justify-self: end;
    inline-size: 100%;
    min-inline-size: 0;
    margin: 0;
  }

  .bg-beangrower-ai-cta__visual > :is(img, svg) {
    display: block;
    inline-size: min(100%, 47.5rem);
    max-inline-size: 100%;
    block-size: auto;
    margin: 0;
  }

  @container (inline-size < 75rem) {
    .bg-beangrower-ai-cta__actions .bg-button {
      min-inline-size: 0;
    }

    .bg-beangrower-ai-cta__visual > :is(img, svg) {
      inline-size: 100%;
    }
  }

  @container (inline-size < 60rem) {
    

    

    .bg-beangrower-ai-cta__visual {
      inline-size: min(100%, 45rem);
      justify-self: center;
    }

    .bg-beangrower-ai-cta__visual > :is(img, svg) {
      inline-size: 100%;
    }
  }

  @container (inline-size < 40rem) {
    .bg-beangrower-ai-cta__actions {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      inline-size: 100%;
    }

    .bg-beangrower-ai-cta__actions .bg-button-wrap,
    .bg-beangrower-ai-cta__actions .bg-button {
      inline-size: 100%;
    }

    .bg-beangrower-ai-cta__reassurance {
      grid-template-columns: 2.75rem minmax(0, 1fr);
      gap: var(--space-xs);
    }

    .bg-beangrower-ai-cta__reassurance-icon {
      inline-size: 2.75rem;
      block-size: 2.75rem;
    }

    .bg-beangrower-ai-cta__reassurance-icon svg {
      inline-size: 1.8125rem;
      block-size: 1.8125rem;
    }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  &.bg-beangrower-ai-cta__artwork { position: relative; isolation: isolate; overflow: clip; align-self: center; }


  .bg-beangrower-ai-cta__demo-note { flex-basis: 100%; margin: 0; font-size: var(--text-s); line-height: 1.4; }

  .bg-beangrower-ai-cta__reassurance-icon { color: var(--primary); }
}
.bg-mctb-setup {
    /* Darker connector for this checklist only; shared Reviews styling stays unchanged. */
  &.bg-reviews-setup .bg-reviews-setup__item:not(:last-child)::before {
    background: var(--primary-semi-light);
  }

}
.bg-mctb-calculator {
  
  min-inline-size: 0;
  &.bg-mctb-calculator__form, &.bg-mctb-calculator__results { align-self: stretch; padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-mctb-calculator__fields { display: flex; flex-direction: column; gap: var(--space-m); min-inline-size: 0; margin: 0; padding: 0; border: 0; }
  .bg-mctb-calculator__form-title { inline-size: 100%; padding: 0 0 var(--space-m); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.35; }
  .bg-mctb-calculator__field { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-mctb-calculator__label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 600; line-height: 1.4; }
  .bg-mctb-calculator__input-wrap { display: flex; align-items: center; gap: var(--space-xs); min-inline-size: 0; padding-inline: var(--space-s); border: 2px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 20%, transparent); border-radius: var(--radius);  }
  .bg-mctb-calculator__input-wrap:focus-within { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: 3px; }
  .bg-mctb-calculator__input { inline-size: 100%; min-inline-size: 0; min-block-size: 3rem; padding-block: var(--space-xs); padding-inline: 0; border: 0; border-radius: 0; background: transparent; color: var(--relative-heading-color, var(--heading-color)); font: inherit; font-size: var(--text-l); font-weight: 700; }
  .bg-mctb-calculator__input:focus { outline: none; }
  .bg-mctb-calculator__affix { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-l); font-weight: 700; }
  .bg-mctb-calculator__hint { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-mctb-calculator__error { padding: var(--space-s); border-radius: var(--radius); font-size: var(--text-m); }
  .bg-mctb-calculator__fields .bg-button-wrap, .bg-mctb-calculator__fields .bg-button { inline-size: 100%; }
  .bg-mctb-calculator__fields .bg-button { justify-content: center; }
  &.bg-mctb-calculator__results { display: flex; flex-direction: column; justify-content: center; gap: var(--space-m); }
  .bg-mctb-calculator__results-title { color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; }
  .bg-mctb-calculator__metric { display: grid; gap: var(--space-xs); min-inline-size: 0; padding: var(--space-m); border-radius: var(--radius); }
  .bg-mctb-calculator__number { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: 700; line-height: 1.1; overflow-wrap: anywhere; }
  .bg-mctb-calculator__metric-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.4; }
  .bg-mctb-calculator__explanation { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  .bg-mctb-calculator__disclaimer { max-inline-size: var(--width-l); margin-inline: auto; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; text-align: center; }
  @container (inline-size < 36rem) {
    &.bg-mctb-calculator__form, &.bg-mctb-calculator__results { padding: var(--space-m); }
  }

}
.bg-footer {
  container-name: bg-footer;
container-type: inline-size;
padding-block: var(--section-space-s) var(--space-l);
padding-inline: var(--gutter);
--bg-footer-social-box-size: calc(var(--icon-size-m) * 1.2);
--bg-footer-social-icon-size: calc(var(--icon-size-s) * 1.25);
--bg-footer-contact-icon-box-size: var(--icon-size-m);
--bg-footer-contact-icon-size: calc(var(--icon-size-m) * 0.8);
.bg-footer__container {
    display: grid;
    gap: var(--space-l);
  }
.bg-footer__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
    gap: var(--space-l);
    padding-block-end: var(--space-l);
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }
.bg-footer__brand {
    display: grid;
    align-content: start;
    gap: var(--space-s);
  }
.bg-footer__brand-row {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
  }
.bg-footer__logo {
    display: block;
    inline-size: auto;
    max-inline-size: 11.25rem;
    max-block-size: 3rem;
    object-fit: contain;
  }
.bg-footer__description {
    max-inline-size: 36ch;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    line-height: 1.6;
  }
.bg-footer__social {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--space-xs) / 2);
    padding: 0;
    list-style: none;
  }
.bg-footer__social a {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-footer-social-box-size);
    block-size: var(--bg-footer-social-box-size);
    border-radius: var(--radius);
    color: var(--relative-heading-color, var(--heading-color));
    text-decoration: none;
    transition:
      background-color var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing);
    background-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 9%, transparent);
  }
.bg-footer__social a:hover,
  .bg-footer__social a:focus-visible {
    background-color: var(--bg-light);
    color: var(--bg-light-heading);
  }
.bg-footer__social svg {
    display: block;
    flex: 0 0 auto;
    inline-size: var(--bg-footer-social-icon-size);
    block-size: var(--bg-footer-social-icon-size);
    color: inherit;
  }
.bg-footer__contacts {
    container-name: bg-footer-contacts;
    container-type: inline-size;
    min-inline-size: 0;
    scroll-margin-block-start: var(--offset);
    inline-size: 100%;
    max-inline-size: 42rem;
    justify-self: end;
  }
.bg-footer__contact-cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr);
    gap: var(--space-xs);
  }
.bg-footer__offices {
    min-inline-size: 0;
  }
.bg-footer__office-control {
    display: grid;
    gap: var(--space-xs);
    margin: 0;
    min-inline-size: 0;
    max-inline-size: 20rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
  }
.bg-footer__office-select {
    appearance: none;
    grid-area: 2 / 1;
    inline-size: 100%;
    min-inline-size: 0;
    min-block-size: 2.75rem;
    padding: var(--space-xs);
    padding-inline-end: calc(var(--space-xs) * 2 + 1rem);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 5%, var(--bg-decoration-surface, var(--body-bg-color)));
    color: var(--relative-text-color, var(--text-color));
    font: inherit;
  }
.bg-footer__office-control > span { grid-area: 1 / 1; }
.bg-footer__office-control::after {
    content: '';
    grid-area: 2 / 1;
    justify-self: end;
    align-self: center;
    inline-size: .45rem;
    block-size: .45rem;
    margin-inline-end: var(--space-xs);
    border-inline-end: 1.5px solid currentColor;
    border-block-end: 1.5px solid currentColor;
    transform: translateY(-.125rem) rotate(45deg);
    pointer-events: none;
  }
.bg-footer__office-select:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: 2px; }
.bg-footer__office-control[hidden], .bg-footer__offices .footer-offices__item[hidden] { display: none; }
.bg-footer__offices[data-office-display="selector"] .footer-offices { grid-template-columns: minmax(0, 1fr); }
/* Enhance only after the chooser is active; the no-JavaScript list stays intact. */
.bg-footer__offices[data-office-display="selector"]:has(> .bg-footer__office-control:not([hidden])) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-s);
    align-items: start;
  }
@container bg-footer-contacts (inline-size < 36rem) {
    .bg-footer__offices[data-office-display="selector"]:has(> .bg-footer__office-control:not([hidden])) {
      grid-template-columns: minmax(0, 1fr);
    }
  }
.bg-footer__offices .footer-offices {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16.875rem), 1fr));
    gap: var(--space-xs);
  }
.bg-footer__offices .footer-offices__item {
    background-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 5%, var(--bg-decoration-surface, var(--body-bg-color)));
    color: var(--relative-text-color, var(--text-color));
    display: grid;
    align-content: start;
    gap: calc(var(--space-xs) / 1.5);
    min-inline-size: 0;
    padding: var(--space-m);
    border-radius: var(--radius);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }
.bg-footer__offices .footer-offices__title,
  .bg-footer__offices .footer-offices__phone,
  .bg-footer__offices .footer-offices__whatsapp,
  .bg-footer__offices .footer-offices__email,
  .bg-footer__offices .footer-offices__address,
  .bg-footer__offices .footer-offices__opening-hours {
    line-height: 1.35;
  }
.bg-footer__offices .footer-offices__title {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-decoration: none;
    text-transform: uppercase;
  }
.bg-footer__offices .footer-offices__phone,
  .bg-footer__offices .footer-offices__whatsapp,
  .bg-footer__offices .footer-offices__email {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-s);
    font-weight: 700;
    overflow-wrap: anywhere;
    text-decoration: none;
  }
.bg-footer__offices .footer-offices__whatsapp,
  .bg-footer__whatsapp-link {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    inline-size: fit-content;
  }
.bg-footer__offices .footer-offices__whatsapp svg,
  .bg-footer__whatsapp-link svg {
    flex: 0 0 auto;
    display: block;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    color: inherit;
  }
.bg-footer__offices .footer-offices__email-wrap {
    display: block;
    min-inline-size: 0;
    max-inline-size: 100%;
  }
.bg-footer__offices .footer-offices__email {
    display: inline-block;
    max-inline-size: 100%;
    overflow: hidden;
    font-size: clamp(0.7rem, 0.95cqi, var(--text-xs));
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
.bg-footer__offices .footer-offices__address {
    color: inherit;
    font-size: var(--text-s);
  }
.bg-footer__offices .footer-offices__opening-hours {
    color: inherit;
    font-size: var(--text-xs);
    white-space: pre-line;
  }
.bg-footer__offices[data-office-display="selector"] .footer-offices__email,
  .bg-footer__offices[data-office-display="selector"] .footer-offices__opening-hours {
    font-size: var(--text-s);
  }
.bg-footer__offices[data-office-display="selector"] .footer-offices__email {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }
.bg-footer__contact-card--accent {
    min-inline-size: 0;
  }
.bg-footer__contact-card {
    min-inline-size: 0;
    display: grid;
    align-content: start;
    gap: calc(var(--space-xs) / 2);
    padding: var(--space-m);
    border-radius: var(--radius);
    background-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 5%, var(--bg-decoration-surface, var(--body-bg-color)));
    color: var(--relative-text-color, var(--text-color));
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }
.bg-footer__contact-icon {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-footer-contact-icon-box-size);
    block-size: var(--bg-footer-contact-icon-box-size);
    margin-block-end: calc(var(--space-xs) / 2);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 9%, transparent);
    color: var(--bg-brand-accent, var(--primary));
  }
.bg-footer__contact-icon svg {
    inline-size: var(--bg-footer-contact-icon-size);
    block-size: var(--bg-footer-contact-icon-size);
    display: block;
    color: inherit;
  }
.bg-footer__contact-icon--email {
    --bg-footer-contact-icon-size: calc(var(--icon-size-s) * 1.25);
  }
.bg-footer__contact-label {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
  }
.bg-footer__contact-main,
  .bg-footer__contact-sub {
    line-height: 1.35;
  }
.bg-footer__contact-main {
    font-size: var(--text-s);
    font-weight: 700;
    overflow-wrap: anywhere;
  }
.bg-footer__contact-main a {
    color: var(--bg-brand-accent, var(--primary));
    text-decoration: none;
  }
.bg-footer__whatsapp-link {
    margin-block-start: calc(var(--space-xs) / 2);
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-s);
    font-weight: 700;
    line-height: 1.35;
    text-decoration: none;
  }
.bg-footer__whatsapp-link:hover,
  .bg-footer__whatsapp-link:focus-visible,
  .bg-footer__offices .footer-offices__whatsapp:hover,
  .bg-footer__offices .footer-offices__whatsapp:focus-visible {
    color: var(--bg-brand-accent, var(--primary));
  }
.bg-footer__contact-sub {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
  }
.bg-footer__address {
    font-size: var(--text-s);
  }
.bg-footer__opening-hours {
    white-space: pre-line;
  }
.bg-footer__bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
    align-items: start;
    gap: var(--space-l);
  }
.bg-footer__legal-wrap {
    min-inline-size: 0;
  }
.bg-footer__regulated {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0;
    list-style: none;
  }
.bg-footer__regulated li {
    max-inline-size: 100%;
    flex: 0 0 auto;
    padding: 0;
    line-height: 0;
    min-block-size: 3.125rem;
  }
.bg-footer__regulated a,
  .bg-footer__regulated picture,
  .bg-footer__regulated figure,
  .bg-footer__regulated .etch-image {
    display: inline-flex;
    padding: 0;
    border-radius: 0;
    line-height: 0;
  }
.bg-footer__regulated img {
    display: block;
    inline-size: auto;
    block-size: 3.125rem;
    max-inline-size: 9rem;
    max-block-size: none;
    border-radius: 0;
    object-fit: contain;
  }
.bg-footer__legal {
    display: grid;
    gap: calc(var(--space-xs) / 2);
    justify-items: start;
  }
.bg-footer__legal-links {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--space-xs) / 2) var(--space-s);
  }
.bg-footer__legal-links a {
    color: var(--relative-text-color, var(--text-color));
    font-size: max(.8125rem, var(--text-xs));
    text-decoration: none;
    line-height: 1.6;
  }
.bg-footer__legal-links a:hover,
  .bg-footer__legal-links a:focus-visible {
    color: var(--relative-heading-color, var(--heading-color));
  }
.bg-footer__copyright,
  .bg-footer__disclosure {
    max-inline-size: none;
    color: var(--relative-text-color, var(--text-color));
    font-size: max(.8125rem, var(--text-xs));
    line-height: 1.6;
  }
@container bg-footer (inline-size < 64rem) {
    .bg-footer__top,
    .bg-footer__bottom {
      grid-template-columns: var(--grid-1);
    }

    .bg-footer__contact-cards {
      grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.75rem), 1fr));
    }

    .bg-footer__offices .footer-offices {
      grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.75rem), 1fr));
    }

    .bg-footer__offices .footer-offices__email {
      white-space: normal;
    }
  }
.bg-footer__social a:focus-visible, .bg-footer__offices a:focus-visible, .bg-footer__contact-card a:focus-visible, .bg-footer__legal-links a:focus-visible, .bg-footer__brand-row:focus-visible, .bg-footer__regulated a:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: 3px; }
.bg-footer__offices .footer-offices__phone:hover, .bg-footer__offices .footer-offices__email:hover, .bg-footer__offices .footer-offices__whatsapp:hover, .bg-footer__contact-main a:hover { color: var(--relative-heading-color, var(--heading-color)); text-decoration: underline; }
@container bg-footer (inline-size < 64rem) { .bg-footer__contacts { max-inline-size: none; justify-self: stretch; } }
/* The location chooser uses one shared alignment for contact and legal details. */
.bg-footer__container:has(.bg-footer__offices[data-office-display="selector"]) {
  .bg-footer__contacts { max-inline-size: none; justify-self: stretch; }
  .bg-footer__office-control { max-inline-size: none; }
  @container bg-footer (inline-size >= 64rem) {
    .bg-footer__top, .bg-footer__bottom {
      grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    }
  }
}
/* Groups stay transparent in the all-offices grid. */
.bg-footer__offices .footer-offices__address-group,
.bg-footer__offices .footer-offices__contact-group { display: contents; }
/* Retain the existing all-offices visual order. */
.bg-footer__offices .footer-offices__title { order: 0; }
.bg-footer__offices .footer-offices__phone { order: 1; }
.bg-footer__offices .footer-offices__address { order: 2; }
.bg-footer__offices .footer-offices__email-wrap { order: 3; }
.bg-footer__offices .footer-offices__opening-hours { order: 4; }
.bg-footer__offices .footer-offices__whatsapp { order: 5; }
.bg-footer__offices[data-office-display="selector"]:has(> .bg-footer__office-control:not([hidden])) {
  .footer-offices__item { gap: var(--space-m); }
  .footer-offices__address-group, .footer-offices__contact-group {
    display: grid;
    align-content: start;
    gap: var(--space-xs);
    min-inline-size: 0;
  }
  @container bg-footer-contacts (inline-size >= 34rem) {
    .footer-offices__item {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: var(--space-l);
    }
  }
}

}
.bg-list-01 {
  min-inline-size: 0;
  container-type: inline-size;
  container-name: bg-list-01;
  .bg-list-01__list { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
  .bg-list-01__item { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); margin: 0; padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-list-01__item:not(:has(> .bg-icon)) { grid-template-columns: minmax(0, 1fr); }
  .bg-list-01__copy { display: grid; gap: 0; min-inline-size: 0; }
  .bg-list-01__title { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.25; }
  .bg-list-01__text { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; }
  .bg-list-01__item:has(> .bg-icon):not(:has(.bg-list-01__text)) { align-items: center; }
  /* Checklist designs use the same page-owned list items. */
  &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]) .bg-list-01__list { gap: 0; }
  &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]) .bg-list-01__item {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--relative-text-color, var(--text-color));
    padding: 0 0 var(--space-s) calc(1.25em + var(--space-xs));
  }
  &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]) .bg-list-01__item > .bg-icon { display: none; }
  &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]) .bg-list-01__item::before {
    content: "✓";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: .1em;
    inline-size: 1.25em;
    block-size: 1.25em;
    display: grid;
    place-items: center;
    border: 1px solid var(--relative-link-color, var(--primary));
    border-radius: var(--radius-circle);
    background: var(--relative-link-color, var(--primary));
    color: var(--bg-decoration-surface, var(--text-light));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1;
  }
  .bg-list-01__panel-header { display: none; }
  /* Empty editable labels must not leave a badge or a header gap. */
  .bg-list-01__panel-header > :is(p, h2, h3, h4):empty { display: none; }
  &[data-list-style="checklist-panel"] .bg-list-01__panel-header:has(> :not(:empty)) { display: flex; align-items: center; gap: var(--space-s); margin-block-end: var(--space-m); }
  &[data-list-style="checklist-panel"] .bg-list-01__panel-header > :is(h2, h3, h4) { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); }
  &[data-list-style="bordered-checklist"] .bg-list-01__content,
  &[data-list-style="checklist-panel"] .bg-list-01__content {
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item { padding-block: var(--space-s); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item::before { inset-block-start: calc(var(--space-s) + .1em); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item + .bg-list-01__item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item:first-child { padding-block-start: 0; }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item:first-child::before { inset-block-start: .1em; }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"], [data-list-style="divider-list"]) .bg-list-01__item:last-child { padding-block-end: 0; }
  /* Numbered designs retain the editable item title/text and hide the optional icon. */
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__list { gap: 0; counter-reset: bg-list-01-item; }
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__item {
    position: relative; counter-increment: bg-list-01-item;
    display: grid; grid-template-columns: minmax(0, 1fr); align-content: start;
    margin: 0; border: 0; border-radius: 0; background: transparent;
  }
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__item > .bg-icon { display: none; }
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__item::before {
    content: counter(bg-list-01-item, decimal-leading-zero);
    color: var(--bg-brand-accent, var(--primary)); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1;
  }
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__title { font-size: var(--h4); font-weight: 700; line-height: 1.3; text-wrap: balance; }
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"]) .bg-list-01__text { line-height: 1.55; text-wrap: pretty; }
  &[data-list-style="numbered-list"] .bg-list-01__item { padding: var(--space-m) 0; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-m); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
  &[data-list-style="numbered-list"] .bg-list-01__item:last-child { border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
  &[data-list-style="numbered-list"] .bg-list-01__item::before { min-inline-size: 2ch; font-size: var(--h4); line-height: 1.3; }
  &[data-list-style="numbered-list"] .bg-list-01__title + .bg-list-01__text { margin-block-start: 0; }
  &[data-list-style="numbered-cards"] .bg-list-01__list { gap: 1px; overflow: hidden; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 10%, transparent); border-radius: var(--radius); background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 10%, transparent); }
  &[data-list-style="numbered-cards"] .bg-list-01__item { gap: var(--space-s); min-block-size: auto; padding: var(--space-l); background: color-mix(in oklch, var(--bg-decoration-surface, var(--body-bg-color)) 95%, var(--relative-heading-color, var(--heading-color)) 5%); }
  /* Title-only cards fit their copy instead of reserving space for a description. */
  &[data-list-style="numbered-cards"] .bg-list-01__item:not(:has(.bg-list-01__text:not(:empty))) { min-block-size: auto; align-content: start; padding-block: var(--space-s); gap: var(--space-xs); }
  &[data-list-style="numbered-cards"] .bg-list-01__item:not(:has(.bg-list-01__text:not(:empty)))::after { inset-block-start: calc(var(--space-s) + var(--text-s) * .6); }
  &[data-list-style="numbered-cards"] .bg-list-01__item::before { font-size: calc(var(--text-s) * 1.2); letter-spacing: .1em; }
  &[data-list-style="numbered-cards"] .bg-list-01__item::after { content: ''; position: absolute; inset-block-start: calc(var(--space-l) + var(--text-s) * .6); inset-inline: calc(var(--space-l) + 3em) var(--space-l); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 10%, transparent); }
  &[data-list-style="numbered-cards"] .bg-list-01__title + .bg-list-01__text { margin-block-start: 0; }
  /* Optional Content List 03 treatment; the badge wording stays in the Panel Header slot. */
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__content { position: relative; overflow: hidden; padding: var(--space-l); border-radius: var(--radius); }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__panel-header { position: relative; }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__panel-header > :is(p, h2, h3, h4) { inline-size: fit-content; max-inline-size: 100%; margin: 0; padding: calc(var(--space-xs) / 2) var(--space-s); border-radius: var(--radius); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; line-height: 1.2; text-transform: uppercase; }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__item { padding-block: 0 var(--space-m); border-block-start: 0; }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__item::before { inset-block-start: .05em; border: 0; background: var(--relative-link-color, var(--primary)); color: var(--bg-decoration-surface, var(--text-light)); font-weight: 700; }
  /* Shared copy rhythm for numbered content and the labelled audience panel. */
  &:is([data-list-style="numbered-list"], [data-list-style="numbered-cards"], [data-list-style="checklist-panel"][data-panel-treatment="labelled"]) .bg-list-01__copy { gap: calc(var(--space-xs) / 2); }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__title { line-height: 1.35; }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__text { line-height: 1.55; text-wrap: pretty; }
  &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__item:last-child { padding-block-end: 0; }
  /* All styles measure the outer list component; padding never changes the breakpoint. */
  @container bg-list-01 (inline-size >= 32rem) {
    /* Close the final item in each rendered numbered-list column. */
    &[data-list-style="numbered-list"]:is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__item:nth-last-child(-n + 2) { border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
    &:is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: calc(var(--space-l) * 2); }
    &[data-list-style="icon-cards"]:is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__list { gap: var(--space-l); }
    &[data-list-style="numbered-cards"]:is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__list { gap: 1px; }
  }
  @container bg-list-01 (inline-size >= 54rem) {
    &[data-list-style="numbered-list"][data-list-columns="3"] .bg-list-01__item:nth-last-child(-n + 3) { border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
    &[data-list-columns="3"] .bg-list-01__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @container bg-list-01 (inline-size < 38rem) {
    &[data-list-style="numbered-list"] .bg-list-01__item { gap: var(--space-s); padding-block: var(--space-s); }
    &[data-list-style="numbered-list"] .bg-list-01__item::before { min-inline-size: 2ch; font-size: var(--h4); }
    &[data-list-style="numbered-cards"] .bg-list-01__item, &[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__content { padding: var(--space-m); }
    &[data-list-style="numbered-cards"] .bg-list-01__item { min-block-size: auto; }
    &[data-list-style="numbered-cards"] .bg-list-01__item::after { inset-block-start: calc(var(--space-m) + var(--text-s) * .6); inset-inline: calc(var(--space-m) + 3em) var(--space-m); }
  }
  &[data-list-style="icon-cards"] .bg-list-01__item {
    background-color: var(--bg-decoration-surface, var(--body-bg-color));
    color: var(--relative-text-color, var(--text-color));
  }
  &[data-list-style="icon-cards"][data-card-background="transparent"] .bg-list-01__item { background-color: transparent; }

  /* Optional item treatments for page-owned comparison content. */
  &[data-list-style="plain-list"] .bg-list-01__item--divided + .bg-list-01__item--divided { padding-block-start: var(--space-s); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  &[data-list-style="plain-list"] .bg-list-01__item--divided + .bg-list-01__item--divided::before { inset-block-start: calc(var(--space-s) + .1em); }
  &[data-list-style="plain-list"] .bg-list-01__item--divided:last-child { padding-block-end: 0; }
  &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]) .bg-list-01__item--negative::before { content: "\00d7"; background: transparent; color: var(--relative-text-color, var(--text-color)); border-color: currentColor; font-weight: 700; }

  /* Page-owned supporting bullets within an editable list item. */
  .bg-list-01__sublist { display: grid; gap: calc(var(--space-xs) / 2); margin: 0; padding-inline-start: var(--space-m); list-style: circle; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; }
  .bg-list-01__copy > .bg-list-01__sublist { margin-block-start: var(--space-xs); }
  .bg-list-01__sublist > li { margin: 0; padding: 0; }

  /* Checklists read down each column; neighbouring items no longer share a grid row. */
  @container bg-list-01 (inline-size >= 32rem) {
    &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]):is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__list { display: block; column-count: 2; column-fill: balance; column-gap: calc(var(--space-l) * 2); column-rule: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
    &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]):is([data-list-columns="2"], [data-list-columns="3"]) .bg-list-01__item { break-inside: avoid; }
    /* Bottom separators keep the same spacing when an item starts a new column. */
    &:is([data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]):is([data-list-columns="2"], [data-list-columns="3"]):not([data-list-style="checklist-panel"][data-panel-treatment="labelled"]) .bg-list-01__item { padding-block: 0 var(--space-s); margin-block: 0 var(--space-s); border-block-start: 0; border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
    &:is([data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]):is([data-list-columns="2"], [data-list-columns="3"]):not([data-list-style="checklist-panel"][data-panel-treatment="labelled"]) .bg-list-01__item::before { inset-block-start: .1em; }
    &:is([data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"]):is([data-list-columns="2"], [data-list-columns="3"]):not([data-list-style="checklist-panel"][data-panel-treatment="labelled"]) .bg-list-01__item:last-child { padding-block-end: 0; margin-block-end: 0; border-block-end: 0; }
  }
  @container bg-list-01 (inline-size >= 54rem) {
    &:is([data-list-style="plain-list"], [data-list-style="checklist-panel"], [data-list-style="bordered-checklist"], [data-list-style="divider-list"])[data-list-columns="3"] .bg-list-01__list { column-count: 3; }
  }

  /* Short label-only icon cards need less separation than descriptive cards. */
  &[data-list-style="icon-cards"]:not(:has(.bg-list-01__text:not(:empty))) .bg-list-01__list { gap: var(--space-s); }
  &[data-list-style="icon-cards"]:not(:has(.bg-list-01__text:not(:empty))) .bg-list-01__item { align-items: start; border-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
  &[data-list-style="icon-cards"]:not(:has(.bg-list-01__text:not(:empty))) .bg-list-01__title { line-height: 1.45; }

/* The native relationship belongs to the card group; only cards receive a fill. */
&[data-list-style="icon-cards"] .bg-list-01__content { background-color: transparent; }

/* Explicit native Surface classes own badge colour relationships. */
&[data-list-style="checklist-panel"][data-panel-treatment="labelled"] .bg-list-01__panel-header > :is(p, h2, h3, h4):not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary, .bg-list-01__panel-label)) { background: var(--bg-light); color: var(--bg-light-heading); }

/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-list-01__panel-label {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
}

/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
.bg-list-01__panel-label.bg--ultra-light {
  --relative-text-color: var(--bg-soft-secondary-text);
  --relative-heading-color: var(--bg-soft-secondary-text);
  --icon-color: var(--bg-soft-secondary-text);
  color: var(--relative-text-color);
}

}
.bg-change {
  position: relative;
  container-type: inline-size;
  overflow: hidden;

  .bg-change__watermark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateX(1.5rem);
    pointer-events: none;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: 32.5rem;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 0.8;
    opacity: 0.03;
    white-space: nowrap;
  }

  .bg-change__container {
    position: relative;
    display: grid;
    gap: var(--space-l);
  }

  .bg-change__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    align-items: center;
    gap: var(--space-xl);
  }

  .bg-change__title-wrap {
    display: grid;
    gap: var(--space-s);
    justify-items: start;
  }

  .bg-change__eyebrow {
    display: inline-flex;
    align-items: center;
    inline-size: max-content;
    max-inline-size: 100%;
    gap: calc(var(--space-xs) / 2);
    padding: 0.75em 1.35em;
    border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-change__eyebrow-dot {
    flex: 0 0 auto;
    inline-size: 0.45em;
    block-size: 0.45em;
    transform: translateY(-0.02em);
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-change__title {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: clamp(var(--h1), 5cqi, 4rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
  }

  .bg-change__title span,
  .bg-change__title em {
    display: block;
  }

  .bg-change__title em {
    color: var(--bg-brand-accent, var(--primary));
    font-style: italic;
    font-weight: inherit;
  }

  .bg-change__copy {
    display: grid;
    gap: var(--space-s);
    align-content: center;
  }

  .bg-change__lede {
    max-inline-size: 52ch;
    font-size: var(--text-l);
    line-height: 1.55;
  }

  .bg-change__lede strong {
    color: var(--bg-brand-accent, var(--primary));
  }

  .bg-change__stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-m);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-change__stat {
    display: grid;
    gap: calc(var(--space-xs) / 3);
  }

  .bg-change__stat-value {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--h3);
    line-height: 1;
  }

  .bg-change__stat-label {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
  }

  .bg-change__steps {
    display: grid;
    grid-template-columns: var(--grid-3);
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-change__step {
    display: grid;
    align-content: start;
    gap: var(--space-s);
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 10%, transparent);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 5%, transparent);
  }

  .bg-change__step-head {
    display: flex;
    align-items: center;
    gap: var(--space-s);
  }

  .bg-change__step-number {
    display: inline-grid;
    place-items: center;
    inline-size: calc(var(--icon-size-l) * 0.8);
    block-size: calc(var(--icon-size-l) * 0.8);
    border-radius: var(--radius);
    font-size: var(--text-l);
    font-weight: 800;
  }

  .bg-change__step-line {
    flex: 1 1 auto;
    block-size: 0.125rem;
    background: color-mix(in oklch, var(--bg-brand-accent, var(--primary)) 40%, transparent);
  }

  .bg-change__step-text {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 600;
  }

  .bg-change__assurances {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
  }

  .bg-change__assurance {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-s);
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-change__assurance-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 3rem;
    block-size: 3rem;
    border-radius: var(--radius);
  }

  .bg-change__assurance-icon :where(svg) {
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
    max-inline-size: 100%;
    max-block-size: 100%;
  }

  .bg-change__assurance-copy {
    display: grid;
    gap: calc(var(--space-xs) / 2);
    min-inline-size: 0;
  }

  .bg-change__assurance-copy h3 {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-change__assurance-copy p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    font-weight: 400;
    line-height: 1.35;
  }

  .bg-change__action-wrap {
    display: flex;
    justify-content: center;
  }

  @container (inline-size < 56rem) {
    .bg-change__head {
      grid-template-columns: var(--grid-1);
      gap: var(--space-m);
    }

    .bg-change__steps {
      grid-template-columns: var(--grid-1);
    }

    .bg-change__assurances {
      grid-template-columns: var(--grid-1);
    }

    .bg-change__step-line {
      display: none;
    }
  }

  @container (inline-size < 40rem) {
    .bg-change__watermark {
      font-size: 15rem;
      transform: translateX(0);
    }

    .bg-change__title {
      font-size: clamp(var(--h2), 14cqi, 2.75rem);
    }

    .bg-change__action-wrap :where(.bg-button) {
      inline-size: 100%;
      justify-content: center;
    }

    .bg-change__assurance {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */
}
.bg-platforms {
  container-type: inline-size;

  --bg-platforms-content-width: 67.5rem;
  --bg-platforms-check-size: 1.75rem;
  --bg-platforms-logo-width: 7rem;
  --bg-platforms-logo-height: 4rem;
  --bg-platforms-card-radius: var(--radius);

  /* Section/container spacing comes from Etch + ACSS.
     SectionHeader retains ownership of its own typography and spacing. */
  .bg-platforms__container {
    display: grid;
    gap: var(--space-l);
  }

  .bg-platforms__heading {
    justify-self: center;
    font-size: var(--h3);
    line-height: 1.2;
    text-align: center;
  }

  .bg-platforms__grid,
  .bg-platforms__catchall {
    inline-size: 100%;
    max-inline-size: var(--bg-platforms-content-width);
    margin-inline: auto;
  }

  .bg-platforms__grid {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
    padding: 0;
    list-style: none;
  }

  .bg-platforms__item {
    display: grid;
    min-inline-size: 0;
  }

  .bg-platforms__card {
    display: grid;
    grid-template-columns: var(--bg-platforms-check-size) var(--bg-platforms-logo-width) minmax(0, 1fr);
    align-items: center;
    gap: var(--space-s);
    min-inline-size: 0;
    padding: var(--space-s);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--bg-platforms-card-radius);
    transition:
      border-color var(--transition),
      transform var(--transition);
  }

  .bg-platforms__card:focus-within {
    border-color: var(--bg-brand-accent, var(--primary));
  }

  .bg-platforms__check {
    /* Reuse the same asset and mask treatment as marker-list--circle-tick. */
    display: inline-block;
    inline-size: var(--bg-platforms-check-size);
    block-size: var(--bg-platforms-check-size);
    background-color: var(--relative-link-color, var(--primary));
    -webkit-mask: url('../assets/circle-tick.svg') center / contain no-repeat;
    mask: url('../assets/circle-tick.svg') center / contain no-repeat;
  }

  .bg-platforms__logo,
  .bg-platforms__mini-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: var(--bg-platforms-logo-width);
    max-inline-size: 100%;
    block-size: var(--bg-platforms-logo-height);
    color: inherit;
    text-decoration: none;
    border-radius: var(--radius);
  }

  .bg-platforms__logo:focus-visible,
  .bg-platforms__mini-logo:focus-visible {
    outline: var(--focus-width) solid var(--bg-brand-accent, var(--primary));
    outline-offset: var(--focus-offset);
  }

  .bg-platforms__logo-image {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    border-radius: 0;
    object-fit: contain;
  }

  .bg-platforms__copy {
    display: grid;
    gap: calc(var(--space-xs) / 2);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-platforms__card-title {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.3;
  }

  .bg-platforms__card-text {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.5;
  }

  .bg-platforms__catchall {
    display: grid;
    grid-template-columns: var(--bg-platforms-check-size) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-s);
    padding: var(--space-m);
    border-radius: var(--bg-platforms-card-radius);
  }

  .bg-platforms__catchall-copy {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
  }

  .bg-platforms__catchall-title {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-l);
    line-height: 1.3;
  }

  .bg-platforms__catchall-text {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    font-weight: 700;
    line-height: 1.5;
  }

  .bg-platforms__logos {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    align-items: center;
    gap: var(--space-s);
    padding: var(--space-xs) 0 0;
    list-style: none;
  }

  .bg-platforms__logo-item {
    display: flex;
    justify-content: center;
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  .bg-platforms__mini-logo {
    --bg-platforms-logo-width: 6rem;
    --bg-platforms-logo-height: 2.75rem;
  }

  @media (hover: hover) and (pointer: fine) {
    .bg-platforms__card:hover {
      border-color: var(--bg-brand-accent, var(--primary));
      transform: translateX(0.125rem);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .bg-platforms__card,
    .bg-platforms__card:hover {
      transition: none;
      transform: none;
    }
  }

  /* One featured card per row and four supporting logos below 62rem. */
  @container (inline-size < 62rem) {
    .bg-platforms__grid {
      grid-template-columns: var(--grid-1);
    }

    .bg-platforms__logos {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }

  /* On phones, give the copy its own row beneath the logo. */
  @container (inline-size < 40rem) {
    .bg-platforms__container {
      gap: var(--space-m);
    }

    .bg-platforms__card {
      grid-template-columns: var(--bg-platforms-check-size) minmax(0, 1fr);
      column-gap: var(--space-xs);
      row-gap: var(--space-s);
    }

    .bg-platforms__copy {
      grid-column: 2;
    }

    .bg-platforms__catchall {
      padding: var(--space-s);
      gap: var(--space-xs);
    }

    .bg-platforms__logos {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */
}
.bg-reviews-setup {
  /* General Section owns spacing and the side-by-side layout; SectionHeader owns the heading. */
  display: grid;
  gap: var(--space-m);
  min-inline-size: 0;
  .bg-reviews-setup__description, &.bg-reviews-setup__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-section-general-01__panel { display: grid; gap: var(--space-l); }
  .bg-reviews-setup__panel-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-s); }
  .bg-reviews-setup__panel-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.3; }
  .bg-reviews-setup__badge { display: inline-flex; align-items: center; gap: .45em; padding: .5em .75em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-setup__clock { flex-shrink: 0; inline-size: 1.25em; block-size: 1.25em; color: inherit; }
  .bg-reviews-setup__list { display: grid; list-style: none; margin: 0; padding: 0; }
  .bg-reviews-setup__item { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); padding-block-end: var(--space-m); }
  .bg-reviews-setup__item:last-child { padding-block-end: 0; }
  .bg-reviews-setup__item:not(:last-child)::before { content: ''; position: absolute; inset-inline-start: calc(1rem - 1px); inset-block-start: 2rem; inset-block-end: 0; inline-size: 2px; background: var(--primary-light); }
  .bg-reviews-setup__tick { position: relative; display: grid; place-items: center; inline-size: 2rem; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-reviews-setup__glyph { inline-size: 55%; block-size: 55%; }
  .bg-reviews-setup__item-copy { display: grid; gap: var(--space-xs); }
  .bg-reviews-setup__item-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.4; }
  .bg-reviews-setup__item-description, .bg-reviews-setup__item-copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }

/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-setup__tick:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-setup__tick:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

}
.bg-old-new {
  container-type: inline-size;

  --bg-old-new-item-padding: 0.75rem;

  .bg-old-new__container {
    display: grid;
    gap: var(--space-xl);
  }

  .bg-old-new__grid {
    max-inline-size: 68.75rem;
    inline-size: 100%;
    margin-inline: auto;
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
  }

  .bg-old-new__panel {
    display: flex;
    flex-direction: column;
    padding: var(--space-m) clamp(var(--space-l), 4cqi, var(--space-xl));
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-old-new__tag {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
    align-self: flex-start;
    width: fit-content;
    margin: 0 0 var(--space-s);
    padding: 0.3125rem 0.75rem;
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.14em;
    line-height: 1;
    text-transform: uppercase;
  }

  .bg-old-new__tag::before {
    content: '';
    inline-size: 0.25rem;
    block-size: 0.25rem;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-old-new__title {
    margin: 0 0 var(--space-m);
    max-inline-size: 30.625rem;
    font-size: clamp(var(--text-xl), 3cqi, var(--text-xxl));
    line-height: 1.05;
    letter-spacing: -0.03em;
  }

  .bg-old-new__title-highlight {
    font-style: normal;
  }

  .bg-old-new__panel--old .bg-old-new__title-highlight {
    color: var(--relative-link-color, var(--primary));
  }

  .bg-old-new__panel--new .bg-old-new__title-highlight {
    color: var(--relative-link-color, var(--link-color));
    font-style: italic;
  }

  .bg-old-new__list {
    --list-marker-size: 1.375rem;
    --list-marker-gap: var(--space-xs);
    --list-marker-offset-y: calc(var(--bg-old-new-item-padding) + ((1lh - var(--list-marker-size)) / 2));

    display: grid;
    margin: 0;
    padding-inline-start: calc(var(--list-marker-size) + var(--list-marker-gap));
    list-style: none;
  }

  .bg-old-new__panel--old .bg-old-new__list {
    --list-marker-colour: var(--bg-ultra-light-text);
  }

  .bg-old-new__panel--old .bg-old-new__item::before {
    border: 0;
    background-color: var(--bg-ultra-light);
  }

  .bg-old-new__panel--old .bg-old-new__item::after {
    inset-block-start: calc(var(--list-marker-offset-y) + (var(--list-marker-size) * 0.28));
  }

  .bg-old-new__panel--new .bg-old-new__list {
    /* Pair the marker with this panel: foreground circle, background-coloured tick. */
    --list-marker-colour: var(--relative-heading-color, var(--text-light));
    --list-marker-tick-colour: var(--bg-decoration-surface, var(--primary));
  }

  .bg-old-new__item {
    padding-block: var(--bg-old-new-item-padding);
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    line-height: 1.45;
  }

  .bg-old-new__panel--new .bg-old-new__item {
    font-weight: 600;
  }

  .bg-old-new__item:last-child {
    border-block-end: 0;
  }

  @container (inline-size < 48rem) {
    .bg-old-new__grid {
      grid-template-columns: var(--grid-1);
    }

    .bg-old-new__panel {
      padding: var(--space-m) var(--space-l);
    }
  }

  @container (inline-size < 30rem) {
    .bg-old-new__panel {
      padding: var(--space-m);
      border-radius: var(--radius);
    }
  }



/* A pale Secondary badge remains distinct even when Secondary equals Primary. */
.bg-old-new__tag.bg-old-new__tag--accent.bg--ultra-light {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
  --relative-text-color: var(--bg-soft-secondary-text);
  --relative-heading-color: var(--bg-soft-secondary-text);
  --icon-color: var(--bg-soft-secondary-text);
  color: var(--relative-text-color);
}

}
.bg-beangrower-ai-pillars {
  min-inline-size: 0;

  .bg-beangrower-ai-pillars__header { display: grid; justify-items: center; max-inline-size: 75rem; margin-inline: auto; text-align: center; }

  .bg-beangrower-ai-pillars__eyebrow { display: grid; grid-template-columns: 3.75rem auto 3.75rem; align-items: center; gap: var(--space-xs); margin: 0; color: var(--primary); font-size: var(--text-s); font-weight: 800; letter-spacing: .2em; line-height: 1; text-transform: uppercase; }

  .bg-beangrower-ai-pillars__eyebrow::before,
  .bg-beangrower-ai-pillars__eyebrow::after { block-size: 1px; background: var(--primary-light); content: ''; }

  .bg-beangrower-ai-pillars__eyebrow span { padding: 0.625rem var(--space-m); border: 1px solid var(--primary-light); border-radius: var(--radius); background: var(--bg-primary-soft); }

  .bg-beangrower-ai-pillars__header h2 { max-inline-size: 72.5rem; margin-block-start: var(--space-s); color: var(--heading-color); font-size: clamp(var(--h2), 5.1cqi, var(--h1)); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }

  .bg-beangrower-ai-pillars__title-line { display: block; margin-block-start: 0.3125rem; }

  .bg-beangrower-ai-pillars__title-word { font-style: normal; }

  .bg-beangrower-ai-pillars__lede { max-inline-size: 60.625rem; margin: var(--space-s) 0 0; font-size: var(--text-m); line-height: 1.45; text-wrap: pretty; }

  .bg-beangrower-ai-pillars__cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-s); margin: 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-pillars__cards > li { display: grid; min-inline-size: 0; }

  .bg-beangrower-ai-pillars__card { display: grid; align-content: start; gap: var(--space-s); min-block-size: 25.3125rem; padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-pillars__icon { display: grid; place-items: center; inline-size: 5.5rem; block-size: 5.5rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius-circle); }

  .bg-beangrower-ai-pillars__icon svg,
  .bg-beangrower-ai-pillars__footer-icon svg { display: block; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }

  .bg-beangrower-ai-pillars__icon svg { inline-size: 2.875rem; block-size: 2.875rem; stroke-width: 1.7; }

  .bg-beangrower-ai-pillars__icon-glyph { display: block; inline-size: 2.875rem; block-size: 2.875rem; background-color: currentColor; mask: var(--bg-pillars-icon-url) center / contain no-repeat; -webkit-mask: var(--bg-pillars-icon-url) center / contain no-repeat; }

  .bg-beangrower-ai-pillars__icon-glyph--convert { --bg-pillars-icon-url: url("../assets/bg-ai-convert.svg"); }

  .bg-beangrower-ai-pillars__card h3,
  .bg-beangrower-ai-pillars__footer h3,
  .bg-beangrower-ai-pillars__card p,
  .bg-beangrower-ai-pillars__footer p { margin: 0; }

  .bg-beangrower-ai-pillars__card h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1; letter-spacing: -.045em; }

  .bg-beangrower-ai-pillars__card p { font-size: var(--text-m); line-height: 1.45; }

  .bg-beangrower-ai-pillars__rule { inline-size: 2.875rem; block-size: 2px; margin-block-start: auto; background: var(--bg-brand-accent, var(--primary)); }

  .bg-beangrower-ai-pillars__footer { display: grid; grid-template-columns: 5.75rem minmax(0, 1.1fr) minmax(0, 1.3fr); align-items: center; gap: var(--space-m); padding: var(--space-m) var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-pillars__footer-icon { display: grid; place-items: center; inline-size: 5.75rem; block-size: 5.75rem; border-radius: var(--radius); color: var(--bg-brand-accent, var(--primary)); }

  .bg-beangrower-ai-pillars__footer-icon svg { inline-size: 3rem; block-size: 3rem; stroke-width: 1.7; }

  .bg-beangrower-ai-pillars__footer-copy { min-inline-size: 0; }

  .bg-beangrower-ai-pillars__footer h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: 1.15; letter-spacing: -.035em; }

  .bg-beangrower-ai-pillars__footer p { margin-block-start: 0.375rem; font-size: var(--text-m); line-height: 1.4; }

  .bg-beangrower-ai-pillars__footer-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-s); margin: 0; padding: var(--space-xs) 0 var(--space-xs) var(--space-m); border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); list-style: none; }

  .bg-beangrower-ai-pillars__footer-benefits li { display: grid; grid-template-columns: 2.125rem minmax(0, 1fr); gap: 0.5rem; align-items: center; font-size: var(--text-s); line-height: 1.35; }

  .bg-beangrower-ai-pillars__footer-benefits li::before { display: grid; place-items: center; inline-size: 2.125rem; block-size: 2.125rem; border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--primary); content: '✓'; font-size: var(--text-s); font-weight: 900; }

  @container (inline-size < 82rem) {
    .bg-beangrower-ai-pillars__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bg-beangrower-ai-pillars__card { grid-template-columns: 5.5rem minmax(0, 1fr); column-gap: var(--space-s); min-block-size: 20rem; }
    .bg-beangrower-ai-pillars__icon { grid-column: 1; grid-row: 1; }
    .bg-beangrower-ai-pillars__card h3 { grid-column: 2; align-self: center; }
    .bg-beangrower-ai-pillars__card p,
    .bg-beangrower-ai-pillars__rule { grid-column: 1 / -1; }
    .bg-beangrower-ai-pillars__footer { grid-template-columns: 5.125rem minmax(0, 1fr); }
    .bg-beangrower-ai-pillars__footer-benefits { grid-column: 1 / -1; padding-inline: 0; border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-inline-start: 0; }
  }

  @container (inline-size < 56rem) {
    .bg-beangrower-ai-pillars__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-beangrower-ai-pillars__card { min-block-size: 16.875rem; }
  }

  @container (inline-size < 40rem) {
    .bg-beangrower-ai-pillars__header h2 { font-size: var(--h2); }
    .bg-beangrower-ai-pillars__title-line { display: inline; }
    .bg-beangrower-ai-pillars__cards { grid-template-columns: 1fr; }
    .bg-beangrower-ai-pillars__card { min-block-size: 0; }
    .bg-beangrower-ai-pillars__footer-benefits { grid-template-columns: 1fr; }
    .bg-beangrower-ai-pillars__footer { grid-template-columns: 4rem minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); }
    .bg-beangrower-ai-pillars__footer-icon { inline-size: 4rem; block-size: 4rem; }
    .bg-beangrower-ai-pillars__footer-icon svg { inline-size: 2.125rem; block-size: 2.125rem; }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  .bg-beangrower-ai-pillars__title-word { color: var(--relative-heading-color, var(--heading-color)); }

  .bg-beangrower-ai-pillars__eyebrow { color: var(--bg-soft-primary-text); }

  .bg-beangrower-ai-pillars__icon:not(.surface-primary), .bg-beangrower-ai-pillars__footer-icon:not(.surface-primary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-pillars__rule { background: var(--primary); }

/* Keep decorative rules thin when empty-element minimums apply. */
.bg-beangrower-ai-pillars__rule { min-block-size: 0; }
.bg-beangrower-ai-pillars__footer-icon.surface-primary { color: var(--relative-heading-color, var(--heading-color)); }
}
.bg-cta {
  container-type: inline-size;
  --bg-cta-icon-size: 3.5rem;

  .bg-cta__container {
    display: grid;
    gap: var(--space-l);
    min-inline-size: 0;
  }

  & .bg-section-head {
    margin-inline: auto;
  }

  .bg-cta__cards {
    display: grid;
    grid-template-columns: var(--grid-3);
    gap: var(--space-s);
  }

  .bg-cta__card {
    display: grid;
    align-content: start;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: var(--space-s);
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    text-align: start;
    min-inline-size: 0;
  }

  .bg-cta__icon {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-cta-icon-size);
    block-size: var(--bg-cta-icon-size);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
  }

  .bg-cta__title {
    font-size: var(--h4);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  .bg-cta__text {
    font-size: var(--text-s);
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  .bg-cta__action {
    display: inline-flex;
    align-items: center;
    inline-size: 100%;
    justify-content: center;
    margin-block-start: auto;
  }

  .bg-cta__action .bg-button-wrap,
  .bg-cta__action .bg-button {
    inline-size: 100%;
  }

  .bg-cta__action .bg-button {
    justify-content: center;
  }

  @container (inline-size < 42rem) {
    .bg-cta__cards {
      grid-template-columns: var(--grid-1);
    }

    .bg-cta__card {
      grid-template-columns: auto minmax(0, 1fr);
      grid-template-rows: auto auto auto;
      align-items: center;
    }

    .bg-cta__title {
      align-self: center;
    }

    .bg-cta__text,
    .bg-cta__action {
      grid-column: 1 / -1;
    }

    .bg-cta__action {
      inline-size: auto;
      justify-self: start;
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */

/* Match the other light Primary labels; ACSS controls the chosen shade. */
.bg-cta__icon.bg--light {
  --relative-text-color: var(--bg-soft-primary-text);
  --relative-heading-color: var(--bg-soft-primary-text);
  --icon-color: var(--bg-soft-primary-text);
  color: var(--relative-text-color);
}

}
.bg-trust-google-reviews {
    .bg-trust-google-reviews__label--compact {
    display: var(--bg-trust-compact-label-display, none);
  }
  .bg-trust-google-reviews__label--full {
    display: var(--bg-trust-full-label-display, inline);
  }

}
.bg-icon {
  /* Studio draft: preserve the supplied icon sizing, native colours and stroke controls. */
  /* etch:svg renders the selected asset as an inline SVG targeted below. */
  --bg-icon-size: 2.5rem;
  /* One padding ratio for every badge size; artwork is centred in the SVG. */
  --bg-icon-glyph-size: 72%;
  --bg-icon-radius: var(--radius-circle);
  --bg-icon-stroke-width: 1.8;

  box-sizing: border-box;
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  inline-size: var(--bg-icon-size);
  block-size: var(--bg-icon-size);
  border: 0 solid transparent;
  border-radius: var(--bg-icon-radius);
  background-color: transparent;
  color: var(--relative-link-color, var(--primary));
  line-height: 1;
  vertical-align: middle;

  & > svg[data-icon] {
    display: block;
    inline-size: var(--bg-icon-glyph-size);
    block-size: var(--bg-icon-glyph-size);
    stroke-width: var(--bg-icon-stroke-width);
  }

  /* Assets own their fills and strokes, including solid icons and small dots. */
  & > svg[data-icon]:not([fill]) {
    fill: currentColor;
  }

  /* Detail ratios preserve small lettering and scaled groups at every weight. */
  & > svg[data-icon] :where(path, circle, rect, ellipse, line, polyline, polygon) {
    stroke-width: calc(var(--bg-icon-stroke-width) * var(--bg-icon-stroke-ratio, 1));
    vector-effect: non-scaling-stroke;
  }

  & .bg-icon__label {
    position: absolute;
    overflow: hidden;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  &.bg-icon--xs {
    --bg-icon-size: 1.25rem;

    --bg-icon-stroke-width: 2;
  }

  &.bg-icon--s {
    --bg-icon-size: 1.75rem;

    --bg-icon-stroke-width: 1.9;
  }

  &.bg-icon--m {
    --bg-icon-size: 2.5rem;

  }

  &.bg-icon--l {
    --bg-icon-size: 3.25rem;

    --bg-icon-stroke-width: 1.7;
  }

  &.bg-icon--xl {
    --bg-icon-size: 4rem;

    --bg-icon-stroke-width: 1.6;
  }

  &.bg-icon--weight-light {
    --bg-icon-stroke-width: 1.5;
  }

  &.bg-icon--weight-regular {
    --bg-icon-stroke-width: 1.8;
  }

  &.bg-icon--weight-bold {
    --bg-icon-stroke-width: 2.2;
  }

  &.bg-icon--none {
    --bg-icon-glyph-size: 100%;
    background-color: transparent;
    border-color: transparent;
  }

  &.bg-icon--soft,
  &.bg-icon--solid {
    background-color: var(--bg-decoration-surface, var(--bg-light));
    color: var(--relative-link-color, var(--primary));
  }

  &.bg-icon--outline {
    border-width: 1px;
    border-color: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    background-color: transparent;
    color: var(--relative-link-color, var(--primary));
  }

  &.bg-icon--circle {
    --bg-icon-radius: var(--radius-circle);
  }

  &.bg-icon--rounded {
    --bg-icon-radius: var(--radius);
  }

  &.bg-icon--square {
    --bg-icon-radius: 0;
  }
&[data-colour-source="acss"] {
  color-scheme: var(--icon-scheme);
  color: var(--icon-color);
  & > svg[data-icon] { color: inherit; }
  /* Boxed icons use native Icons controls, independent of ordinary link colours. */
  &.bg-icon--soft, &.bg-icon--solid {
    --icon-color: var(--bg-boxed-icon-color);
    --icon-color-hover: var(--bg-boxed-icon-color-hover);
    background: var(--icon-background);
    color: var(--icon-color);
    border-color: var(--icon-border-color);
  }
  /* Explicit native Surface badges own both their fill and contrasting glyph. */
  &:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary) {
    --icon-color: var(--relative-heading-color, var(--heading-color));
    --icon-color-hover: var(--relative-heading-color, var(--heading-color));
    background: var(--bg-decoration-surface);
    color: var(--icon-color);
  }
  &.bg-icon--outline { background: transparent; border-color: currentColor; }
}

/* Apply native hover/focus colours only to interactive boxed icons.
   Explicit Surface badges keep their own foreground/background pairing. */
&[data-colour-source="acss"]:is(.bg-icon--soft, .bg-icon--solid):not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary)) {
  :is(a:hover, a:focus-visible, button:hover, button:focus-visible) & {
    color: var(--bg-boxed-icon-color-hover);
    background: var(--icon-background-hover);
    border-color: var(--icon-border-color-hover);
  }
}

}
.bg-section-general-01 {
  container-type: inline-size;
  .bg-section-general-01__container { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "introduction" "content"; align-items: start; gap: var(--space-l) var(--space-xxl); }
  .bg-section-general-01__introduction { grid-area: introduction; min-inline-size: 0; }
  .bg-section-general-01__content-area { grid-area: content; min-inline-size: 0; container-type: inline-size; }
  .bg-section-general-01__content { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: var(--space-l); }
  .bg-section-general-01__content > * { min-inline-size: 0; }
  .bg-section-general-01__closing { grid-column: 1 / -1; min-inline-size: 0; }
  .bg-section-general-01__closing:not(:has(> *)), .bg-section-general-01__introduction:not(:has(> *)) { display: none; }
  /* Centre the introduction while retaining SectionHeader's existing width limits. */
  &[data-heading-position="above-center"] .bg-section-general-01__introduction { display: grid; justify-items: center; text-align: center; }
  &[data-heading-position="above-center"] .bg-section-general-01__introduction > .bg-section-head { inline-size: 100%; justify-items: center; margin-inline: auto; }
  &[data-heading-position="above-center"] .bg-section-general-01__introduction .bg-section-head__eyebrow { justify-content: center; }
  /* Proportions always describe heading / content, including heading on the right. */
  &[data-columns="33-67"] { --bg-section-general-01-heading: 1fr; --bg-section-general-01-content: 2fr; }
  &[data-columns="40-60"] { --bg-section-general-01-heading: 2fr; --bg-section-general-01-content: 3fr; }
  &[data-columns="45-55"] { --bg-section-general-01-heading: 9fr; --bg-section-general-01-content: 11fr; }
  &[data-columns="50-50"] { --bg-section-general-01-heading: 1fr; --bg-section-general-01-content: 1fr; }
  /* Side headings stack above the content when the section becomes narrow. */
  @container (inline-size >= 64rem) {
    &[data-heading-position="left"] .bg-section-general-01__container { grid-template-columns: minmax(0, var(--bg-section-general-01-heading, 1fr)) minmax(0, var(--bg-section-general-01-content, 2fr)); grid-template-areas: "introduction content"; }
    &[data-heading-position="right"] .bg-section-general-01__container { grid-template-columns: minmax(0, var(--bg-section-general-01-content, 2fr)) minmax(0, var(--bg-section-general-01-heading, 1fr)); grid-template-areas: "content introduction"; }
  }
  /* These columns arrange separate blocks in Content, not items inside a list. */
  @container (inline-size >= 36rem) {
    &[data-content-columns="2"] .bg-section-general-01__content, &[data-content-columns="3"] .bg-section-general-01__content { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  /* Optional proportions for two content columns; narrow layouts still stack. */
  @container (inline-size >= 36rem) {
    &[data-content-columns="2"][data-content-proportions="40-60"] .bg-section-general-01__content { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
    &[data-content-columns="2"][data-content-proportions="45-55"] .bg-section-general-01__content { grid-template-columns: minmax(0, 9fr) minmax(0, 11fr); }
    &[data-content-columns="2"][data-content-proportions="35-65"] .bg-section-general-01__content { grid-template-columns: minmax(0, 7fr) minmax(0, 13fr); }
  }
  @container (inline-size >= 54rem) {
    &[data-content-columns="3"] .bg-section-general-01__content { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

  /* Page-owned actions and closing copy remain editable in the section slots. */
  .bg-section-general-01__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s); margin-block-start: var(--space-m); }
  .bg-section-general-01__callout { padding-block-start: var(--space-m); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-l); }
  .bg-section-general-01__callout-text { margin: 0; color: var(--relative-heading-color, var(--heading-color)); max-inline-size: 45rem; font-size: var(--h4); font-weight: 700; line-height: 1.35; text-wrap: balance; }
  .bg-section-general-01__callout-text em { color: var(--bg-brand-accent, var(--primary)); font-style: normal; }
  @container (inline-size < 62rem) {
    .bg-section-general-01__callout { grid-template-columns: minmax(0, 1fr); justify-items: start; }
  }
  @container (inline-size < 42rem) {
    .bg-section-general-01__callout .bg-button-wrap, .bg-section-general-01__callout .bg-button { inline-size: 100%; }
    .bg-section-general-01__callout .bg-button { justify-content: center; }
  }


  /* Optional page-owned reassurance and list introductions for slot-based sections. */
  .bg-section-general-01__reassurance { margin-block-start: var(--space-m); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); background: color-mix(in oklch, var(--bg-decoration-surface, var(--body-bg-color)) 94%, var(--relative-heading-color, var(--heading-color))); }
  .bg-section-general-01__reassurance p { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-l); line-height: 1.6; text-wrap: pretty; }
  .bg-section-general-01__reassurance strong { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }
  .bg-section-general-01__content-group, .bg-section-general-01__content-heading { display: grid; gap: var(--space-s); min-inline-size: 0; }
  .bg-section-general-01__content-label { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.4; }

  /* Optional page-owned panels: introductions, lists and closing copy share a surface. */
  .bg-section-general-01__panel { display: flex; flex-direction: column; align-self: stretch; min-inline-size: 0; gap: var(--space-m); padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-section-general-01__panel-head { display: grid; gap: 0; }
  .bg-section-general-01__panel-label { width: fit-content; margin: 0 0 var(--space-s); padding: calc(var(--space-xs) / 2) var(--space-s); border-radius: var(--radius); font-size: var(--text-s); font-weight: 800; letter-spacing: .1em; line-height: 1.4; text-transform: uppercase; }
  .bg-section-general-01__panel-label:not(:is(.bg--light, .bg--ultra-light, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg--dark, .bg--ultra-dark)) { background: var(--bg-light); color: var(--bg-light-heading);  }
  .bg-section-general-01__panel-label--caution:not(:is(.bg--light, .bg--ultra-light, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg--dark, .bg--ultra-dark)) { background: var(--bg-ultra-light); color: var(--bg-ultra-light-heading); }
  .bg-section-general-01__panel-heading { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.2; text-wrap: balance; }
  .bg-section-general-01__panel-introduction { margin: var(--paragraph-spacing) 0 0; color: var(--relative-text-color, var(--text-color)); }
  .bg-section-general-01__panel-footer { margin-block-start: auto; padding-block-start: var(--space-m); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-section-general-01__panel-footer p { margin: 0; color: var(--relative-text-color, var(--text-color)); }
  .bg-section-general-01__panel-footer strong { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-section-general-01__actions--center { justify-content: center; margin-block-start: 0; }
  @container (inline-size < 36rem) { .bg-section-general-01__panel { padding: var(--space-m); } }

  /* Optional paired-panel alignment and comparison marker. */
  .bg-section-general-01__panel-label { display: inline-flex; align-items: center; gap: var(--space-3xs, .35rem); }
  .bg-section-general-01__panel-label .bg-icon { flex-shrink: 0; color: inherit; }
  .bg-section-general-01__content:has(> .bg-section-general-01__comparison-marker) { position: relative; }
  .bg-section-general-01__comparison-marker { display: none; }
  @container (inline-size >= 36rem) {
    &[data-content-columns="2"] .bg-section-general-01__panel--aligned { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: var(--space-m); }
    &[data-content-columns="2"] .bg-section-general-01__panel--aligned > .bg-section-general-01__panel-head { align-content: start; }
    &[data-content-columns="2"] .bg-section-general-01__panel--aligned > .bg-list-01 { align-self: start; }
    &[data-content-columns="2"] .bg-section-general-01__panel--aligned > .bg-section-general-01__panel-footer { margin-block-start: 0; }
    &[data-content-columns="2"] .bg-section-general-01__comparison-marker { position: absolute; z-index: 1; inset-block-start: 50%; inset-inline-start: 50%; display: grid; place-items: center; inline-size: 4rem; block-size: 4rem; border: .25rem solid var(--body-bg-color); box-shadow: 0 0 0 1px color-mix(in oklch, var(--base) 14%, transparent); border-radius: var(--radius-circle); font-size: var(--text-s); font-weight: 800; letter-spacing: .08em; transform: translate(-50%, -50%); pointer-events: none; }
  }

  /* Reverse proportions use the same stacking breakpoint as the other content ratios. */
  @container (inline-size >= 36rem) {
    &[data-content-columns="2"][data-content-proportions="55-45"] .bg-section-general-01__content { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); }
    &[data-content-columns="2"][data-content-proportions="60-40"] .bg-section-general-01__content { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
    &[data-content-columns="2"][data-content-proportions="65-35"] .bg-section-general-01__content { grid-template-columns: minmax(0, 13fr) minmax(0, 7fr); }
  }
  /* Opt-in natural height for a panel beside a longer content column. */
  .bg-section-general-01__panel--fit-content { align-self: start; }

  /* Optional native callout and panel heading row for editable service content. */
  .bg-section-general-01__insight { display: flex; align-items: flex-start; gap: var(--space-s); margin-block-start: var(--paragraph-spacing); padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent); border-radius: var(--radius); }
  .bg-section-general-01__insight > .bg-icon, .bg-section-general-01__panel-heading-row > .bg-icon { flex: 0 0 auto; }
  .bg-section-general-01__insight-text { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.45; }
  .bg-section-general-01__panel-heading-row { display: flex; align-items: center; gap: var(--space-s); min-inline-size: 0; }
  /* Optional icon callout: page-owned copy remains editable beside the icon. */
  .bg-section-general-01__panel--icon-callout { display: grid; grid-template-columns: auto minmax(0, 1fr); align-content: start; align-items: start; gap: var(--space-s); }
  .bg-section-general-01__panel-copy { min-inline-size: 0; }
  .bg-section-general-01__panel--icon-callout .bg-section-general-01__panel-heading { color: var(--bg-brand-accent, var(--primary)); font-size: var(--h4); line-height: 1.45; }

  /* Grid and flex containers already provide the space before an insight. */
  .bg-section-general-01__content-group > .bg-section-general-01__insight, .bg-section-general-01__content > .bg-section-general-01__insight, .bg-section-general-01__panel > .bg-section-general-01__insight { margin-block-start: 0; }


  /* Emphasised lead copy inside a page-owned panel. */
  .bg-section-general-01__panel-lead { color: var(--relative-link-color, var(--link-color)); font-weight: 700; }

  /* No introduction slot content: remove its unused grid row and gap. */
  & .bg-section-general-01__container:not(:has(> .bg-section-general-01__introduction > *)) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "content";
    > .bg-section-general-01__introduction { display: none; }
  }


  /* Opt-in supporting copy: quieter than a main content panel. */
  .bg-section-general-01__reassurance--quiet { padding: var(--space-s) var(--space-m); border-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 10%, transparent); background: color-mix(in oklch, var(--bg-decoration-surface, var(--body-bg-color)) 98%, var(--relative-heading-color, var(--heading-color)) 2%); }
  .bg-section-general-01__reassurance--quiet p { font-size: var(--text-m); line-height: 1.55; }

/* Comparison details: preserve a quiet corner motif without extra markup or motion. */
.bg-section-general-01__panel--aligned.surface-primary {
  background-image: radial-gradient(circle at top right, color-mix(in srgb, var(--text-light) 10%, transparent) 0 clamp(5rem, 9cqi, 8rem), transparent calc(clamp(5rem, 9cqi, 8rem) + 1px));
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: top right;
}


/* Strong takeaway panels use the primary surface without an outline. */
.bg-section-general-01__insight:is(.surface-primary, .surface-secondary, .surface-tertiary) {
  border-color: transparent;
}
/* Takeaway icons follow the panel foreground and its background. */
.bg-section-general-01__insight:is(.surface-primary, .surface-secondary, .surface-tertiary) > .bg-icon {
  color-scheme: inherit;
  color: var(--relative-heading-color, var(--text-light));
}

/* Native Surface colours also support the comparison marker and short list labels. */
.bg-section-general-01__comparison-marker:not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary)) { background: var(--bg-dark); color: var(--bg-dark-heading); }
.bg-section-general-01__content-label--badge { inline-size: fit-content; max-inline-size: 100%; padding: calc(var(--space-xs) / 2) var(--space-s); border-radius: var(--radius); font-size: var(--text-s); line-height: 1.4; }

/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-section-general-01__panel-label.bg-section-general-01__panel-label--accent {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
}

/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-section-general-01__panel.bg-section-general-01__panel--support {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
}

/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
.bg-section-general-01__panel-label.bg-section-general-01__panel-label--accent.bg--ultra-light {
  --relative-text-color: var(--bg-soft-secondary-text);
  --relative-heading-color: var(--bg-soft-secondary-text);
  --icon-color: var(--bg-soft-secondary-text);
  color: var(--relative-text-color);
}

}
.bg-reviews-hero {
  

  /* Hero01 owns the section, layout, typography and CTA. */

  /* Empty decorative spans must keep their intended size inside the Studio canvas. */
  .bg-reviews-hero__marker {
    min-inline-size: 0;
    min-block-size: 0;
  }

  .bg-reviews-hero__offer {
    margin-block-end: var(--space-m);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-s) var(--space-m);
  }

  .bg-reviews-hero__client-price {
    inline-size: auto;
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  .bg-reviews-hero__amount {
    font-size: var(--h1);
    font-weight: var(--heading-font-weight);
    line-height: 1;
    letter-spacing: var(--heading-letter-spacing);
  }

  .bg-reviews-hero__price-label,
  .bg-reviews-hero__standard-price {
    font-size: var(--text-s);
    line-height: 1.4;
  }

  .bg-reviews-hero__standard-price {
    inline-size: auto;
    padding-inline-start: var(--space-m);
    border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-reviews-hero__terms {
    max-inline-size: 58ch;
    margin-block-start: var(--space-s);
    font-size: var(--text-s);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-reviews-hero__visual {
    container: reviews-visual / inline-size;
    inline-size: min(100%, 36rem);
    min-inline-size: 0;
    justify-self: center;
    /* Override the browser's figure indentation, not the shared text reset. */
    margin: 0;
  }

  .bg-reviews-hero__scene {
    position: relative;
    isolation: isolate;
    min-block-size: 39rem;
    display: grid;
    align-items: start;
    justify-items: center;
    padding-block: var(--space-m) var(--space-l);
  }

  .bg-reviews-hero__scene::before,
  .bg-reviews-hero__scene::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    translate: -50% -50%;
    inline-size: 100%;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    background: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 6%, transparent);
  }

  .bg-reviews-hero__scene::after {
    inline-size: 76%;
  }

  .bg-reviews-hero__phone {
    inline-size: 65%;
    padding: calc(var(--space-xs) / 2);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-s) var(--space-l) color-mix(in srgb, var(--base) 24%, transparent);
  }

  .bg-reviews-hero__screen {
    display: flex;
    flex-direction: column;
    min-block-size: 32rem;
    border-radius: inherit;
    overflow: hidden;
    font-size: var(--text-s);
    line-height: 1.45;
  }

  .bg-reviews-hero__phone-header {
    color: var(--relative-heading-color, var(--heading-color));
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    display: grid;
    justify-items: center;
    gap: calc(var(--space-xs) / 2);
    padding: var(--space-m) var(--space-s) var(--space-s);
  }

  .bg-reviews-hero__avatar {
    display: inline-grid;
    place-items: center;
    flex: none;
    inline-size: 2.4em;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    font-weight: 700;
  }

  .bg-reviews-hero__messages {
    display: grid;
    gap: var(--space-xs);
    padding: var(--space-s);
  }

  .bg-reviews-hero__timestamp {
    text-align: center;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-xs);
  }

  .bg-reviews-hero__message,
  .bg-reviews-hero__review-link {
    padding: var(--space-xs);
    border-radius: var(--radius);
  }

  .bg-reviews-hero__review-link {
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-reviews-hero__reply {
    color: var(--relative-heading-color, var(--heading-color));
    justify-self: end;
  }

  .bg-reviews-hero__review-link,
  .bg-reviews-hero__card-heading,
  .bg-reviews-hero__status,
  .bg-reviews-hero__reminder {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  .bg-reviews-hero__copy {
    display: grid;
    gap: 0.2em;
  }

  .bg-reviews-hero__small {
    font-size: var(--text-xs);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-reviews-hero__icon {
    display: inline-grid;
    place-items: center;
    inline-size: 2.4em;
    aspect-ratio: 1;
    flex: none;
    border-radius: var(--radius-circle);
  }

  .bg-reviews-hero__glyph {
    inline-size: 1.4em;
    block-size: 1.4em;
    flex: none;
  }

  .bg-reviews-hero__card {
    color: var(--relative-heading-color, var(--heading-color));
    position: absolute;
    padding: var(--space-s);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in srgb, var(--base) 16%, transparent);
    font-size: var(--text-s);
    line-height: 1.4;
  }

  .bg-reviews-hero__status {
    inset-inline-start: 0;
    inset-block-start: 10%;
    max-inline-size: 52%;
  }

  .bg-reviews-hero__rating {
    inset-inline-end: 0;
    inset-block-start: 28%;
    display: grid;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-reviews-hero__rating-value {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  .bg-reviews-hero__rating-number {
    font-size: var(--text-xl);
    line-height: 1;
  }

  .bg-reviews-hero__stars {
    display: inline-flex;
    gap: 0.08em;
    /* Fixed rating gold: deliberately independent of the selected background. */
    color: var(--bg-review-stars-color);
  }

  .bg-reviews-hero__star {
    inline-size: 1em;
    block-size: 1em;
    fill: currentColor;
  }

  .bg-reviews-hero__review {
    inset-inline-end: 0;
    inset-block-end: 0;
    inline-size: 62%;
    display: grid;
    gap: var(--space-xs);
  }

  .bg-reviews-hero__reminder {
    inset-inline-start: 0;
    inset-block-end: 26%;
    max-inline-size: 74%;
    font-weight: 600;
  }

  .bg-reviews-hero__reminder .bg-reviews-hero__glyph {
    color: var(--relative-link-color, var(--primary));
  }

  .bg-reviews-hero__caption {
    padding-block-start: var(--space-s);
    text-align: center;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-xs);
  }

  @container (inline-size < 30rem) {
    .bg-reviews-hero__standard-price {
      padding-inline-start: 0;
      border-inline-start: 0;
    }
  }

  /* Small illustrations become a readable phone and review, without overlapping badges. */
  @container reviews-visual (inline-size < 26rem) {
    .bg-reviews-hero__scene {
      min-block-size: 0;
      gap: var(--space-s);
      padding-block: var(--space-s);
    }

    .bg-reviews-hero__phone {
      inline-size: min(100%, 20rem);
    }

    .bg-reviews-hero__screen {
      min-block-size: 0;
    }

    .bg-reviews-hero__status,
    .bg-reviews-hero__rating,
    .bg-reviews-hero__reminder {
      display: none;
    }

    .bg-reviews-hero__review {
      position: static;
      inline-size: min(100%, 20rem);
    }
  }


/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-hero__icon:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-hero__icon:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

.bg-reviews-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }
.bg-reviews-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }
.bg-reviews-hero__reply.surface-primary { color: var(--relative-heading-color, var(--heading-color)); }
.bg-reviews-hero__reminder.surface-secondary .bg-reviews-hero__glyph { color: inherit; }
& .bg-hero__eyebrow.surface-primary { background: var(--surface-3-background-color); color: var(--relative-heading-color, var(--heading-color)); }

.bg-reviews-hero__amount { color: var(--relative-heading-color, var(--heading-color)); }

/* The shared motion effect supplies the section grid and visual glow. */
.bg-reviews-hero__scene::before, .bg-reviews-hero__scene::after { content: none; }

}
.bg-section-head {
  --bg-header-accent: var(--bg-brand-accent, var(--primary));
  --bg-title-color: var(--relative-heading-color, var(--heading-color));
  --bg-strike-color: var(--bg-brand-accent, var(--primary));
  --bg-lede-color: var(--relative-text-color, var(--text-color));

  display: grid;
  gap: 0;
  max-inline-size: 75rem;

  & .bg-section-head__eyebrow {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    color: var(--bg-header-accent);
    font-size: var(--text-s);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  & .bg-section-head__eyebrow::before {
    content: '';
    flex: 0 0 auto;
    inline-size: 1.125rem;
    block-size: 0.125rem;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  & .bg-section-head__title {
    inline-size: 100%;
    margin: 0;
    color: var(--bg-title-color);
    font-family: var(--heading-font-family);
    font-size: var(--h2);
    font-weight: var(--heading-font-weight);
    letter-spacing: var(--heading-letter-spacing);
    line-height: var(--heading-line-height);
    text-wrap: balance;
  }

  & .bg-section-head__title em {
    color: var(--bg-header-accent);
    font-style: normal;
  }

  & .bg-section-head__part {
    min-inline-size: 0;
  }

  & .bg-section-head__part + .bg-section-head__part::before {
    content: ' ';
  }

  & .bg-section-head__strike {
    position: relative;
    display: inline-block;
    color: color-mix(in oklch, var(--bg-title-color) 62%, transparent);
  }

  & .bg-section-head__strike::after {
    content: '';
    position: absolute;
    inset-inline: -0.08em;
    inset-block-start: 52%;
    block-size: 0.08em;
    border-radius: var(--radius-circle);
    background: var(--bg-strike-color);
    transform: rotate(-2deg);
    transform-origin: center;
  }

  & .bg-section-head__lede {
    max-inline-size: 41.25rem;
    margin: 0;
    color: var(--bg-lede-color);
    font-size: var(--text-m);
    line-height: 1.6;
    text-wrap: pretty;
  }

  &.bg-section-head--center {
    justify-items: center;
    text-align: center;
    margin-inline: auto;
  }

  &.bg-section-head--center .bg-section-head__title {
    justify-content: center;
  }

  &.bg-section-head--center .bg-section-head__eyebrow {
    justify-content: center;
  }

  &.bg-section-head--center .bg-section-head__lede {
    margin-inline: auto;
  }

  &.bg-section-head--split {
    inline-size: 100%;
    grid-template-columns: minmax(0, 47.5rem) minmax(16.25rem, 32.5rem);
    align-items: end;
    justify-content: space-between;
    column-gap: var(--space-xl);
    row-gap: 0;
    max-inline-size: none;
  }

  &.bg-section-head--split .bg-section-head__eyebrow,
  &.bg-section-head--split .bg-section-head__title {
    grid-column: 1;
  }

  &.bg-section-head--split .bg-section-head__lede {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

  @media (max-width: 767px) {
    &.bg-section-head--split {
      grid-template-columns: 1fr;
    }

    &.bg-section-head--split .bg-section-head__lede {
      grid-column: 1;
      grid-row: auto;
    }
  }
  /* Keep the shared eyebrow gap explicit so the title margin reset cannot cancel it. */
  & > .bg-section-head__eyebrow + .bg-section-head__title { margin-block-start: var(--space-xs); }

  /* Heading-to-copy and paragraph-to-paragraph gaps use the normal site setting. */
  & > * + * { margin-block-start: var(--space-xs); }
  & > .bg-section-head__title + .bg-section-head__lede,
  & > .bg-section-head__lede + .bg-section-head__lede { margin-block-start: var(--paragraph-spacing); }
  &.bg-section-head--split > .bg-section-head__lede { margin-block-start: 0; }
  @media (max-width: 767px) {
    &.bg-section-head--split > .bg-section-head__title + .bg-section-head__lede { margin-block-start: var(--paragraph-spacing); }
  }
}
.bg-credibility {
  container-type: inline-size;

  --bg-credibility-icon-size: var(--icon-size-s);
  --bg-credibility-blob-size: 12.5rem;
  --bg-credibility-card-min-height: 29.375rem; /* Shared minimum height while collapsed. */
  --btn-icon-rotate: 180deg;

  .bg-credibility__container {
    display: grid;
    gap: var(--space-xl);
  }

  .bg-credibility__grid {
    display: grid;
    grid-template-columns: var(--grid-2);
    align-items: start;
    gap: var(--space-s);
  }

  .bg-credibility__grid > :only-child {
    grid-column: 1 / -1;
    justify-self: center;
    inline-size: min(100%, 75%);
    min-block-size: 0;
  }

  .bg-credibility__card {
    position: relative;
    overflow: hidden;
    min-inline-size: 0;
    min-block-size: var(--bg-credibility-card-min-height);
    padding: var(--space-l);
    border-radius: var(--radius);
  }

  .bg-credibility__card--regulated {
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-credibility__card-inner {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: start;
  }

  .bg-credibility__logo {
    position: absolute;
    z-index: 2;
    inset-block-start: var(--space-l);
    inset-inline-end: var(--space-l);
    inline-size: min(10.625rem, 32%);
    max-block-size: 5.625rem;
    object-fit: contain;
  }

  .bg-credibility__card--regulated .bg-credibility__card-inner {
    padding-inline-end: 0;
  }

  .bg-credibility__tag {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    inline-size: fit-content;
    max-inline-size: 100%;
    margin-block-end: var(--space-s);
    padding: calc(var(--space-xs) / 2) var(--space-xs);
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;
    text-transform: uppercase;
  }

  .bg-credibility__tag::before {
    content: '';
    inline-size: 0.35em;
    block-size: 0.35em;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-credibility__card--guarantee .bg-credibility__tag,
  .bg-credibility__card--guarantee .bg-credibility__card-title,
  .bg-credibility__card--guarantee .bg-credibility__summary,
  .bg-credibility__card--guarantee .bg-credibility__button {
    max-inline-size: calc(100% - 8rem);
  }

  .bg-credibility__card--guarantee .bg-credibility__pills {
    max-inline-size: 26.875rem;
  }

  .bg-credibility__card-title {
    color: var(--relative-heading-color, var(--heading-color));
    max-inline-size: none;
    font-size: var(--h3);
    line-height: 1.08;
    letter-spacing: -0.02em;
  }

  .bg-credibility__card--regulated .bg-credibility__card-title {
    max-inline-size: calc(100% - 11.875rem);
  }

  .bg-credibility__card-title em {
    color: var(--bg-brand-accent, var(--primary));
    font-style: italic;
  }

  .bg-credibility__summary {
    max-inline-size: none;
    margin-block-start: var(--space-s);
    font-size: var(--text-m);
    line-height: 1.55;
  }

  .bg-credibility__pills {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--space-xs) / 2);
    inline-size: 100%;
    margin-block-start: var(--space-m);
  }

  .bg-credibility__pill {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    padding: calc(var(--space-xs) / 2) var(--space-xs);
    border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1;
  }

  .bg-credibility__card--guarantee .bg-credibility__pill {
    font-size: var(--text-s);
  }

  .bg-credibility__icon {
    display: inline-flex;
    flex: 0 0 auto;
    inline-size: var(--bg-credibility-icon-size);
    block-size: var(--bg-credibility-icon-size);
  }

  .bg-credibility__icon svg {
    display: block;
    inline-size: 100%;
    block-size: 100%;
  }

  .bg-credibility__bottom-line .bg-credibility__icon {
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
  }

  .bg-credibility__condition-icon svg {
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
  }

  .bg-credibility__disclosure {
    inline-size: 100%;
    margin-block-start: var(--space-m);
  }

  .bg-credibility__button {
    inline-size: fit-content;
    max-inline-size: 100%;
    gap: var(--space-xs);
    font-size: var(--text-s);
    list-style: none;
    cursor: pointer;
  }

  .bg-credibility__button::-webkit-details-marker {
    display: none;
  }

  .bg-credibility__label--open {
    display: none;
  }

  .bg-credibility__disclosure[open] .bg-credibility__label--closed {
    display: none;
  }

  .bg-credibility__disclosure[open] .bg-credibility__label--open {
    display: inline;
  }

  .bg-credibility__button .bg-credibility__icon {
    transform-origin: 50% 50%;
    transition: transform 0.2s ease;
  }

  .bg-credibility__disclosure[open] .bg-credibility__button .bg-credibility__icon {
    transform: rotate(var(--btn-icon-rotate));
  }

  @media (prefers-reduced-motion: reduce) {
    .bg-credibility__button .bg-credibility__icon {
      transition: none;
    }
  }

  .bg-credibility__details {
    display: grid;
    gap: var(--space-m);
    grid-column: 1 / -1;
    inline-size: 100%;
    margin-block-start: var(--space-m);
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-credibility__card--guarantee .bg-credibility__details {
    border-block-start-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 18%, transparent);
  }

  .bg-credibility__warning {
    padding: var(--space-s);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-credibility__warning h4 {
    margin-block-end: var(--space-xs);
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  .bg-credibility__warning-list {
    --list-marker-size: var(--bg-credibility-icon-size);
    --list-marker-gap: var(--space-s);
    --list-marker-offset-y: calc((1lh - var(--list-marker-size)) / 2);
    --list-marker-colour: var(--relative-heading-color, var(--heading-color));

    display: grid;
    gap: calc(var(--space-xs) / 2);
    margin: 0;
    padding-block: 0;
    padding-inline: calc(var(--list-marker-size) + var(--list-marker-gap)) 0;
    font-weight: 600;
  }

  .bg-credibility__warning p {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-block-start: var(--space-s);
    padding-block-start: var(--space-s);
    border-block-start: 1px dashed color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    color: var(--bg-brand-accent, var(--primary));
    font-weight: 700;
  }

  .bg-credibility__why {
    padding: var(--space-s);
    border-radius: var(--radius);
  }

  .bg-credibility__why h4,
  .bg-credibility__promise h4 {
    font-size: var(--text-m);
    line-height: 1.2;
  }
  /* Guarantee titles follow the native Surface heading relationship. */
  .bg-credibility__promise h4 {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-credibility__why p {
    margin-block-start: calc(var(--space-xs) / 2);
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-credibility__promise {
    display: grid;
    grid-template-columns: 2.75rem 1fr;
    align-items: start;
    gap: var(--space-s);
  }

  .bg-credibility__promise-num {
    display: inline-grid;
    place-items: center;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    border-radius: var(--radius);
    font-size: var(--text-m);
    font-weight: 800;
    line-height: 1;
  }

  .bg-credibility__promise p {
    margin-block-start: calc(var(--space-xs) / 2);
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-credibility__promise p + p {
    margin-block-start: var(--paragraph-spacing);
  }

  .bg-credibility__promise strong {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-credibility__promise em {
    color: var(--bg-brand-accent, var(--primary));
    font-style: italic;
    font-weight: 700;
  }

  .bg-credibility__verify {
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-credibility__verify a {
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 0.18em;
  }

  .bg-credibility__bottom-line {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-s);
    border-radius: var(--radius);
    font-weight: 800;
  }

  .bg-credibility__condition {
    display: grid;
    grid-template-columns: 2.25rem 1fr;
    gap: var(--space-s);
    padding: var(--space-s);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 8%, transparent);
  }

  .bg-credibility__condition-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 2.25rem;
    block-size: 2.25rem;
    border-radius: var(--radius);
  }

  .bg-credibility__condition h4 {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  .bg-credibility__condition p {
    margin-block-start: calc(var(--space-xs) / 2);
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-credibility__blob {
    position: absolute;
    border-radius: var(--radius-circle);
    pointer-events: none;
  }

  .bg-credibility__blob--regulated {
    inset-inline-end: calc(var(--bg-credibility-blob-size) * -0.3);
    inset-block-end: calc(var(--bg-credibility-blob-size) * -0.3);
    inline-size: var(--bg-credibility-blob-size);
    block-size: var(--bg-credibility-blob-size);
    background: var(--bg-brand-accent, var(--primary));
    opacity: 0.08;
  }

  .bg-credibility__blob--guarantee-main {
    inset-block-start: 0;
    inset-inline-end: 0;
    inset-block-end: auto;
    inset-inline-start: auto;
    inline-size: 15rem;
    block-size: 15rem;
    background: var(--tertiary-light);
    opacity: 0.22;
    transform: translate(32%, -34%);
  }

  .bg-credibility__blob--guarantee-secondary {
    inset-block-start: auto;
    inset-inline-end: auto;
    inset-block-end: 0;
    inset-inline-start: 0;
    inline-size: 12.5rem;
    block-size: 12.5rem;
    background: var(--tertiary-light);
    opacity: 0.25;
    transform: translate(-40%, 45%);
  }

  .bg-credibility__seal {
    position: absolute;
    z-index: 2;
    inset-block-start: var(--space-m);
    inset-inline-end: var(--space-m);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    inline-size: 5.75rem;
    block-size: 5.75rem;
    border-radius: var(--radius-circle);
    text-align: center;
    transform: rotate(-8deg);
  }

  .bg-credibility__seal strong,
  .bg-credibility__seal span {
    display: block;
  }

  .bg-credibility__seal strong {
    font-size: var(--h3);
    line-height: 1;
  }

  .bg-credibility__seal span {
    margin-block-start: 0;
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
  }

  @container (inline-size < 62rem) {
    .bg-credibility__grid {
      grid-template-columns: var(--grid-1);
    }

    .bg-credibility__grid > :only-child {
      inline-size: 100%;
    }

    .bg-credibility__card {
      min-block-size: 0;
    }

    .bg-credibility__card--regulated .bg-credibility__card-inner {
      padding-inline-end: 0;
    }

    .bg-credibility__logo {
      position: absolute;
      inset-block-start: var(--space-l);
      inset-inline-end: var(--space-l);
      inline-size: min(10rem, 36%);
      margin-block-end: 0;
    }
  }

  @container (inline-size < 38rem) {
    .bg-credibility__card {
      padding: var(--space-m);
    }

    .bg-credibility__seal {
      inline-size: 4.75rem;
      block-size: 4.75rem;
      inset-inline-end: var(--space-m);
    }

    .bg-credibility__card--regulated .bg-credibility__tag {
      max-inline-size: calc(100% - 7rem);
    }

    .bg-credibility__card--guarantee .bg-credibility__tag,
    .bg-credibility__card--guarantee .bg-credibility__card-title,
    .bg-credibility__card--guarantee .bg-credibility__summary,
    .bg-credibility__card--guarantee .bg-credibility__pills,
    .bg-credibility__card--guarantee .bg-credibility__button {
      max-inline-size: 100%;
    }

    .bg-credibility__logo {
      position: absolute;
      inset-block-start: var(--space-m);
      inset-inline-end: var(--space-m);
      inline-size: 5.5rem;
      margin-block-end: 0;
    }

    .bg-credibility__card--regulated .bg-credibility__card-title {
      max-inline-size: 100%;
    }
  }

  @container (inline-size < 30rem) {
    .bg-credibility__card--guarantee .bg-credibility__card-inner {
      padding-block-start: 5.25rem;
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */



/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
.bg-credibility__tag.bg--light, .bg-credibility__pill.bg--light {
  --relative-text-color: var(--bg-soft-primary-text);
  --relative-heading-color: var(--bg-soft-primary-text);
  --icon-color: var(--bg-soft-primary-text);
  color: var(--relative-text-color);
}

}
.bg-faqs-specialist {
  container-type: inline-size;
  .bg-faqs-specialist__container { display: grid; gap: var(--space-l); max-inline-size: min(100%, 57.5rem); }
  .bg-faqs-specialist__list { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

}
.bg-content-list-04 {
  container-type: inline-size;

  & .bg-content-list-04__container {
    display: grid;
    gap: var(--space-xl);
  }

  & .bg-content-list-04__head {
    max-inline-size: 53.75rem;
  }

  & .bg-content-list-04__grid {
    display: grid;
    grid-template-columns: var(--grid-3);
    gap: 1px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    counter-reset: bg-content-list-04-item;
    list-style: none;
  }

  & .bg-content-list-04__item {
    display: grid;
    align-content: start;
    gap: 0;
    min-block-size: 13.125rem;
    padding: var(--space-l);
    background: color-mix(in oklch, var(--bg-decoration-surface, var(--body-bg-color)) 88%, var(--relative-heading-color, var(--heading-color)) 12%);
    counter-increment: bg-content-list-04-item;
  }

  & .bg-content-list-04__item-head {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
  }

  /* Original four-colour number sequence; repeat for additional items. */

  & .bg-content-list-04__item:nth-child(4n + 1) {
    --bg-content-list-04-number-color: var(--primary);
  }

  & .bg-content-list-04__item:nth-child(4n + 2) {
    --bg-content-list-04-number-color: var(--secondary);
  }

  & .bg-content-list-04__item:nth-child(4n + 3) {
    --bg-content-list-04-number-color: var(--secondary);
  }

  & .bg-content-list-04__item:nth-child(4n) {
    --bg-content-list-04-number-color: var(--tertiary);
  }

  & .bg-content-list-04__number {
    color: var(--bg-content-list-04-number-color, currentColor);
    font-size: calc(var(--text-s) * 1.2);
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  & .bg-content-list-04__number::before {
    content: counter(bg-content-list-04-item, decimal-leading-zero);
  }

  & .bg-content-list-04__rule {
    flex: 1 1 auto;
    block-size: 1px;
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
  }

  & .bg-content-list-04__title {
    font-size: var(--h4);
    font-weight: 800;
    line-height: 1.18;
    text-wrap: balance;
  }

  & .bg-content-list-04__text {
    font-size: calc(var(--text-s) * 1.1);
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-content-list-04__cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-l);
  }

  & .bg-content-list-04__cta-text {
    color: var(--relative-heading-color, var(--heading-color));
    max-inline-size: 45rem;
    font-size: var(--h4);
    font-weight: 800;
    line-height: 1.35;
    text-wrap: balance;
  }

  & .bg-content-list-04__cta-text span {
    color: var(--bg-brand-accent, var(--primary));
  }

  @container (inline-size < 62rem) {
    & .bg-content-list-04__grid {
      grid-template-columns: var(--grid-2);
    }

    & .bg-content-list-04__cta {
      grid-template-columns: 1fr;
      justify-items: start;
    }
  }

  @container (inline-size < 42rem) {
    & .bg-content-list-04__grid {
      grid-template-columns: 1fr;
    }

    & .bg-content-list-04__item {
      min-block-size: auto;
      padding: var(--space-m);
    }

    & .bg-content-list-04__cta,
    & .bg-content-list-04__cta .bg-button-wrap,
    & .bg-content-list-04__cta .bg-button {
      inline-size: 100%;
    }

    & .bg-content-list-04__cta .bg-button {
      justify-content: center;
    }
  }
  & .bg-content-list-04__item > * + * { margin-block-start: var(--space-s); }
  & .bg-content-list-04__title + .bg-content-list-04__text { margin-block-start: var(--paragraph-spacing); }
}
.bg-beangrower-ai-faq {
  container-type: inline-size;

  .bg-beangrower-ai-faq__container {
    display: grid;
    gap: var(--space-l);
    max-inline-size: min(100%, 57.5rem);
  }

  & .bg-section-head {
    margin-inline: auto;
  }

  .bg-beangrower-ai-faq__list {
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-beangrower-ai-faq__item {
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    padding-block: var(--space-xs);
  }

  .bg-beangrower-ai-faq__summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-m);
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.35;
    list-style: none;
    cursor: pointer;
  }

  .bg-beangrower-ai-faq__summary::-webkit-details-marker {
    display: none;
  }

  .bg-beangrower-ai-faq__question {
    padding-block: calc((var(--icon-size-m) - (var(--text-m) * 1.35)) / 2);
  }

  .bg-beangrower-ai-faq__answer {
    max-inline-size: 45rem;
    margin-block-start: var(--space-xs);
    font-size: var(--text-m);
    line-height: 1.6;
  }

  .bg-beangrower-ai-faq__answer :where(p, ul, ol, h3, h4) {
    margin-block: var(--space-xs) 0;
  }

  & .bg-beangrower-ai-faq__answer h4 {
    font-family: inherit;
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.6;
  }

  .bg-beangrower-ai-faq__answer :where(ul, ol) {
    padding-inline-start: var(--space-m);
  }

  .bg-beangrower-ai-faq__answer li + li {
    margin-block-start: calc(var(--space-xs) / 2);
  }

  .bg-beangrower-ai-faq__answer a:not(.btn) {
    color: var(--relative-link-color, var(--link-color));
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
  }

  .bg-beangrower-ai-faq__icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
    border-radius: var(--radius);
    font-size: var(--text-l);
    font-weight: 800;
    line-height: 1;
  }

  .bg-beangrower-ai-faq__item[open] .bg-beangrower-ai-faq__icon {

    font-size: 0;
  }

  .bg-beangrower-ai-faq__item[open] .bg-beangrower-ai-faq__icon::before {
    content: '-';
    font-size: var(--text-l);
  }
}
.bg-mctb-guarantee {
  /* General Section owns the 35/65 columns and its existing stacking breakpoint. */
  min-inline-size: 0;
  &.bg-mctb-guarantee__artwork { display: grid; place-items: center; align-self: center; padding: var(--space-m); }
  .bg-mctb-guarantee__seal { container-type: inline-size; display: grid; place-items: center; inline-size: min(100%, 15rem); aspect-ratio: 1; padding: var(--space-s); border: 0; border-radius: var(--radius-circle); filter: var(--drop-shadow-2); }
  .bg-mctb-guarantee__seal-inner { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--space-3xs); inline-size: 100%; aspect-ratio: 1; padding: var(--space-xs); border: 2px dashed color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius-circle); text-align: center; line-height: 1.1; transform: rotate(-10deg); }
  .bg-mctb-guarantee__seal-label { font-size: min(var(--text-s), 7cqi); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
  .bg-mctb-guarantee__seal-number { font-size: min(var(--h1), 28cqi); font-weight: 800; letter-spacing: -.04em; line-height: 1; }
  &.bg-mctb-guarantee__copy { display: grid; gap: var(--space-m); }
  .bg-mctb-guarantee__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-mctb-guarantee__actions { display: flex; flex-wrap: wrap; }
  /* Reduce only the button-to-terms gap from space-m to space-xs. */
  .bg-mctb-guarantee__terms { margin-block-start: calc(var(--space-xs) - var(--space-m)); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  @container (inline-size < 36rem) {
    .bg-mctb-guarantee__actions .bg-button-wrap, .bg-mctb-guarantee__actions .bg-button { inline-size: 100%; }
    .bg-mctb-guarantee__actions .bg-button { justify-content: center; }
  }

}
.bg-cis-how-it-works {
  container-type: inline-size;
  & .bg-cis-how-it-works__container {
    display: grid;
    gap: var(--space-l);
  }

  & .bg-cis-how-it-works__head {
    display: grid;
    gap: var(--space-s);
    max-inline-size: 45rem;
  }

  & .bg-cis-how-it-works__intro p,
  & .bg-cis-how-it-works__treatment h3,
  & .bg-cis-how-it-works__treatment p,
  & .bg-cis-how-it-works__outro {
    margin: 0;
  }



  & .bg-cis-how-it-works__outro strong {
    color: var(--bg-brand-accent, var(--primary));
  }

  & .bg-cis-how-it-works__intro {
    display: grid;
    gap: var(--space-xs);
    margin-block-start: var(--space-xs);
  }

  & .bg-cis-how-it-works__intro p,
  & .bg-cis-how-it-works__outro {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-cis-how-it-works__treatments {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    border-radius: var(--radius);
    list-style: none;
  }

  & .bg-cis-how-it-works__treatment {
    display: grid;
    align-content: start;
    gap: var(--space-s);
    min-block-size: auto;
    min-inline-size: 0;
    padding: var(--space-m);
    background: var(--bg-decoration-surface, var(--body-bg-color));
  }

  & .bg-cis-how-it-works__treatment + .bg-cis-how-it-works__treatment {
    border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

  & .bg-cis-how-it-works__number {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-s);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
  }

  & .bg-cis-how-it-works__treatment h3 {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h4);
    font-weight: 700;
    line-height: 1.3;
    text-wrap: balance;
  }

  & .bg-cis-how-it-works__treatment p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-cis-how-it-works__outro {
    max-inline-size: 74ch;
  }

  & .bg-cis-how-it-works__outro strong {
    font-weight: 700;
  }

  @container (inline-size < 48rem) {
    .bg-cis-how-it-works__treatments {
      grid-template-columns: 1fr;
    }

    .bg-cis-how-it-works__treatment {
      min-block-size: auto;
      padding: var(--space-m);
    }

    .bg-cis-how-it-works__treatment + .bg-cis-how-it-works__treatment {
      border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
      border-inline-start: 0;
    }
  }
}
.bg-faqs-01 {
  container-type: inline-size;

  & .bg-faqs-01__container {
    display: grid;
    gap: var(--space-l);
    max-inline-size: min(100%, 57.5rem);
  }


  & .bg-faqs-01__list {
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  & .bg-faqs-01__item {
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    padding-block: var(--space-xs);
  }

  & .bg-faqs-01__summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-m);
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.35;
    list-style: none;
    cursor: pointer;
  }

  & .bg-faqs-01__summary::-webkit-details-marker {
    display: none;
  }

  & .bg-faqs-01__question {
    padding-block: calc((var(--icon-size-m) - (var(--text-m) * 1.35)) / 2);
  }

  & .bg-faqs-01__answer {
    max-inline-size: 45rem;
    margin-block-start: var(--space-xs);
    font-size: var(--text-m);
    line-height: 1.6;
  }

  & .bg-faqs-01__answer :where(ul, ol, h3, h4) {
    margin-block: var(--space-xs) 0;
  }

  & .bg-faqs-01__answer h4 {
    font-family: inherit;
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.6;
  }

  & .bg-faqs-01__answer :where(ul, ol) {
    padding-inline-start: var(--space-m);
  }

  & .bg-faqs-01__answer li + li {
    margin-block-start: calc(var(--space-xs) / 2);
  }

  & .bg-faqs-01__answer a:not(.btn) {
    color: var(--relative-link-color, var(--link-color));
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
  }

  & .bg-faqs-01__icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
    border-radius: var(--radius);
    font-size: var(--text-l);
    font-weight: 800;
    line-height: 1;
  }

  & .bg-faqs-01__item[open] .bg-faqs-01__icon {

    font-size: 0;
  }

  & .bg-faqs-01__item[open] .bg-faqs-01__icon::before {
    content: '-';
    font-size: var(--text-l);
  }

  & .bg-faqs-01__summary:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: .25rem; }
  & .bg-faqs-01__answer :is(h1, h2, h3, h4, h5, h6) + p { margin-block-start: var(--paragraph-spacing); }
}
:where([data-etch-element="container"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  max-inline-size: var(--content-width, 1366px);
  align-self: center; margin-inline: auto;
}
:where([data-etch-element="flex-div"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
}
:where([data-etch-element="iframe"]) {
  inline-size: 100%;
  height: auto;
 aspect-ratio: 16/9;
}
:where([data-etch-element="section"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bg-problems {
  --bg-problems-card-radius: var(--bg-pack-card-radius, var(--radius));
  --bg-problems-icon-box-size: 3.5rem;
  --bg-problems-icon-svg-size: 2.1875rem;

  container-type: inline-size;
  overflow: hidden;


  .bg-problems__container {
    display: grid;
    gap: var(--space-l);
  }

  .bg-problems__head {
    display: grid;
    justify-items: start;
    text-align: left;
    gap: var(--space-xs);
    max-inline-size: 51.25rem;
    margin-inline: 0;
  }

  .bg-problems__counter {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) * 0.75);
    margin-block-start: calc(var(--space-xs) / 2);
    padding: calc(var(--space-xs) / 2) var(--space-s) calc(var(--space-xs) / 2) calc(var(--space-xs) / 2);
    border: 1.5px solid var(--border-color-dark);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 600;
    transition:
      background var(--transition),
      border-color var(--transition),
      color var(--transition);
  }

  .bg-problems__counter.is-engaged {
    border-color: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    background: var(--bg-decoration-surface, var(--bg-light));
    color: var(--relative-link-color, var(--primary));
  }

  .bg-problems__counter-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-inline-size: calc(var(--space-m) * 1.15);
    block-size: calc(var(--space-m) * 1.15);
    padding-inline: var(--space-xs);
    border-radius: var(--radius-circle);
    background: var(--bg-dark);
    color: var(--bg-dark-heading);
    font-size: var(--text-m);
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    transition:
      background var(--transition),
      color var(--transition);
  }

  .bg-problems__counter.is-engaged .bg-problems__counter-num {
    background: var(--bg-decoration-surface, var(--bg-light));
    color: var(--relative-link-color, var(--primary));
  }

  .bg-problems__counter-label {
    display: grid;
    gap: 0;
    text-align: left;
  }

  .bg-problems__counter-label small {
    font-weight: 500;
    opacity: 0.7;
  }

  .bg-problems__grid {
    display: grid;
    grid-template-columns: var(--grid-3);
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    counter-reset: bg-problem-card;
    list-style: none;
  }

  .bg-problems__item {
    display: grid;
    counter-increment: bg-problem-card;
  }

  .bg-problems__card {
    --bg-problems-card-bg: var(--bg-decoration-surface, var(--bg-light));
    --bg-problems-card-fg: var(--relative-link-color, var(--primary));
    --bg-problems-card-border: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    --bg-problems-rotation: 0deg;

    position: relative;
    display: block;
    min-block-size: 13.125rem;
    padding: 1.5rem;
    overflow: hidden;
    border: 2px solid color-mix(in oklch, var(--bg-problems-card-fg) 28%, transparent);
    border-radius: var(--bg-problems-card-radius);
    background: var(--body-bg-color);
    cursor: pointer;
    user-select: none;
    transition:
      transform var(--transition),
      box-shadow var(--transition),
      background var(--transition),
      border-color var(--transition),
      color var(--transition);
  }

  .bg-problems__card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(160deg, var(--bg-problems-card-bg) 0%, transparent 58%);
    opacity: 0.65;
    pointer-events: none;
    transition: opacity var(--transition);
  }

  .bg-problems__card:hover {
    border-color: color-mix(in oklch, var(--bg-problems-card-fg) 42%, transparent);
    transform: translateY(calc(var(--space-xs) * -1)) rotate(var(--bg-problems-rotation, -0.5deg));
    box-shadow: var(--box-shadow-2);
  }

  .bg-problems__item:nth-child(6n + 1) .bg-problems__card {
  --bg-problems-rotation: -0.8deg;
}

.bg-problems__item:nth-child(6n + 2) .bg-problems__card {
  --bg-problems-rotation: 0.6deg;
}

.bg-problems__item:nth-child(6n + 3) .bg-problems__card {
  --bg-problems-rotation: -0.4deg;
}

.bg-problems__item:nth-child(6n + 4) .bg-problems__card {
  --bg-problems-rotation: 0.8deg;
}

.bg-problems__item:nth-child(6n + 5) .bg-problems__card {
  --bg-problems-rotation: -0.6deg;
}

.bg-problems__item:nth-child(6n) .bg-problems__card {
  --bg-problems-rotation: 0.4deg;
}

  .bg-problems__checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  /* The checkbox remains keyboard-operable inside its label, so expose focus
     on the visible card rather than leaving keyboard users without a cue. */
  .bg-problems__card:has(.bg-problems__checkbox:focus-visible) {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
  }

  .bg-problems__number {
    position: absolute;
    inset-block-start: var(--space-xs);
    inset-inline-end: var(--space-s);
    color: var(--bg-problems-card-bg);
    font-size: 2.625rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
    transition:
      color var(--transition),
      opacity var(--transition);
  }

  .bg-problems__number::before {
    content: counter(bg-problem-card, decimal-leading-zero);
  }

  .bg-problems__card-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .bg-problems__icon {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-problems-icon-box-size);
    block-size: var(--bg-problems-icon-box-size);
    margin-block-end: 1.25rem;
    border-radius: var(--radius);
    background: var(--bg-problems-card-bg);
    color: var(--bg-problems-card-fg);
    transition:
      background var(--transition),
      color var(--transition);
  }

  .bg-problems__icon svg {
    inline-size: var(--bg-problems-icon-svg-size);
    block-size: var(--bg-problems-icon-svg-size);
  }

  .bg-problems__title {
    display: block;
    max-inline-size: 18ch;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h4);
    font-weight: 800;
    line-height: 1.12;
    transition: color var(--transition);
  }

  .bg-problems__text {
    display: block;
    max-inline-size: 32ch;
    margin-block-start: var(--space-xs);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.45;
    transition: color var(--transition);
  }

  .bg-problems__tick {
    position: absolute;
    z-index: 2;
    inset-block-end: var(--space-s);
    inset-inline-end: var(--space-s);
    display: inline-grid;
    place-items: center;
    inline-size: var(--space-m);
    block-size: var(--space-m);
    border: 2px solid var(--border-color-dark);
    border-radius: var(--radius-circle);
    background: var(--body-bg-color);
    transition:
      background var(--transition),
      border-color var(--transition),
      transform var(--transition);
  }

  .bg-problems__tick svg {
    inline-size: var(--icon-size-xs);
    block-size: var(--icon-size-xs);
    opacity: 0;
    transition: opacity var(--transition);
  }

  .bg-problems__tick svg polyline {
    fill: none;
    stroke: var(--bg-problems-card-bg);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) {
    border-color: color-mix(in srgb, var(--bg-dark-heading) 22%, transparent);
    background: var(--bg-dark);
    color: var(--bg-dark-text);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked)::before {
    opacity: 0.18;
    background: linear-gradient(160deg, var(--bg-problems-card-fg) 0%, transparent 58%);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__number {
    color: var(--bg-problems-card-fg);
    opacity: 0.55;
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__title {
    color: var(--bg-dark-heading);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__text {
    color: var(--bg-dark-text);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__icon {
    background: var(--bg-problems-card-fg);
    color: var(--bg-problems-card-bg);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__tick {
    border-color: var(--bg-problems-card-fg);
    background: var(--bg-problems-card-fg);
    transform: scale(1.06);
  }

  .bg-problems__card:has(.bg-problems__checkbox:checked) .bg-problems__tick svg {
    opacity: 1;
  }

  .bg-problems__cta {
      --bg-problems-cta-bg: var(--bg-decoration-surface, var(--body-bg-color));
  --bg-problems-cta-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  --bg-problems-cta-heading: var(--relative-heading-color, var(--heading-color));
  --bg-problems-cta-text: var(--relative-text-color, var(--text-color));

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-l);
    margin-block-start: 0;
    padding: var(--space-m);
      border: 1.5px solid var(--bg-problems-cta-border);
    border-radius: var(--bg-problems-card-radius);
      background: var(--bg-problems-cta-bg);
    transition:
      background var(--transition),
      border-color var(--transition);
  }

  /* The CTA uses its own dark background for every selection count. */

  .bg-problems__cta-copy {
    display: grid;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-problems__cta-message {
    display: none;
  }

  &[data-state='zero'] .bg-problems__cta-message--zero,
  &[data-state='some'] .bg-problems__cta-message--some,
  &[data-state='many'] .bg-problems__cta-message--many {
    display: grid;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-problems__cta-heading {
    /* CTA messages are intentional grid rows rather than Smart Spacing flow. */
    margin: 0;
    font-size: var(--h4);
    line-height: 1.15;
    color: var(--bg-problems-cta-heading);
  }

  .bg-problems__cta-text {
    margin: 0;
    font-size: var(--text-s);
      color: var(--bg-problems-cta-text);
  }



  @container (inline-size < 64rem) {
    .bg-problems__grid {
      grid-template-columns: var(--grid-2);
    }

  }

  @container (inline-size < 40rem) {
    .bg-problems__grid {
      grid-template-columns: var(--grid-2);
    }

    .bg-problems__card-inner {
      padding-inline-end: calc(var(--space-m) + var(--space-xs));
    }

    .bg-problems__title {
      max-inline-size: 100%;
      overflow-wrap: normal;
    }

    .bg-problems__tick {
      inset-block-end: calc(var(--space-xs) / 2);
      inset-inline-end: calc(var(--space-xs) / 2);
      inline-size: calc(var(--space-m) * 0.82);
      block-size: calc(var(--space-m) * 0.82);
    }

    .bg-problems__cta {
      grid-template-columns: 1fr;
    }
  }

  @container (inline-size < 25rem) {
    .bg-problems__grid {
      grid-template-columns: 1fr;
    }

    .bg-problems__number {
      inset-block-start: var(--space-s);
      font-size: 1.875rem;
    }

    .bg-problems__counter {
      align-items: flex-start;
      border-radius: var(--radius);
    }
  }
}
.bg-beangrower-ai-use-cases {
  min-inline-size: 0;

  .bg-beangrower-ai-use-cases__header {
    max-inline-size: 51.25rem;
  }

  .bg-beangrower-ai-use-cases__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-beangrower-ai-use-cases__item {
    display: grid;
    min-inline-size: 0;
  }

  .bg-beangrower-ai-use-cases__card {
    position: relative;
    display: grid;
    justify-items: center;
    align-content: start;
    gap: var(--space-s);
    min-block-size: 20.625rem;
    padding: var(--space-l) var(--space-m) var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    text-align: center;
  }

  .bg-beangrower-ai-use-cases__number {
    position: absolute;
    inset-block-start: var(--space-s);
    inset-inline-start: var(--space-s);
    display: inline-grid;
    place-items: center;
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: var(--radius);
    
    
    font-size: var(--text-s);
    font-weight: 800;
    line-height: 1;
  }

  .bg-beangrower-ai-use-cases__icon {
    display: inline-grid;
    place-items: center;
    inline-size: 8.625rem;
    block-size: 8.625rem;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    
    
  }

  .bg-beangrower-ai-use-cases__icon > svg[data-icon],
  .bg-beangrower-ai-use-cases__footer-icon > svg[data-icon] {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-beangrower-ai-use-cases__mask {
    display: block;
    inline-size: 65%;
    block-size: 65%;
    background-color: var(--icon-color);
    mask-image: var(--bg-use-cases-mask);
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-image: var(--bg-use-cases-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
  }

  .bg-beangrower-ai-use-cases__mask--ai-receptionist { --bg-use-cases-mask: url("../assets/use-cases-ai-receptionist-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--website-funnel { --bg-use-cases-mask: url("../assets/use-cases-website-funnel-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--website-chat { --bg-use-cases-mask: url("../assets/use-cases-website-chat-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--missed-call-text-back { --bg-use-cases-mask: url("../assets/use-cases-missed-call-text-back-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--reviews { --bg-use-cases-mask: url("../assets/use-cases-reviews-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--reactivate-leads { --bg-use-cases-mask: url("../assets/use-cases-reactivate-leads-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__mask--newsletters-campaigns { --bg-use-cases-mask: url("../assets/use-cases-newsletters-campaigns-mask-vector.svg"); }

  .bg-beangrower-ai-use-cases__icon--inbox {
    position: relative;
  }

  .bg-beangrower-ai-use-cases__icon--inbox .bg-beangrower-ai-use-cases__mask {
    position: absolute;
    inset: 17.5%;
    inline-size: auto;
    block-size: auto;
  }

  .bg-beangrower-ai-use-cases__mask--inbox-whatsapp {
    --bg-use-cases-mask: url("../assets/use-cases-inbox-whatsapp-mask-vector.svg");
  }

  .bg-beangrower-ai-use-cases__mask--inbox-chat {
    --bg-use-cases-mask: url("../assets/use-cases-inbox-chat-mask-vector.svg");
  }

  .bg-beangrower-ai-use-cases__mask--inbox-email {
    --bg-use-cases-mask: url("../assets/use-cases-inbox-email-mask-vector.svg");
  }

  .bg-beangrower-ai-use-cases__copy {
    display: grid;
    gap: 0.375rem;
  }

  .bg-beangrower-ai-use-cases__copy h3,
  .bg-beangrower-ai-use-cases__copy p {
    margin: 0;
  }

  .bg-beangrower-ai-use-cases__copy h3 {
    font-size: var(--text-l);
    line-height: 1.15;
    letter-spacing: -0.035em;
  }

  .bg-beangrower-ai-use-cases__copy p {
    font-size: var(--text-m);
    line-height: 1.45;
  }

  .bg-beangrower-ai-use-cases__footer {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    align-items: center;
    gap: var(--space-m);
    padding: var(--space-m) var(--space-l);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-use-cases__footer-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 4.5rem;
    block-size: 4.5rem;
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-use-cases__footer-icon > svg[data-icon] {
    inline-size: 2.375rem;
    block-size: 2.375rem;
    stroke-width: 1.75;
  }

  .bg-beangrower-ai-use-cases__footer-title {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-l);
    font-weight: 800;
    line-height: 1.25;
  }

  .bg-beangrower-ai-use-cases__footer-text {
    margin-block: 0.25rem 0;
    font-size: var(--text-m);
    line-height: 1.45;
  }

  @container (inline-size < 70rem) {
    .bg-beangrower-ai-use-cases__grid {
      grid-template-columns: var(--grid-2);
    }

    .bg-beangrower-ai-use-cases__card {
      min-block-size: 18.75rem;
    }
  }

  @container (inline-size < 42rem) {

    .bg-beangrower-ai-use-cases__grid {
      grid-template-columns: var(--grid-1);
    }

    .bg-beangrower-ai-use-cases__card {
      min-block-size: 0;
      padding: var(--space-l) var(--space-s) var(--space-s);
    }
  }

  @container (inline-size < 32rem) {
    .bg-beangrower-ai-use-cases__icon {
      inline-size: 7rem;
      block-size: 7rem;
    }

    .bg-beangrower-ai-use-cases__mask {
      inline-size: 68%;
      block-size: 68%;
    }

    .bg-beangrower-ai-use-cases__footer {
      grid-template-columns: 3.375rem minmax(0, 1fr);
      gap: var(--space-s);
      padding: var(--space-s);
    }

    .bg-beangrower-ai-use-cases__footer-icon {
      inline-size: 3.375rem;
      block-size: 3.375rem;
    }

    .bg-beangrower-ai-use-cases__footer-icon > svg[data-icon] {
      inline-size: 1.8125rem;
      block-size: 1.8125rem;
    }

    .bg-beangrower-ai-use-cases__footer-title {
      font-size: var(--text-m);
    }

    .bg-beangrower-ai-use-cases__footer-text {
      font-size: var(--text-s);
    }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  /* Heading, cards and closing note form one closely spaced card collection. */

  &.bg-beangrower-ai-use-cases__body { display: grid; row-gap: var(--space-m); }

  .bg-beangrower-ai-use-cases__icon, .bg-beangrower-ai-use-cases__tick, .bg-beangrower-ai-use-cases__footer-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-use-cases__mask { background-color: currentColor; }

  /* Match the Goodbye disconnected tools callout. */

  .bg-beangrower-ai-use-cases__footer-icon { }

  .bg-beangrower-ai-use-cases__footer-icon:is(.surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }
}
.bg-faq-item {
  border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  padding-block: var(--space-xs);
  .bg-faq-item__summary { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-m); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 600; line-height: 1.35; list-style: none; cursor: pointer; }
  .bg-faq-item__summary::-webkit-details-marker { display: none; }
  .bg-faq-item__summary:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: .25rem; }
  .bg-faq-item__question { padding-block: max(0px, calc((var(--icon-size-m) - (var(--text-m) * 1.35)) / 2)); }
  .bg-faq-item__answer { max-inline-size: 45rem; margin-block-start: var(--space-xs); font-size: var(--text-m); line-height: 1.6; }
  .bg-faq-item__answer :where(ul, ol) { padding-inline-start: var(--space-m); }
  .bg-faq-item__answer li + li { margin-block-start: calc(var(--space-xs) / 2); }
  .bg-faq-item__answer a:not(.btn) { color: var(--relative-link-color, var(--link-color)); text-decoration-thickness: 1px; text-underline-offset: .16em; }
  .bg-faq-item__icon { display: inline-grid; flex: 0 0 auto; place-items: center; inline-size: var(--icon-size-m); block-size: var(--icon-size-m); border-radius: var(--radius); font-size: var(--text-l); font-weight: 800; line-height: 1; }
  &[open] .bg-faq-item__icon { background-color: var(--bg-ultra-light-link); color: var(--bg-ultra-light); border-color: var(--bg-ultra-light-link); font-size: 0; }
  &[open] .bg-faq-item__icon::before { content: '-'; font-size: var(--text-l); }

}
.bg-mctb-benefits {
  
  min-inline-size: 0;
  &.bg-mctb-benefits__card { display: flex; flex-direction: column; align-self: stretch; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-mctb-benefits__icon { display: grid; place-items: center; flex: none; inline-size: calc(var(--text-m) * 3); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-mctb-benefits__glyph { display: block; inline-size: var(--text-l); block-size: var(--text-l); }
  .bg-mctb-benefits__copy { display: grid; gap: var(--space-xs); }
  .bg-mctb-benefits__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.4; }
  .bg-mctb-benefits__description, .bg-mctb-benefits__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-mctb-benefits__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-mctb-benefits__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-beangrower-ai-support {
  min-inline-size: 0;

  .bg-beangrower-ai-support__intro-text { max-inline-size: 39.375rem; margin: 0; font-size: var(--text-m); line-height: 1.5; }

  .bg-beangrower-ai-support__cards > li { display: grid; min-inline-size: 0; }

  .bg-beangrower-ai-support__card { display: grid; justify-items: center; align-content: start; gap: var(--space-s); min-block-size: 23.125rem; padding: var(--space-m) var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); text-align: center; }

  .bg-beangrower-ai-support__card h3, .bg-beangrower-ai-support__card p { margin: 0; }

  .bg-beangrower-ai-support__card h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: 1.18; letter-spacing: -.035em; }

  .bg-beangrower-ai-support__card p { font-size: var(--text-m); line-height: 1.48; }

  .bg-beangrower-ai-support__card p + p { margin-block-start: 0.125rem; }

  .bg-beangrower-ai-support__icon { display: inline-grid; place-items: center; inline-size: 5.375rem; block-size: 5.375rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius);   }

  .bg-beangrower-ai-support__icon svg, .bg-beangrower-ai-support__footer-icon svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }

  .bg-beangrower-ai-support__icon svg { inline-size: 2.6875rem; block-size: 2.6875rem; }

  .bg-beangrower-ai-support__rule { inline-size: 2.75rem; block-size: 0.125rem; background: var(--bg-brand-accent, var(--primary)); }

  .bg-beangrower-ai-support__footer-icon { display: inline-grid; place-items: center; inline-size: 4.75rem; block-size: 4.75rem; border-radius: var(--radius); }

  .bg-beangrower-ai-support__footer-icon svg { inline-size: 2.5rem; block-size: 2.5rem; }

  .bg-beangrower-ai-support__footer p { margin: 0; }

  .bg-beangrower-ai-support__footer-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 800; line-height: 1.2; letter-spacing: -.03em; }

  .bg-beangrower-ai-support__footer .bg-beangrower-ai-support__footer-text { margin-block-start: 0.375rem; font-size: var(--text-m); line-height: 1.45; }

  .bg-beangrower-ai-support__footer-text strong { color: var(--primary); }

  @container (inline-size < 68rem) {
    

    
    
    
    
    
    .bg-beangrower-ai-support__cards > li:last-child { grid-column: 2; }
    .bg-beangrower-ai-support__card { min-block-size: 20.625rem; }
  }

  @container (inline-size < 48rem) {
    
    .bg-beangrower-ai-support__cards > li:last-child { grid-column: auto; }
    .bg-beangrower-ai-support__card { min-block-size: 0; }
  }

  @container (inline-size < 32rem) {
    
    .bg-beangrower-ai-support__card { padding: var(--space-m) var(--space-s); }
    
    .bg-beangrower-ai-support__footer-icon { inline-size: 3.5rem; block-size: 3.5rem; }
    .bg-beangrower-ai-support__footer-icon svg { inline-size: 1.875rem; block-size: 1.875rem; }
    .bg-beangrower-ai-support__footer-title { font-size: var(--text-m); }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  &.bg-beangrower-ai-support__closing { display: grid; row-gap: var(--space-l); }

  .bg-beangrower-ai-support__intro { display: grid; gap: var(--space-m); }

  .bg-beangrower-ai-support__visual { min-inline-size: 0; margin: 0; }

  .bg-beangrower-ai-support__visual-mask { display: block; aspect-ratio: 1672 / 941; inline-size: 100%; max-inline-size: 43.75rem; margin-inline: auto; background-color: var(--bg-brand-accent, var(--primary)); mask-image: url("../assets/support-ai-illustration-mask-vector.svg"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; -webkit-mask-image: url("../assets/support-ai-illustration-mask-vector.svg"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; }

  .bg-beangrower-ai-support__footer { display: grid; grid-template-columns: 4.75rem minmax(0, 1fr); align-items: center; gap: var(--space-m); padding: var(--space-m) var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-support__cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-s); margin: 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-support__closing { container-type: inline-size; }
  @container (inline-size < 68rem) { .bg-beangrower-ai-support__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  @container (inline-size < 48rem) { .bg-beangrower-ai-support__cards { grid-template-columns: var(--grid-2); } }
  @container (inline-size < 32rem) { .bg-beangrower-ai-support__cards { grid-template-columns: var(--grid-1); } .bg-beangrower-ai-support__footer { grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); } }

  .bg-beangrower-ai-support__icon, .bg-beangrower-ai-support__tick, .bg-beangrower-ai-support__footer-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-support__rule { background: var(--primary); }

/* Keep decorative rules thin when empty-element minimums apply. */
.bg-beangrower-ai-support__rule { min-block-size: 0; }
/* Match the Goodbye disconnected tools callout. */
.bg-beangrower-ai-support__footer-icon { }
.bg-beangrower-ai-support__footer-icon:is(.surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }
}
.bg-content-groups-03 {
  container-type: inline-size;
  & .bg-content-groups-03__container { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-l); align-items: start; }
  &[data-columns="2"] .bg-content-groups-03__container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  &[data-heading-position="above"] .bg-content-groups-03__header { grid-column: 1 / -1; }
  & .bg-content-groups-03__header, & .bg-content-groups-03__group { min-inline-size: 0; }
  & .bg-content-groups-03__header > * + *, & .bg-content-groups-03__group > * + * { margin-block-start: var(--space-m); }
  & .bg-content-groups-03__heading { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.25; }
  & .bg-content-groups-03__prose { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }
  & .bg-content-groups-03__prose > * { margin-block: 0; }
  & .bg-content-groups-03__prose > * + * { margin-block-start: var(--space-m); }
  & .bg-content-groups-03__prose > * + p { margin-block-start: var(--paragraph-spacing); }
  & .bg-content-groups-03__prose :is(h3,h4) { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.25; }
  & .bg-content-groups-03__prose strong { color: var(--relative-heading-color, var(--heading-color)); }
  & .bg-content-groups-03__prose ul { padding: 0; list-style: none; }
  & .bg-content-groups-03__prose li { position: relative; padding-inline-start: calc(1.25em + var(--space-s)); margin: 0; }
  & .bg-content-groups-03__prose li + li { margin-block-start: var(--space-s); }
  & .bg-content-groups-03__prose li::before { content: "✓"; position: absolute; inset-inline-start: 0; inset-block-start: .1em; display: grid; place-items: center; inline-size: 1.25em; block-size: 1.25em; border-radius: var(--radius-circle); background: var(--relative-link-color, var(--primary)); color: var(--bg-decoration-surface, var(--text-light)); font-weight: 700; line-height: 1; }
  & .bg-content-groups-03__panel { padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  & .bg-content-groups-03__panel > * + * { margin-block-start: var(--space-m); }
  & .bg-content-groups-03__panel-head { display: flex; align-items: center; gap: var(--space-s); }
  & .bg-content-groups-03__panel-heading { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: 1.25; }
  & .bg-content-groups-03__panel .bg-content-groups-03__prose li + li { padding-block-start: var(--space-s); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  & .bg-content-groups-03__panel .bg-content-groups-03__prose li + li::before { inset-block-start: calc(var(--space-s) + .1em); }
  & .bg-content-groups-03__insight { display: flex; align-items: start; gap: var(--space-s); padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--primary) 20%, transparent); border-radius: var(--radius); }
  & .bg-content-groups-03__insight-text { margin: 0; color: currentColor; font-size: var(--text-m); font-weight: 700; line-height: 1.45; }
  @container (inline-size < 64rem) { &[data-heading-position="first"] .bg-content-groups-03__header { grid-column: 1 / -1; } &[data-heading-position="first"] .bg-content-groups-03__container { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @container (inline-size < 48rem) { &[data-columns] .bg-content-groups-03__container { grid-template-columns: minmax(0, 1fr); } }
  & .bg-content-groups-03__heading + .bg-content-groups-03__prose:has(> p:first-child),
  & .bg-content-groups-03__panel-head + .bg-content-groups-03__prose:has(> p:first-child) { margin-block-start: var(--paragraph-spacing); }
}
.bg-faq {
  container-type: inline-size;

  .bg-faq__container {
    display: grid;
    gap: var(--space-l);
    inline-size: 100%;
    max-inline-size: 57.5rem;
    min-inline-size: 0;
  }

  .bg-faq__tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    justify-self: center;
    gap: calc(var(--space-xs) / 3);
    inline-size: fit-content;
    max-inline-size: 100%;
    padding: calc(var(--space-xs) / 3);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-faq__tabs[hidden],
  .bg-faq__tab[hidden],
  .bg-faq__panel[hidden],
  .bg-faq__category-title[hidden] {
    display: none;
  }

  .bg-faq__tab {
    min-inline-size: 0;
    min-block-size: 2.75rem;
    border: 0;
    border-radius: var(--radius);
    background: transparent;
    color: var(--relative-text-color, var(--text-color));
    font: inherit;
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.3;
    padding: calc(var(--space-xs) / 1.4) var(--space-s);
    overflow-wrap: anywhere;
    cursor: pointer;
    transition:
      background-color var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing);
  }

  .bg-faq__tab:hover:not([aria-selected="true"]) {
    background: var(--bg-light);
    color: var(--bg-light-heading);
  }

  .bg-faq__tab[aria-selected="true"] {
    background: var(--bg-ultra-light-link);
    color: var(--bg-ultra-light);
  }

  .bg-faq__tab:focus-visible,
  .bg-faq__question:focus-visible,
  .bg-faq__panel:focus-visible {
    outline: 2px solid var(--bg-brand-accent, var(--primary));
    outline-offset: 3px;
  }

  .bg-faq__panels,
  .bg-faq__panel {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
  }

  /* Tab panels share a grid cell so shorter categories do not shrink the
     page and shift the tab bar. Without JavaScript, groups stack normally. */
  .bg-faq__panel[role="tabpanel"] {
    grid-area: 1 / 1;
    align-self: start;
  }

  .bg-faq__panel[role="tabpanel"][hidden] {
    display: grid;
    visibility: hidden;
    pointer-events: none;
  }

  .bg-faq__list {
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-faq__item {
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    padding-block: var(--space-xs);
  }

  .bg-faq__question {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-m);
    min-block-size: 2.75rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.35;
    overflow-wrap: anywhere;
    list-style: none;
    cursor: pointer;
  }

  .bg-faq__question::-webkit-details-marker {
    display: none;
  }

  .bg-faq__answer {
    display: grid;
    gap: var(--paragraph-spacing);
    max-inline-size: 45rem;
    padding-block-start: var(--space-xs);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.6;
    overflow-wrap: anywhere;
    white-space: pre-line;
  }

  .bg-faq__answer :where(ul, ol) {
    padding-inline-start: var(--space-m);
    /* Ignore formatting newlines between existing HTML list items. */
    white-space: normal;
  }

  .bg-faq__answer li {
    white-space: pre-line;
  }

  .bg-faq__answer li + li {
    margin-block-start: calc(var(--space-xs) / 2);
  }

  .bg-faq__icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: var(--icon-size-m);
    block-size: var(--icon-size-m);
    border-radius: var(--radius);
    font-size: var(--text-l);
    font-weight: 800;
    line-height: 1;
  }

  .bg-faq__icon::before {
    content: '+';
  }

  .bg-faq__item[open] .bg-faq__icon {
    background-color: var(--bg-ultra-light-link);
    color: var(--bg-ultra-light);
    border-color: var(--bg-ultra-light-link);
  }

  .bg-faq__item[open] .bg-faq__icon::before {
    content: '−';
  }

  /* Below 40rem of section width, category buttons form two columns. */
  @container (inline-size < 40rem) {
    .bg-faq__tabs {
      inline-size: 100%;
      border-radius: var(--radius);
    }

    .bg-faq__tab {
      flex: 1 1 calc(50% - var(--space-xs));
      padding-inline: var(--space-xs);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .bg-faq__tab {
      transition: none;
    }
  }
}
.bg-header {
  --bg-header-bg: var(--bg-decoration-surface, var(--body-bg-color));
  --bg-header-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  --bg-header-nav-item: var(--relative-text-color, var(--text-color));
  --bg-header-nav-item-hover-active: var(--bg-brand-accent, var(--primary));
  --bg-header-hover-bg: var(--bg-primary-soft);
  --bg-header-dropdown-bg: var(--bg-decoration-surface, var(--body-bg-color));
  --bg-header-dropdown-link: var(--relative-heading-color, var(--heading-color));
  --bg-header-dropdown-description: var(--relative-text-color, var(--text-color));
  --bg-header-mega-muted-bg: var(--bg-ultra-light);
  --bg-header-mega-cta-bg: var(--primary);
  --bg-header-phone: var(--relative-heading-color, var(--heading-color));
  --bg-header-mobile-toggle: var(--bg-brand-accent, var(--primary));
  --bg-header-nav-item-mobile: var(--relative-heading-color, var(--heading-color));
  --bg-header-nav-item-mobile-hover-active: var(--bg-brand-accent, var(--primary));
  --bg-header-mobile-breakpoint: 85.3125rem; /*Mobile nav breakpoint*/
  --bg-header-hide-cta-breakpoint: 100rem; /*Hide desktop CTA button below 1600px*/
  position: sticky;
  inset-block-start: 0;
  z-index: 50;
  container-type: inline-size;
  inline-size: 100%;
  margin-block: 0;
  padding-block: 0;
  padding-inline: 0;
  /* A quiet divider between the white header and page surface. */

  & .bg-announcement {
    inline-size: 100%;
    width: 100%;
    max-inline-size: none;
    max-width: none;
    margin-block: 0;
    margin-inline: 0;
    padding-block: 0;
  }

  & .bg-announcement__inner {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: calc(var(--space-xs) / 2);
    inline-size: 100%;
    width: 100%;
    max-inline-size: none;
    max-width: none;
    margin-inline: 0;
    min-block-size: 2.625rem;
    padding-block: calc(var(--space-xs) / 2);
    padding-inline: var(--space-l);
  }

  & .bg-announcement__content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--space-xs) / 2);
    min-inline-size: 0;
    max-inline-size: calc(100% - var(--icon-size-s) - var(--space-xs));
    padding-inline-end: calc(var(--icon-size-s) + var(--space-xs));
  }

  & .bg-announcement p {
    flex: 0 1 auto;
    min-inline-size: 0;
    max-inline-size: max-content;
    margin: 0;
    font-size: var(--text-s);
    font-weight: 500;
    line-height: 1.35;
    text-align: center;
  }

  & .bg-announcement__arrow {
    flex: 0 0 auto;
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1;
  }

  & .bg-announcement__link {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    border: 0;
    border-radius: var(--radius);
    padding: 0.25em 0.85em;
    box-shadow: inset 0 0 0 0.09375rem currentColor;
    color: inherit;
    font-size: var(--text-s);
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
  }

  & .bg-announcement__close {
    position: absolute;
    inset-inline-end: var(--space-l);
    display: inline-grid;
    place-items: center;
    inline-size: var(--icon-size-s);
    block-size: var(--icon-size-s);
    border: 0;
    border-radius: var(--radius-circle);
    background: transparent;
    color: currentColor;
    font: inherit;
    font-size: var(--text-s);
    line-height: 1;
    opacity: 0.72;
    cursor: pointer;
  }

  & .bg-announcement__close:hover,
  & .bg-announcement__close:focus-visible {
    opacity: 1;
  }

  & .bg-announcement.is-hidden {
    display: none;
  }

  &.is-scroll-hidden {
    transform: translateY(-100%);
  }

  @media (prefers-reduced-motion: no-preference) {
    & {
      transition: transform var(--transition-duration) var(--transition-timing);
    }
  }

  .bg-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-m);
    inline-size: 100%;
    width: 100%;
    max-inline-size: none;
    max-width: none;
    margin-inline: 0;
    min-block-size: 4.75rem;
    padding-inline: var(--space-l);
  }

  .bg-header__logo {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
  }

  .bg-header__logo-image {
    display: block;
    inline-size: auto;
    max-inline-size: 11.25rem;
    max-block-size: 3rem;
    object-fit: contain;
  }

  .bg-header__nav {
    justify-self: center;
  }

  .bg-header__nav-list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-header__nav-list {
    display: flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-header__nav-item {
    position: relative;
  }

  .bg-header__nav-item--mega {
    position: static;
  }

  .bg-header__nav-list > li > a,
  .bg-header__nav-summary {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    min-block-size: 2.875rem;
    padding-inline: calc(var(--space-xs) * 1.2);
    border-radius: var(--radius);
    color: var(--bg-header-nav-item);
    font-size: calc(var(--text-s) * 1.1);
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition:
      background-color var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing);
  }

  .bg-header__nav-summary {
    list-style: none;
    cursor: default;
  }

  .bg-header__nav-summary-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
  }

  .bg-header__nav-summary::-webkit-details-marker {
    display: none;
  }

  .bg-header__nav-list > li > a:hover,
  .bg-header__nav-list > li > a:focus-visible,
  .bg-header__nav-summary:hover,
  .bg-header__nav-summary:focus-visible,
  .bg-header__nav-details[open] > .bg-header__nav-summary {
    background: var(--bg-header-hover-bg);
    color: var(--bg-header-nav-item-hover-active);
  }

  .bg-header__nav-list > li > a[aria-current='page'],
  .bg-header__nav-summary[aria-current='page'] {
    color: var(--bg-header-nav-item-hover-active);
    font-weight: 500;
  }

  .bg-header__nav-summary > span:first-child {
    position: relative;
  }

  .bg-header__nav-list > li > a[aria-current='page']::after,
  .bg-header__nav-summary[aria-current='page'] > span:first-child::after {
    content: '';
    position: absolute;
    inset-inline: 0;
    inset-block-end: calc(var(--space-xs) * -0.45);
    block-size: 0.125rem;
    background: var(--bg-header-nav-item-hover-active);
  }

  .bg-header__nav-list > li > a[aria-current='page']::after {
    inset-inline: calc(var(--space-xs) * 1.2);
  }

  .bg-header__chevron {
    inline-size: var(--icon-size-xs);
    block-size: var(--icon-size-xs);
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
    transition: transform var(--transition-duration) var(--transition-timing);
  }

  .bg-header__nav-details[open] .bg-header__chevron {
    transform: rotate(180deg);
  }

  .bg-header__current-badge {
    display: none;
  }

  .bg-header__subnav {
    position: absolute;
    inset-block-start: calc(100% + ((4.75rem - 2.875rem) / 2));
    inset-inline-start: 0;
    z-index: 2;
    display: grid;
    gap: calc(var(--space-xs) / 2);
    inline-size: 17.5rem;
    margin: 0;
    padding: var(--space-xs);
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    background: var(--bg-header-dropdown-bg);
    box-shadow: 0 1.125rem 2.5rem color-mix(in oklch, var(--base) 12%, transparent);
    list-style: none;
  }

  .bg-header__subnav a,
  .bg-header__client-login-summary {
    display: grid;
    gap: calc(var(--space-xs) / 4);
    padding: calc(var(--space-xs) / 1.25);
    border-radius: var(--radius);
    color: var(--bg-header-dropdown-link);
    font-family: inherit;
    font-size: calc(var(--text-s) * 1.1);
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
  }

  .bg-header__subnav a[target='_blank'] {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: calc(var(--space-xs) / 2);
  }

  .bg-header__subnav a[target='_blank'] > span {
    grid-column: 1 / -1;
  }

  .bg-header__subnav a:hover,
  .bg-header__subnav a:focus-visible,
  .bg-header__client-login-summary:hover,
  .bg-header__client-login-summary:focus-visible,
  .bg-header__client-login.is-open > .bg-header__client-login-summary {
    background: var(--bg-primary-soft);
    color: var(--relative-link-color, var(--link-color));
  }

  .bg-header__subnav a > span,
  .bg-header__client-login-summary-text span {
    color: var(--bg-header-dropdown-description);
    font-size: var(--text-s);
    font-weight: 400;
  }

  .bg-header__subnav-item--login {
    position: relative;
  }

  .bg-header__client-login-summary {
    grid-template-columns: minmax(0, 1fr) var(--icon-size-xs);
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    inline-size: 100%;
    border: 0;
    background: transparent;
    text-align: start;
    cursor: pointer;
  }

  .bg-header__client-login-summary-text {
    display: grid;
    gap: calc(var(--space-xs) / 4);
    min-inline-size: 0;
  }

  .bg-header__client-login-summary-text strong {
    color: currentColor;
    font-size: inherit;
    font-weight: inherit;
  }

  .bg-header__client-login-chevron {
    justify-self: end;
    inline-size: var(--icon-size-xs);
    block-size: var(--icon-size-xs);
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
    transition: transform var(--transition-duration) var(--transition-timing);
  }

  .bg-header__client-login.is-open .bg-header__client-login-chevron {
    transform: rotate(90deg);
  }

  .bg-header__client-logins {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: calc(100% + var(--space-xs));
    z-index: 4;
    display: none;
    inline-size: min(36.25rem, calc(100vw - 22.5rem));
    padding: 1.125rem;
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    background: var(--bg-header-mega-muted-bg);
    color: var(--bg-header-dropdown-link);
    box-shadow: 0 1.5rem 3.75rem color-mix(in oklch, var(--base) 16%, transparent);
  }

  .bg-header__client-login.is-open > .bg-header__client-logins {
    display: block;
  }

  .bg-header__client-logins-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 var(--space-s);
    padding-block-end: var(--space-xs);
    border-block-end: 1px solid var(--bg-header-border);
    color: var(--bg-header-nav-item-hover-active);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-header__client-logins-title::before {
    content: '';
    inline-size: 1.125rem;
    block-size: 0.125rem;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-header__client-logins-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-s) var(--space-m);
  }

  .bg-header__client-logins a.bg-header__client-login-link {
    display: grid;
    grid-template-columns: 1.875rem minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    min-block-size: 2.625rem;
    padding: 0;
    color: var(--bg-header-dropdown-link);
    font-size: var(--text-s);
    font-weight: 700;
    line-height: 1.15;
  }

  .bg-header__client-logins a.bg-header__client-login-link:hover,
  .bg-header__client-logins a.bg-header__client-login-link:focus-visible {
    background: transparent;
    color: var(--bg-header-nav-item-hover-active);
  }

  .bg-header__client-logins a.bg-header__client-login-link > span {
    grid-column: auto;
  }

  .bg-header__client-logins a.bg-header__client-login-link > span:last-child {
    color: currentColor;
    min-inline-size: 0;
  }

  .bg-header__client-login-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 1.875rem;
    block-size: 1.875rem;
  }

  .bg-header__client-login-icon img {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    max-inline-size: 1.875rem;
    max-block-size: 1.875rem;
    object-fit: contain;
  }

  .bg-header__mega {
    position: absolute;
    inset-block-start: 100%;
    inset-inline-start: 50%;
    z-index: 3;
    overflow: hidden;
    inline-size: min(calc(100vw - (var(--space-l) * 2)), 76.25rem);
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    box-shadow: 0 1.5rem 3.75rem color-mix(in oklch, var(--base) 16%, transparent);
    transform: translateX(-50%);
  }

  .bg-header__mega-grid {
    display: grid;
    gap: 0; /* Columns own their padding; do not inherit the framework grid gap. */
    grid-template-columns: 1.05fr 1.05fr 1.3fr;
  }

  .bg-header__mega-column {
    display: block;
    align-content: start;
    justify-content: start;
    padding: 2.125rem 1.875rem 1.75rem;
  }

  .bg-header__mega-column + .bg-header__mega-column {
    border-inline-start: 1px solid var(--bg-header-border);
  }

  .bg-header__mega-column--niche_cpt, .bg-header__mega-column--specialist_service_cpt {
    background: var(--bg-header-mega-muted-bg);
  }

  .bg-header__mega-eyebrow {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.5rem;
    color: var(--bg-header-nav-item-hover-active);
    font-size: var(--text-s);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-header__mega-eyebrow::before {
    content: '';
    inline-size: 1.125rem;
    block-size: 0.125rem;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-header__mega-title {
    margin: 0 0 1.125rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-xl);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.05;
  }

  .bg-header__mega-title em {
    color: var(--bg-header-nav-item-hover-active);
    font-style: italic;
  }

  .bg-header__mega-list {
    display: grid;
    align-content: start;
    gap: 0.625rem;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-header__mega-card {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    margin-inline: -0.625rem;
    padding: 0.625rem;
    border-radius: var(--radius);
    color: var(--bg-header-dropdown-link);
    text-decoration: none;
    transition:
      background-color var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing);
  }

  .bg-header__mega-card:hover,
  .bg-header__mega-card:focus-visible {
    background: var(--bg-header-hover-bg);
    color: var(--bg-header-nav-item-hover-active);
  }

  .bg-header__mega-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    inline-size: 2.5rem;
    block-size: 2.5rem;
    border-radius: var(--radius);
  }

  .bg-header__mega-icon-glyph {
    display: block;
    inline-size: 1.375rem;
    block-size: 1.375rem;
    background-color: currentColor;
    mask: var(--bg-header-mega-icon-url) center / contain no-repeat;
    -webkit-mask: var(--bg-header-mega-icon-url) center / contain no-repeat;
  }

  .bg-header__mega-icon--primary {
    background: var(--bg-primary-soft);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__mega-icon--tertiary {
    background: var(--tertiary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__mega-icon--secondary {
    background: var(--secondary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__mega-icon--accent {
    background: var(--accent-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__mega-icon--base {
    background: var(--base-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-icon-glyph--affiliate-management {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%225%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%2212%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%2219%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8.2%2010.7l7.6-4.4M8.2%2013.3l7.6%204.4%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--ai-assistants {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%224%22%20y%3D%226%22%20width%3D%2216%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M12%203v3M9%2011v2M15%2011v2M9%2016h6%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M2%2012h2M20%2012h2%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--automation {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M13%202L4%2014h6l-1%208%209-12h-6l1-8z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--bookings {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%2010h18M8%203v4M16%203v4%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--communities-courses {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%2020c0-3%202.7-5%206-5s6%202%206%205%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2217%22%20cy%3D%229%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14.5%2018c0-1.8%201.4-3.3%204.5-3.3%201.4%200%202.5.4%203%201%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--crm {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7.5%2016.5c.5-2%202.3-3%204.5-3s4%201%204.5%203%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--document-signing {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14%202v6h6M16%2012l-5%205-3-1%201-3%205-5z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--email-text-marketing {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%207l9%206%209-6%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--estimates-invoices-payments {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14%202v6h6M8%2013h8M8%2017h5%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--lead-capture {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221.5%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--multi-channel-inbox {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M21%2011.5a8.4%208.4%200%200%201-.9%203.8%208.5%208.5%200%200%201-7.6%204.7%208.4%208.4%200%200%201-3.8-.9L3%2021l1.9-5.7a8.4%208.4%200%200%201-.9-3.8%208.5%208.5%200%200%201%204.7-7.6%208.4%208.4%200%200%201%203.8-.9h.5a8.5%208.5%200%200%201%208%208v.5z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--pipelines {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%2210%22%20width%3D%224%22%20height%3D%2210%22%20rx%3D%221%22%2F%3E%0A%20%20%3Crect%20x%3D%2210%22%20y%3D%225%22%20width%3D%224%22%20height%3D%2215%22%20rx%3D%221%22%2F%3E%0A%20%20%3Crect%20x%3D%2217%22%20y%3D%2213%22%20width%3D%224%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--reviews-reputation {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M12%202l3%206.5%207%201-5%204.8%201.2%207L12%2018l-6.2%203.3%201.2-7-5-4.8%207-1z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--sales-funnels {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M3%204h18l-7%209v7l-4-2v-5z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--social-media-planner {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2213%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%0A%20%20%3Crect%20x%3D%228%22%20y%3D%228%22%20width%3D%2213%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--vibe-coding {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M8%206l-6%206%206%206M16%206l6%206-6%206M14%204l-4%2016%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--virtual-phone-system {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M22%2016.9v3a2%202%200%200%201-2.2%202%2019.8%2019.8%200%200%201-8.6-3.1%2019.5%2019.5%200%200%201-6-6%2019.8%2019.8%200%200%201-3.1-8.7A2%202%200%200%201%204%202h3a2%202%200%200%201%202%201.7%2012.8%2012.8%200%200%200%20.7%202.8%202%202%200%200%201-.5%202.1L8%209.9a16%2016%200%200%200%206%206l1.3-1.3a2%202%200%200%201%202.1-.4%2012.8%2012.8%200%200%200%202.8.7%202%202%200%200%201%201.8%202z%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__ai-icon-glyph--website-tools {
    --bg-header-ai-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%209h18%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226.5%22%20r%3D%220.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%228.5%22%20cy%3D%226.5%22%20r%3D%220.5%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--annual-accounts-tax-returns {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2213%22%20x2%3D%2214%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2217%22%20x2%3D%2214%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M16%2011l1%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--audit {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m21%2021-4.3-4.3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2011h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%208v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--bookkeeping-vat-management-accounts {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4%2019.5A2.5%202.5%200%200%201%206.5%2017H20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M6.5%202H20v20H6.5A2.5%202.5%200%200%201%204%2019.5v-15A2.5%202.5%200%200%201%206.5%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%207h7%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2011h7%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--business-growth-funding {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpolyline%20points%3D%2222%207%2013.5%2015.5%208.5%2010.5%202%2017%22%3E%3C%2Fpolyline%3E%0A%3Cpolyline%20points%3D%2216%207%2022%207%2022%2013%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--business-valuations {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20.59%2013.41%2013.42%2020.58a2%202%200%200%201-2.83%200L2%2012V2h10l8.59%208.59a2%202%200%200%201%200%202.82z%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%227.5%22%20r%3D%221.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10%2017l2.5-2.5L15%2017%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12.5%2014.5V18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--cis-subcontractors {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m15%2012-8.5%208.5c-.83.83-2.17.83-3%200a2.12%202.12%200%200%201%200-3L12%209%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17.64%2015%2022%2010.64%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m20.91%2011.7-1.25-1.25c-.6-.6-.93-1.4-.93-2.25v-.86L16.01%204.6a5.56%205.56%200%200%200-3.94-1.64H9l.92.82A6.18%206.18%200%200%201%2012%208.4v1.56l2%202h2.47l2.26%202.26%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--cloud-accounting {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.5%2019H9a7%207%200%201%201%206.71-9h1.79a4.5%204.5%200%201%201%200%209Z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10.5%2013.5h2.5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%2016v-3.5a1.25%201.25%200%200%201%202.5%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--company-secretarial {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2214%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2217%22%20r%3D%223.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m12.5%2017%201%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--expats-digital-nomads {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.8%2019.2%2016%2011l3.5-3.5C21%206%2021.5%204%2021%203c-1-.5-3%200-4.5%201.5L13%208%204.8%206.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1%201%20.3%201.3L9%2012l-2%203H4l-1%201%203%202%202%203%201-1v-3l3-2%203.5%205.3c.3.4.8.5%201.3.3l.5-.2c.4-.3.6-.7.5-1.2z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--freelancers-contractors {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%224%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2018v3%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--inheritance-tax-estate-planning {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2010l9-7%209%207v11a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2019l-3.5-3.5a2%202%200%200%201%202.83-2.83L12%2013.34l.67-.67a2%202%200%200%201%202.83%202.83z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--landlords {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%229%2022%209%2012%2015%2012%2015%2022%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--limited-companies {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012l2%202%204-4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--llps {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%204v17%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2019h6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%223%22%20r%3D%221%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M3%207h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M0%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--partnerships {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17%2021v-2a4%204%200%200%200-4-4H5a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M23%2021v-2a4%204%200%200%200-3-3.87%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M16%203.13a4%204%200%200%201%200%207.75%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--payroll {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cline%20x1%3D%223%22%20y1%3D%2210%22%20x2%3D%2221%22%20y2%3D%2210%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%222%22%20x2%3D%228%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M12%2014v4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--self-assessment {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2213%22%20x2%3D%2215%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2217%22%20x2%3D%2215%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--sole-traders {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--specialist-tax-claims {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M6%209H4.5a2.5%202.5%200%200%201%200-5H6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%209h1.5a2.5%202.5%200%200%200%200-5H18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2022h16%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2014.66V17c0%20.55-.47.98-.97%201.21C7.85%2018.75%207%2020.24%207%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M14%2014.66V17c0%20.55.47.98.97%201.21C16.15%2018.75%2017%2020.24%2017%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%202H6v7a6%206%200%200%200%2012%200V2Z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--startups {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4.5%2016.5c-1.5%201.26-2%205-2%205s3.74-.5%205-2c.71-.84.7-2.13-.09-2.91a2.18%202.18%200%200%200-2.91-.09z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m12%2015-3-3a22%2022%200%200%201%202-3.95A12.88%2012.88%200%200%201%2022%202c0%202.72-.78%207.5-6%2011a22.35%2022.35%200%200%201-4%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012H4s.55-3.03%202-4c1.62-1.08%205%200%205%200%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2015v5s3.03-.55%204-2c1.08-1.62%200-5%200-5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--tax-advice {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M9%2018h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2022h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15.09%2014c.18-.98.65-1.74%201.41-2.5A4.65%204.65%200%200%200%2018%208%206%206%200%200%200%206%208c0%201%20.23%202.23%201.5%203.5A4.61%204.61%200%200%201%208.91%2014%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--tax-investigations-problems-disputes {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212.01%22%20y2%3D%2216%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-icon-glyph--virtual-finance-office-fractional-cfo {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2212%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2020h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2016l-1%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%2016l1%204%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%229%22%20r%3D%221.8%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M8.5%2014a3.5%203.5%200%200%201%207%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--asset-protection {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Crect%20x%3D%229%22%20y%3D%2211%22%20width%3D%226%22%20height%3D%225%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M10%2011V9.5a2%202%200%200%201%204%200V11%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--business-rates-rent {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10l7-5%207%205v11%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021v-6h6v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--business-sales {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m11%2017%202%202a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m14%2014%202.5%202.5a1%201%200%201%200%203-3l-3.88-3.88a3%203%200%200%200-4.24%200l-.88.88a1%201%200%201%201-3-3l2.81-2.81a5.79%205.79%200%200%201%207.06-.87l.47.28a2%202%200%200%200%201.42.25L21%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m21%203%201%2011h-2%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%203%202%2014l6.5%206.5a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%204h8%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--commercial-finance {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22%3E%3C%2Fellipse%3E%0A%3Cpath%20d%3D%22M4%205v6c0%201.66%203.58%203%208%203s8-1.34%208-3V5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2011v6c0%201.66%203.58%203%208%203s8-1.34%208-3v-6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--franchising-your-business {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%229.5%22%20y%3D%226%22%20width%3D%225%22%20height%3D%2215%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%2217%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2011h5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17%2011h5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--global-zero-tax-strategy {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M2%2012h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%202a15.3%2015.3%200%200%201%204%2010%2015.3%2015.3%200%200%201-4%2010%2015.3%2015.3%200%200%201-4-10%2015.3%2015.3%200%200%201%204-10z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--insolvency {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpolyline%20points%3D%2222%2017%2013.5%208.5%208.5%2013.5%202%207%22%3E%3C%2Fpolyline%3E%0A%3Cpolyline%20points%3D%2216%2017%2022%2017%2022%2011%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--law {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%203%202%208h20z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M19%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2010h18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--mortgages {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%2215.5%22%20r%3D%224.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10.5%2012.5%2021%202%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m15.5%207.5%203%203%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m18%205%203%203%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-specialist-icon-glyph--personal-financial-planning {
    --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%203v18h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M7%2014l4-4%203%203%205-6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2210%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2213%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E%0A");
  }

  .bg-header__mega-card-body {
    display: grid;
    gap: 0.1875rem;
    min-inline-size: 0;
  }

  .bg-header__mega-card strong {
    color: currentColor;
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.25;
  }

  .bg-header__mega-card-body span {
    color: var(--bg-header-dropdown-description);
    font-size: var(--text-s);
    font-weight: 400;
    line-height: 1.35;
  }

  .bg-header__mega-niches {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.125rem 0.5rem;
  }

  .bg-header__mega-niches a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.625rem;
    border-radius: var(--radius);
    color: var(--bg-header-dropdown-link);
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
    transition:
      background-color var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing);
  }

  .bg-header__mega-niches a::before {
    content: '';
    flex: 0 0 auto;
    inline-size: 0.25rem;
    block-size: 0.25rem;
    border-radius: var(--radius-circle);
    background: var(--bg-header-dropdown-description);
  }

  .bg-header__mega-niches a:hover,
  .bg-header__mega-niches a:focus-visible {
    background: var(--bg-header-dropdown-bg);
    color: var(--bg-header-nav-item-hover-active);
  }

  .bg-header__mega-niches a:hover::before,
  .bg-header__mega-niches a:focus-visible::before {
    background: currentColor;
  }

  .bg-header__mega-grid--services_mega {
    grid-template-columns: 1fr 1fr 1.05fr;
  }

  .bg-header__mega-specialist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-xs);
  }

  .bg-header__mega-specialist-tile {
    position: relative;
    display: grid;
    grid-template-columns: 1.875rem minmax(0, 1fr);
    align-items: center;
    gap: calc(var(--space-xs) / 1.25);
    overflow: hidden;
    padding: calc(var(--space-xs) / 1.25);
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    background: var(--bg-header-dropdown-bg);
    color: var(--bg-header-dropdown-link);
    font-size: var(--text-s);
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    transition:
      border-color var(--transition-duration) var(--transition-timing),
      box-shadow var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing),
      transform var(--transition-duration) var(--transition-timing);
  }

  .bg-header__mega-specialist-tile::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 60%, var(--bg-header-hover-bg) 100%);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition-duration) var(--transition-timing);
  }

  .bg-header__mega-specialist-tile:hover,
  .bg-header__mega-specialist-tile:focus-visible {
    border-color: var(--bg-header-nav-item-hover-active);
    color: var(--bg-header-nav-item-hover-active);
    box-shadow: 0 0.5rem 1.25rem color-mix(in oklch, var(--base) 10%, transparent);
    transform: translateY(-0.125rem);
  }

  .bg-header__mega-specialist-tile:hover::after,
  .bg-header__mega-specialist-tile:focus-visible::after {
    opacity: 0.5;
  }

  .bg-header__mega-specialist-icon {
    position: relative;
    z-index: 1;
    display: inline-grid;
    place-items: center;
    inline-size: 1.875rem;
    block-size: 1.875rem;
    border-radius: var(--radius);
  }

  .bg-header__mega-specialist-icon-glyph {
    display: block;
    inline-size: 1rem;
    block-size: 1rem;
    background-color: currentColor;
    mask: var(--bg-header-mega-icon-url) center / contain no-repeat;
    -webkit-mask: var(--bg-header-mega-icon-url) center / contain no-repeat;
  }

  .bg-header__mega-specialist-tile > span:last-child {
    position: relative;
    z-index: 1;
  }

  .bg-header__mega--ai {
    inline-size: min(calc(100vw - (var(--space-l) * 2)), 73.75rem);
  }

  .bg-header__ai-panel {
    display: grid;
    grid-template-columns: 20.3125rem minmax(0, 1fr);
  }

  .bg-header__ai-intro {
    display: flex;
    position: relative;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-m);
    min-block-size: 27.5rem;
    padding: var(--space-l) var(--space-m);
    border-inline-end: 1px solid var(--bg-header-border);
  }

  .bg-header__ai-intro > div {
    min-inline-size: 0;
  }

  .bg-header__ai-intro > div:last-child {
    display: grid;
    gap: var(--space-s);
  }

  .bg-header__ai-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    width: fit-content;
    margin: 0 0 var(--space-s);
    padding: calc(var(--space-xs) / 2) var(--space-xs) calc(var(--space-xs) / 2) calc(var(--space-xs) / 1.4);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
  }

  .bg-header__ai-badge-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 1.375rem;
    block-size: 1.375rem;
    border-radius: var(--radius-circle);
  }

  .bg-header__ai-badge-icon svg {
    display: block;
    inline-size: 1rem;
    block-size: 1rem;
  }

  .bg-header__ai-badge-icon path {
    fill: currentColor;
  }

  .bg-header__ai-badge-icon path[data-accent='1'] {
    opacity: 0.72;
  }

  .bg-header__ai-title {
    margin: 0 0 var(--space-s);
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-xxl);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.02;
  }

  .bg-header__ai-title em {
    color: var(--relative-heading-color, var(--heading-color));
    font-style: italic;
  }

  .bg-header__ai-copy {
    margin: 0 0 var(--space-m);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-header__ai-copy strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 700;
  }

  .bg-header__ai-proof {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, .8fr) minmax(0, 1.4fr);
    gap: var(--space-xs);
    padding-block-start: var(--space-s);
    border-block-start: 1px solid var(--bg-header-border);
  }

  .bg-header__ai-proof strong {
    display: block;
    color: var(--relative-heading-color, var(--heading-color));
    font-family: var(--heading-font-family);
    font-size: var(--text-xl);
    font-weight: 500;
    line-height: 1;
  }

  .bg-header__ai-proof em {
    font-style: italic;
    font-weight: 400;
  }

  .bg-header__ai-proof span {
    display: block;
    margin-block-start: calc(var(--space-xs) / 2);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  .bg-header__ai-intro .btn-icon-slide {
    justify-self: start;
  }

  .bg-header__ai-features {
    display: grid;
    align-content: start;
    gap: var(--space-s);
    padding: var(--space-s) var(--space-m) var(--space-m);
  }

  .bg-header__ai-features .bg-header__mega-eyebrow {
    margin-block-end: 0;
  }

  .bg-header__ai-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-xs);
  }

  .bg-header__ai-card {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    align-items: start;
    gap: var(--space-xs);
    min-block-size: 4.25rem;
    padding: var(--space-xs);
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    background: var(--bg-header-dropdown-bg);
    color: var(--bg-header-dropdown-link);
    text-decoration: none;
    transition:
      border-color var(--transition-duration) var(--transition-timing),
      box-shadow var(--transition-duration) var(--transition-timing),
      color var(--transition-duration) var(--transition-timing),
      transform var(--transition-duration) var(--transition-timing);
  }

  .bg-header__ai-card:hover,
  .bg-header__ai-card:focus-visible {
    border-color: var(--bg-header-mega-cta-bg);
    color: var(--bg-header-nav-item-hover-active);
    box-shadow: 0 0.5rem 1.25rem color-mix(in oklch, var(--base) 10%, transparent);
    transform: translateY(-0.125rem);
  }

  .bg-header__ai-card > span:last-child {
    display: grid;
    gap: calc(var(--space-xs) / 4);
    min-inline-size: 0;
  }

  .bg-header__ai-card strong {
    color: currentColor;
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.25;
  }

  .bg-header__ai-card > span:last-child span {
    color: var(--bg-header-dropdown-description);
    font-size: var(--text-xs);
    font-weight: 400;
    line-height: 1.35;
  }

  .bg-header__ai-icon {
    display: inline-grid;
    place-items: center;
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: var(--radius);
  }

  .bg-header__ai-icon-glyph {
    display: block;
    inline-size: 1.125rem;
    block-size: 1.125rem;
    background-color: currentColor;
    mask: var(--bg-header-ai-icon-url) center / contain no-repeat;
    -webkit-mask: var(--bg-header-ai-icon-url) center / contain no-repeat;
  }

  .bg-header__ai-icon--primary {
    background: var(--bg-primary-soft);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-icon--secondary {
    background: var(--secondary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-icon--tertiary {
    background: var(--tertiary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-icon--accent {
    background: var(--accent-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-icon--base {
    background: var(--base-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-grid > :nth-child(5n + 1) .bg-header__ai-icon {
    background: var(--bg-primary-soft);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-grid > :nth-child(5n + 2) .bg-header__ai-icon {
    background: var(--tertiary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-grid > :nth-child(5n + 3) .bg-header__ai-icon {
    background: var(--secondary-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-grid > :nth-child(5n + 4) .bg-header__ai-icon {
    background: var(--accent-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-grid > :nth-child(5n + 5) .bg-header__ai-icon {
    background: var(--base-ultra-light);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }

  .bg-header__ai-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-m);
    padding: var(--space-s) var(--space-m);
  }

  .bg-header__ai-footer p {
    min-inline-size: 0;
    max-inline-size: 35rem;
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-family: var(--heading-font-family);
    font-size: var(--text-m);
    font-weight: 500;
    line-height: 1.35;
  }

  .bg-header__ai-footer em {
    color: var(--relative-heading-color, var(--heading-color));
    font-style: italic;
  }

  .bg-header__ai-footer > div {
    display: flex;
    align-items: center;
    gap: var(--space-s);
    flex: 0 0 auto;
  }

  .bg-header__ai-footer > div > span {
    color: color-mix(in oklch, currentColor 82%, transparent);
    font-size: var(--text-s);
    font-weight: 600;
    line-height: 1.35;
    text-align: end;
  }

  .bg-header__ai-footer > div > span strong {
    display: block;
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 700;
  }

  .bg-header__mega-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.875rem;
  }

  .bg-header__mega-cta-eyebrow {
    margin: 0 0 0.25rem;
    color: color-mix(in oklch, currentColor 82%, transparent);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-header__mega-cta-title {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-family: var(--heading-font-family);
    font-size: var(--text-l);
    font-weight: 500;
    line-height: 1.15;
  }

  .bg-header__mega-cta-title em {
    color: var(--bg-brand-accent, var(--primary));
    font-style: italic;
  }

  .bg-header__actions {
    display: flex;
    align-items: center;
    gap: var(--space-s);
    justify-self: end;
  }

  .bg-header__phone,
  .bg-header__mobile-phone {
    color: var(--bg-header-phone);
    font-size: var(--text-m);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
  }

  .bg-header__phone a,
  .bg-header__mobile-phone a {
    color: inherit;
    text-decoration: none;
  }

  .bg-header__phone-menu { position: relative; }
  .bg-header__phone-summary {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    min-block-size: 2.75rem;
    list-style: none;
    cursor: pointer;
  }
  .bg-header__phone-summary::-webkit-details-marker { display: none; }
  .bg-header__phone-summary::after {
    content: '';
    inline-size: .4rem;
    block-size: .4rem;
    border-inline-end: 1.5px solid currentColor;
    border-block-end: 1.5px solid currentColor;
    transform: rotate(45deg);
  }
  .bg-header__phone-menu[open] > .bg-header__phone-summary::after { transform: rotate(225deg); }
  .bg-header__phone-list {
    position: absolute;
    inset-block-start: 100%;
    inset-inline-end: 0;
    z-index: 5;
    display: grid;
    min-inline-size: 17rem;
    max-inline-size: min(24rem, calc(100vw - 2rem));
    margin: 0;
    padding: var(--space-xs);
    list-style: none;
    background: var(--bg-header-dropdown-bg);
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    box-shadow: 0 .5rem 1.5rem rgb(0 0 0 / .12);
  }
  .bg-header__phone-link {
    display: grid;
    gap: .125rem;
    padding: var(--space-xs);
    border-radius: var(--radius);
    line-height: 1.3;
  }
  .bg-header__phone-label { font-size: var(--text-s); font-weight: 400; white-space: normal; }
  .bg-header__phone-link:hover, .bg-header__phone-link:focus-visible { background: var(--bg-header-hover-bg); }
  .bg-header__phone-summary:focus-visible, .bg-header__phone-link:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: 2px; }
  .bg-header__mobile-phone .bg-header__phone-list { position: static; min-inline-size: 0; inline-size: 100%; box-shadow: none; }
  .bg-header__mobile-phone .bg-header__phone-summary { justify-content: center; }

  .bg-header__phone .header-phones,
  .bg-header__mobile-phone .header-phones {
    display: grid;
    gap: calc(var(--space-xs) / 4);
  }

  .bg-header__phone .header-phones__item,
  .bg-header__mobile-phone .header-phones__item {
    display: grid;
    grid-template-columns: minmax(6.25rem, 1fr) auto;
    align-items: baseline;
    column-gap: var(--space-xs);
    gap: 0.125rem;
    line-height: 1.1;
  }

  .bg-header__phone .header-phones__title,
  .bg-header__mobile-phone .header-phones__title {
    color: var(--bg-header-dropdown-description);
    font-size: var(--text-s);
    font-weight: 600;
  }

  .bg-header__cta,
  .bg-header__mobile-cta {
    text-align: center;
    white-space: nowrap;
  }

  @media (max-width: 100rem) {
    .bg-header__cta {
      display: none;
    }
  }

  .bg-header__toggle {
    display: none;
    align-content: center;
    place-items: center;
    gap: 0.3125rem;
    inline-size: var(--icon-size-l);
    block-size: var(--icon-size-l);
    border: 0;
    background: transparent;
    color: var(--bg-header-mobile-toggle);
    cursor: pointer;
  }

  .bg-header__toggle-line {
    display: block;
    inline-size: 1.75rem;
    block-size: 0.1875rem;
    border-radius: var(--radius-circle);
    background: currentColor;
    transition:
      transform var(--transition-duration) var(--transition-timing),
      opacity var(--transition-duration) var(--transition-timing);
  }

  &.is-open .bg-header__toggle-line:nth-child(2) {
    transform: translateY(0.5rem) rotate(45deg);
  }

  &.is-open .bg-header__toggle-line:nth-child(3) {
    opacity: 0;
  }

  &.is-open .bg-header__toggle-line:nth-child(4) {
    transform: translateY(-0.5rem) rotate(-45deg);
  }

  .bg-header__mobile {
    max-block-size: 0;
    overflow: hidden;
    border-block-start: 1px solid var(--bg-header-border);
    background: var(--bg-header-bg);
    opacity: 0;
    transform: translateY(-0.75rem);
    transition:
      max-block-size var(--transition-duration) var(--transition-timing),
      opacity var(--transition-duration) var(--transition-timing),
      transform var(--transition-duration) var(--transition-timing);
  }

  .bg-header__mobile[hidden] {
    display: none;
  }

  &.is-open .bg-header__mobile {
    max-block-size: calc(100vh - 7.375rem);
    overflow-y: auto;
    opacity: 1;
    overscroll-behavior: contain;
    transform: translateY(0);
    -webkit-overflow-scrolling: touch;
  }

  @supports (block-size: 100dvh) {
    &.is-open .bg-header__mobile {
      max-block-size: calc(100dvh - 7.375rem);
    }
  }

  .bg-header__mobile-actions {
    inline-size: min(100% - (var(--gutter) * 2), var(--content-width));
    margin-inline: auto;
  }

  .bg-header__mobile-actions {
    display: grid;
    gap: var(--space-xs);
    padding-block: var(--space-m);
  }

  .bg-header__mobile-cta {
    justify-content: center;
  }

  .bg-header__mobile-announcement {
    display: none;
  }

  @media (max-width: 85.3125rem) {
    & .bg-announcement {
      display: none;
    }

    > .bg-header__mobile-announcement,
    .bg-header__mobile-announcement {
      display: flex;
      align-items: center;
      justify-content: center;
      inline-size: 100%;
      width: 100%;
      max-inline-size: none;
      max-width: none;
      margin-inline: 0;
      min-block-size: 2.625rem;
      padding-inline: var(--gutter);
      font-size: var(--text-s);
      font-weight: 700;
      text-align: center;
      text-decoration: none;
    }

    .bg-header__actions {
      display: none;
    }

    .bg-header__nav {
      display: none;
      grid-column: 1 / -1;
      grid-row: 2;
      justify-self: stretch;
      padding-block: var(--space-xs);
    }

    .bg-header__inner {
      grid-template-columns: auto 1fr auto;
    }

    .bg-header__logo {
      grid-column: 1;
      grid-row: 1;
    }

    .bg-header__toggle {
      display: inline-grid;
      grid-column: 3;
      grid-row: 1;
      justify-self: end;
    }
  }

  &.is-mobile {
    .bg-header__actions {
      display: none;
    }

    .bg-header__nav {
      display: none;
      grid-column: 1 / -1;
      grid-row: 2;
      justify-self: stretch;
      padding-block: var(--space-xs);
    }

    .bg-header.is-open .bg-header__nav,
    .bg-header[data-bg-header].is-open .bg-header__nav {
      display: block;
    }

    .bg-header__nav-list {
      display: grid;
      gap: 0;
    }

    .bg-header__nav-list a {
      display: block;
      padding-block: calc(var(--space-xs) / 1.25);
    }

    .bg-header__inner {
      grid-template-columns: auto 1fr auto;
    }

    .bg-header__logo {
      grid-column: 1;
      grid-row: 1;
    }

    .bg-header__toggle {
      display: inline-grid;
      grid-column: 3;
      grid-row: 1;
      justify-self: end;
    }
  }

  &.is-mobile {
    & .bg-announcement {
      display: none;
    }

    > .bg-header__mobile-announcement,
    .bg-header__mobile-announcement {
      display: flex;
      align-items: center;
      justify-content: center;
      inline-size: 100%;
      width: 100%;
      max-inline-size: none;
      max-width: none;
      margin-inline: 0;
      min-block-size: 2.625rem;
      padding-inline: var(--gutter);
      font-size: var(--text-s);
      font-weight: 700;
      text-align: center;
      text-decoration: none;
    }

    .bg-header__actions {
      display: none;
    }

    .bg-header__nav {
      display: none;
      grid-column: 1 / -1;
      grid-row: 2;
      justify-self: stretch;
      padding-block: var(--space-xs);
    }

    &.is-open .bg-header__nav {
      display: block;
    }

    .bg-header__nav-list {
      display: grid;
      gap: 0;
    }

    .bg-header__nav-list a {
      display: block;
      padding-block: calc(var(--space-xs) / 1.25);
    }

    .bg-header__inner {
      grid-template-columns: auto 1fr auto;
    }

    .bg-header__logo {
      grid-column: 1;
      grid-row: 1;
    }

    .bg-header__toggle {
      display: inline-grid;
      grid-column: 3;
      grid-row: 1;
      justify-self: end;
    }
  }

  .bg-header__mobile .bg-header__nav {
    display: block;
    inline-size: min(100% - (var(--gutter) * 2), var(--content-width));
    margin-inline: auto;
    padding-block: var(--space-xs) var(--space-s);
  }

  .bg-header__mobile .bg-header__nav-list {
    display: grid;
    gap: 0;
  }

  .bg-header__mobile .bg-header__nav-item {
    border-block-end: 1px solid var(--bg-header-border);
  }

  .bg-header__mobile .bg-header__nav-list > li > a,
  .bg-header__mobile .bg-header__nav-summary {
    display: flex;
    justify-content: space-between;
    inline-size: 100%;
    min-block-size: auto;
    padding: var(--space-xs) 0;
    border-radius: 0;
    color: var(--bg-header-nav-item-mobile);
    font-size: var(--text-m);
    line-height: 1.25;
  }

  .bg-header__mobile .bg-header__nav-list > li > a:hover,
  .bg-header__mobile .bg-header__nav-list > li > a:focus-visible,
  .bg-header__mobile .bg-header__nav-summary:hover,
  .bg-header__mobile .bg-header__nav-summary:focus-visible,
  .bg-header__mobile .bg-header__nav-details[open] > .bg-header__nav-summary {
    background: transparent;
    color: var(--bg-header-nav-item-mobile-hover-active);
  }

  .bg-header__mobile .bg-header__nav-list > li > a[aria-current='page'],
  .bg-header__mobile .bg-header__nav-summary[aria-current='page'] {
    color: var(--bg-header-nav-item-mobile-hover-active);
  }

  .bg-header__mobile .bg-header__nav-list > li > a[aria-current='page']::after,
  .bg-header__mobile .bg-header__nav-summary[aria-current='page'] > span:first-child::after {
    display: none;
  }

  .bg-header__mobile .bg-header__current-badge {
    display: inline-flex;
    align-items: center;
    margin-inline-start: calc(var(--space-xs) / 2);
    padding: 0.25em 0.65em;
    border-radius: var(--radius);
    background: var(--bg-primary-soft);
    color: var(--relative-link-color, var(--link-color));
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1;
  }

  .bg-header__mobile .bg-header__chevron {
    margin-inline-start: auto;
  }

  .bg-header__mobile .bg-header__subnav {
    position: static;
    inline-size: 100%;
    padding: 0 0 var(--space-xs) var(--space-xs);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .bg-header__mobile .bg-header__subnav a {
    display: grid;
    gap: calc(var(--space-xs) / 4);
    padding-block: calc(var(--space-xs) / 1.6);
    padding-inline: 0;
    background: transparent;
    color: var(--bg-header-dropdown-link);
    font-size: var(--text-s);
  }

  .bg-header__mobile .bg-header__subnav span {
    display: block;
    margin-inline-start: 0;
  }

  .bg-header__mobile .bg-header__client-login-summary {
    padding-block: calc(var(--space-xs) / 1.6);
    padding-inline: 0;
    background: transparent;
    font-size: var(--text-s);
  }

  .bg-header__mobile .bg-header__client-login-summary:hover,
  .bg-header__mobile .bg-header__client-login-summary:focus-visible,
  .bg-header__mobile .bg-header__client-login.is-open > .bg-header__client-login-summary {
    background: transparent;
    color: var(--bg-header-nav-item-mobile-hover-active);
  }

  .bg-header__mobile .bg-header__client-login-summary-text span {
    color: var(--bg-header-dropdown-description);
  }

  .bg-header__mobile .bg-header__client-logins {
    display: none;
    position: static;
    inline-size: 100%;
    margin-block: calc(var(--space-xs) / 2) var(--space-xs);
    padding: var(--space-s);
    box-shadow: none;
  }

  .bg-header__mobile .bg-header__client-login.is-open > .bg-header__client-logins {
    display: block;
  }

  .bg-header__mobile .bg-header__client-logins-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-xs);
  }

  .bg-header__mobile .bg-header__client-logins a.bg-header__client-login-link {
    display: grid;
    min-block-size: 2.375rem;
    grid-template-columns: 1.875rem minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    padding-block: 0;
  }

  .bg-header__mobile .bg-header__client-login-icon {
    inline-size: 1.875rem;
    block-size: 1.875rem;
  }

  .bg-header__mobile .bg-header__client-login-icon img {
    inline-size: 1.375rem;
    block-size: 1.375rem;
  }

  .bg-header__mobile .bg-header__nav-item--mega {
    position: relative;
  }

  .bg-header__mobile .bg-header__mega {
    position: static;
    inline-size: 100%;
    margin-block-end: calc(var(--space-xs) / 2);
    overflow: hidden;
    border: 1px solid var(--bg-header-border);
    border-radius: var(--radius);
    box-shadow: none;
    transform: none;
  }

  .bg-header__mobile .bg-header__mega-grid:has(.bg-header__mega-column--niche_cpt:nth-child(3)) {
    border-radius: var(--radius) var(--radius) 0 0;
  }

  .bg-header__mobile .bg-header__mega-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bg-header__mobile .bg-header__mega-column,
  .bg-header__mobile .bg-header__mega-column + .bg-header__mega-column {
    padding: var(--space-s);
  }

  .bg-header__mobile .bg-header__mega-column + .bg-header__mega-column {
    border-inline-start: 1px solid var(--bg-header-border);
  }

  .bg-header__mobile .bg-header__mega-column--niche_cpt {
    background: var(--bg-header-mega-muted-bg);
  }

  .bg-header__mobile .bg-header__mega-title {
    margin-block-end: var(--space-xs);
    font-size: var(--text-l);
  }

  .bg-header__mobile .bg-header__mega-list {
    gap: 0;
  }

  .bg-header__mobile .bg-header__mega-card {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr);
    column-gap: var(--space-xs);
    align-items: start;
    margin-inline: calc(var(--space-xs) * -1);
    padding: calc(var(--space-xs) / 1.4) var(--space-xs);
  }

  &.is-mobile .bg-header__mobile .bg-header__mega-card {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr);
    column-gap: var(--space-xs);
    align-items: start;
  }

  .bg-header__mobile .bg-header__mega-card strong,
  .bg-header__mobile .bg-header__mega-card-body span {
    display: block;
  }

  .bg-header__mobile .bg-header__mega-niches {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--space-xs);
  }

  .bg-header__mobile .bg-header__mega-niches a {
    padding: calc(var(--space-xs) / 1.4) var(--space-xs);
  }

  .bg-header__mobile .bg-header__mega-specialist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bg-header__mobile .bg-header__mega-specialist-tile {
    grid-template-columns: 1.875rem minmax(0, 1fr);
  }

  &.is-mobile .bg-header__mobile .bg-header__mega-specialist-tile {
    display: grid;
    grid-template-columns: 1.875rem minmax(0, 1fr);
    column-gap: calc(var(--space-xs) / 1.25);
    align-items: center;
  }

  .bg-header__mobile .bg-header__mega-cta {
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    margin-block-start: 0;
    padding: var(--space-s);
    border-radius: 0 0 var(--radius) var(--radius);
  }

  @container (inline-size < 62rem) {
    .bg-header__mobile .bg-header__mega-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bg-header__mobile .bg-header__client-logins-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bg-header__mobile .bg-header__mega-column--niche_cpt {
      grid-column: 1 / -1;
      border-block-start: 1px solid var(--bg-header-border);
      border-inline-start: 0;
      border-radius: 0;
      overflow: hidden;
    }
  }

  @container (inline-size < 72rem) {
    .bg-header__mobile .bg-header__mega-grid--services_mega {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bg-header__mobile :is(.bg-header__mega-column--niche_cpt, .bg-header__mega-column--specialist_service_cpt) {
      grid-column: 1 / -1;
      border-block-start: 1px solid var(--bg-header-border);
      border-inline-start: 0;
      border-radius: 0;
      overflow: hidden;
    }
  }

  @container (inline-size < 42rem) {
    .bg-header__mobile .bg-header__mega-grid {
      grid-template-columns: 1fr;
    }

    .bg-header__mobile .bg-header__mega-column,
    .bg-header__mobile .bg-header__mega-column + .bg-header__mega-column {
      padding: var(--space-s);
      border-inline-start: 0;
    }

    .bg-header__mobile .bg-header__mega-column + .bg-header__mega-column {
      border-block-start: 1px solid var(--bg-header-border);
    }

    .bg-header__mobile .bg-header__mega-cta {
      align-items: flex-start;
      flex-direction: column;
    }

    .bg-header__mobile .bg-header__client-logins-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @container (inline-size < 32rem) {
    .bg-header__mobile .bg-header__client-logins-grid {
      grid-template-columns: 1fr;
    }
  }

  @media (max-width: 520px) {
    & .bg-announcement__inner {
      flex-wrap: wrap;
      justify-content: flex-start;
      padding-inline: var(--gutter) calc(var(--gutter) + var(--icon-size-s) + var(--space-xs));
    }

    & .bg-announcement__content {
      justify-content: flex-start;
    }

    & .bg-announcement p {
      text-align: start;
    }
  }

  /* BeanGrower AI mega menu: product category overview. */
  .bg-header__mega--ai {
    inline-size: min(calc(100vw - (var(--gutter) * 2)), var(--content-width));
    max-inline-size: none;
  }

  .bg-header__ai-menu {
    grid-template-columns: minmax(18.125rem, .72fr) minmax(0, 2.28fr);
  }

  .bg-header__ai-menu-intro {
    min-block-size: auto;
    border-inline-end-color: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-header__ai-menu-intro .bg-header__ai-title {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-header__ai-menu-intro .bg-header__ai-title em {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-header__ai-menu-intro .bg-header__ai-copy,
  .bg-header__ai-menu-intro .bg-header__ai-proof span {
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-header__ai-menu-intro .bg-header__ai-copy strong,
  .bg-header__ai-menu-intro .bg-header__ai-proof strong {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-header__ai-menu-main {
    display: block;
    padding: var(--space-s) var(--space-m) var(--space-m);
  }

  .bg-header__ai-menu-main > .bg-header__mega-eyebrow {
    margin-block-end: var(--space-xs);
  }

  .bg-header__ai-categories {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) minmax(0, .95fr);
    gap: 0.5rem;
  }

  .bg-header__ai-category {
    padding: var(--space-xs);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-header__ai-category-heading {
    display: flex;
    gap: var(--space-xs);
    align-items: center;
    min-block-size: 2.75rem;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    line-height: 1.15;
    text-decoration: none;
  }

  .bg-header__ai-category-heading > strong { min-inline-size: 0; flex: 1 1 auto; }
  .bg-header__ai-category-heading > span:last-child { flex: 0 0 auto; margin-inline-start: auto; font-size: var(--text-l); }
  .bg-header__ai-category-icon { display: grid; flex: 0 0 auto; place-items: center; inline-size: 2.625rem; block-size: 2.625rem; border-radius: var(--radius-circle); }
  .bg-header__ai-category-icon::after,
  .bg-header__ai-tile-icon { display: block; inline-size: 55%; block-size: 55%; background: var(--bg-decoration-surface, var(--bg-light)); content: ''; mask: var(--bg-header-ai-menu-icon) center / contain no-repeat; -webkit-mask: var(--bg-header-ai-menu-icon) center / contain no-repeat; }

  .bg-header__ai-category-grid { display: grid; gap: 0.3125rem; margin-block-start: var(--space-xs); }
  .bg-header__ai-category-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bg-header__ai-category-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bg-header__ai-category-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .bg-header__ai-category--crm .bg-header__ai-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .bg-header__ai-category-grid a {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.25rem;
    min-block-size: 4.625rem;
    padding: 0.375rem;
    border-radius: var(--radius);
    color: var(--relative-link-color, var(--link-color));
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.13;
    text-align: center;
    text-decoration: none;
    overflow: visible;
    overflow-wrap: normal;
    word-break: keep-all;
    transition: transform var(--transition-duration) var(--transition-timing), box-shadow var(--transition-duration) var(--transition-timing);
  }

  .bg-header__ai-category-grid a:hover,
  .bg-header__ai-category-grid a:focus-visible { box-shadow: 0 0.375rem 1rem color-mix(in oklch, var(--relative-link-color, var(--link-color)) 20%, transparent); transform: translateY(-0.125rem); }
  .bg-header__ai-category-grid .bg-header__ai-tile-icon { inline-size: 1.375rem; block-size: 1.375rem; background: currentColor; }

  .bg-header__ai-solutions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(11.875rem, .3fr); gap: var(--space-xs); margin: var(--space-s) var(--space-m) 0.375rem; padding-block-start: var(--space-xs); border-block-start: 1px solid var(--bg-header-border); }

  /* Fallback for an Etch paste that keeps this block beside the main panel. */
  .bg-header__ai-panel > .bg-header__ai-solutions {
    grid-column: 2;
    inline-size: auto;
  }
  .bg-header__ai-solutions .bg-header__mega-eyebrow { margin-block-end: var(--space-xs); }
  .bg-header__ai-solution-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-xs); align-items: stretch; }

  .bg-header__ai-solution { display: grid; grid-template-columns: 1.875rem minmax(0, 1fr); gap: 0.4375rem; align-items: start; padding: var(--space-xs); border-radius: var(--radius); text-decoration: none; }
  .bg-header__ai-solution > .bg-header__ai-tile-icon { display: grid; place-items: center; inline-size: 1.875rem; block-size: 1.875rem; border-radius: var(--radius-circle); background: currentColor; }
  .bg-header__ai-solution > .bg-header__ai-tile-icon::after { background: var(--bg-decoration-surface, var(--bg-light)); }
  .bg-header__ai-solution strong, .bg-header__ai-solution small, .bg-header__ai-solution em { display: block; }
  .bg-header__ai-solution strong { font-size: var(--text-xs); line-height: 1.15; }
  .bg-header__ai-solution small { margin-block-start: 0.1875rem; font-size: var(--text-xs); font-weight: 400; line-height: 1.25; }
  .bg-header__ai-solution em { margin-block-start: 0.125rem; font-size: var(--text-xs); font-style: normal; font-weight: 700; }

  .bg-header__ai-managed { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--space-xs); padding: var(--space-xs); border-radius: var(--radius); }
  .bg-header__ai-managed > .bg-header__mega-eyebrow { grid-column: 1 / -1; margin-block-end: 0; }
  .bg-header__ai-managed > .bg-header__ai-tile-icon { display: grid; place-items: center; inline-size: 2.25rem; block-size: 2.25rem; border-radius: var(--radius-circle); }
  .bg-header__ai-managed > .bg-header__ai-tile-icon::after { background: currentColor; }
  .bg-header__ai-managed h3, .bg-header__ai-managed p, .bg-header__ai-managed a { margin: 0; }
  .bg-header__ai-managed h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.1; }
  .bg-header__ai-managed p { margin-block-start: 0.1875rem; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); line-height: 1.25; }
  .bg-header__ai-managed a { display: inline-block; margin-block-start: var(--space-xs); color: var(--bg-brand-accent, var(--primary)); font-size: var(--text-xs); font-weight: 700; text-decoration: none; }

  .bg-header__ai-category-icon--crm, .bg-header__ai-tile-icon--crm { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7.5%2016.5c.5-2%202.3-3%204.5-3s4%201%204.5%203%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-category-icon--marketing, .bg-header__ai-tile-icon--website, .bg-header__ai-tile-icon--website-tools { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%209h18%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%226.5%22%20r%3D%220.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%228.5%22%20cy%3D%226.5%22%20r%3D%220.5%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-category-icon--communications, .bg-header__ai-tile-icon--multi-channel-inbox, .bg-header__ai-tile-icon--inbox { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M21%2011.5a8.4%208.4%200%200%201-.9%203.8%208.5%208.5%200%200%201-7.6%204.7%208.4%208.4%200%200%201-3.8-.9L3%2021l1.9-5.7a8.4%208.4%200%200%201-.9-3.8%208.5%208.5%200%200%201%204.7-7.6%208.4%208.4%200%200%201%203.8-.9h.5a8.5%208.5%200%200%201%208%208v.5z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-category-icon--automation, .bg-header__ai-tile-icon--automation { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M13%202L4%2014h6l-1%208%209-12h-6l1-8z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-category-icon--payments, .bg-header__ai-tile-icon--payments, .bg-header__ai-tile-icon--estimates-invoices-payments { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14%202v6h6M8%2013h8M8%2017h5%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-category-icon--retention, .bg-header__ai-tile-icon--reviews, .bg-header__ai-tile-icon--reviews-reputation { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M12%202l3%206.5%207%201-5%204.8%201.2%207L12%2018l-6.2%203.3%201.2-7-5-4.8%207-1z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--pipelines { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%2210%22%20width%3D%224%22%20height%3D%2210%22%20rx%3D%221%22%2F%3E%0A%20%20%3Crect%20x%3D%2210%22%20y%3D%225%22%20width%3D%224%22%20height%3D%2215%22%20rx%3D%221%22%2F%3E%0A%20%20%3Crect%20x%3D%2217%22%20y%3D%2213%22%20width%3D%224%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--lead-capture { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221.5%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--funnels, .bg-header__ai-tile-icon--sales-funnels { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M3%204h18l-7%209v7l-4-2v-5z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--forms, .bg-header__ai-tile-icon--forms-surveys-quizzes { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%226%22%20y%3D%223%22%20width%3D%2212%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M9%208h6M9%2012h6M9%2016h4%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--email, .bg-header__ai-tile-icon--email-text-marketing { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%207l9%206%209-6%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--social, .bg-header__ai-tile-icon--social-media-planner { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2213%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%0A%20%20%3Crect%20x%3D%228%22%20y%3D%228%22%20width%3D%2213%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--ads, .bg-header__ai-tile-icon--ad-manager { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M5%2019V11M12%2019V6M19%2019V3%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--affiliate, .bg-header__ai-tile-icon--affiliate-management { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%225%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%226%22%20cy%3D%2212%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2218%22%20cy%3D%2219%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8.2%2010.7l7.6-4.4M8.2%2013.3l7.6%204.4%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--phone, .bg-header__ai-tile-icon--virtual-phone-system { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M22%2016.9v3a2%202%200%200%201-2.2%202%2019.8%2019.8%200%200%201-8.6-3.1%2019.5%2019.5%200%200%201-6-6%2019.8%2019.8%200%200%201-3.1-8.7A2%202%200%200%201%204%202h3a2%202%200%200%201%202%201.7%2012.8%2012.8%200%200%200%20.7%202.8%202%202%200%200%201-.5%202.1L8%209.9a16%2016%200%200%200%206%206l1.3-1.3a2%202%200%200%201%202.1-.4%2012.8%2012.8%200%200%200%202.8.7%202%202%200%200%201%201.8%202z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--bookings { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%2010h18M8%203v4M16%203v4%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--missed-call, .bg-header__ai-tile-icon--missed-call-text-back { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M5%205h14v10H9l-4%204V5Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M9%209h6M9%2012h3%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m16%2018%202-2%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--receptionist, .bg-header__ai-tile-icon--ai-receptionist-voice { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M5%2014v-2a7%207%200%200%201%2014%200v2M5%2014v4h3v-5H5M19%2014v4h-3v-5h3M16%2018c0%202-2%203-4%203h-1%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--chat, .bg-header__ai-tile-icon--ai-chat-conversation { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M4%205h16v11H9l-5%204V5Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%209h8M8%2012h5%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--ai, .bg-header__ai-tile-icon--ai-assistants { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Crect%20x%3D%224%22%20y%3D%226%22%20width%3D%2216%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M12%203v3M9%2011v2M15%2011v2M9%2016h6%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M2%2012h2M20%2012h2%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--vibe, .bg-header__ai-tile-icon--vibe-coding { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M8%206l-6%206%206%206M16%206l6%206-6%206M14%204l-4%2016%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--content, .bg-header__ai-tile-icon--ai-content-productivity { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M5%204h9l4%204v11a1%201%200%200%201-1%201H5a1%201%200%200%201-1-1V5a1%201%200%200%201%201-1Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14%204v4h4M8%2011h4M8%2015h2%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m13%2018%204.6-4.6%201.8%201.8-4.6%204.6-2.5.7Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m18%203%20.5%201.5L20%205l-1.5.5L18%207l-.5-1.5L16%205l1.5-.5Z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--pos, .bg-header__ai-tile-icon--pos-tap-to-pay { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M6%208c2.4%202.1%202.4%205.9%200%208M10%205c4.2%203.7%204.2%2010.3%200%2014M14%202c6%205.4%206%2014.6%200%2020%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--store, .bg-header__ai-tile-icon--ecommerce-online-store { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M3%205h2l2%2010h10l2-7H7%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2210%22%20cy%3D%2219%22%20r%3D%221.25%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2217%22%20cy%3D%2219%22%20r%3D%221.25%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--documents, .bg-header__ai-tile-icon--document-signing { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14%202v6h6M16%2012l-5%205-3-1%201-3%205-5z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--communities, .bg-header__ai-tile-icon--communities-courses { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%2020c0-3%202.7-5%206-5s6%202%206%205%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%2217%22%20cy%3D%229%22%20r%3D%222.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M14.5%2018c0-1.8%201.4-3.3%204.5-3.3%201.4%200%202.5.4%203%201%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--portal, .bg-header__ai-tile-icon--client-portal { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M5%2020c.7-3.8%203.1-5.8%207-5.8s6.3%202%207%205.8%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--events, .bg-header__ai-tile-icon--events-ticketing { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22M4%205h16v5a2.5%202.5%200%200%200%200%205v4H4v-4a2.5%202.5%200%200%200%200-5V5Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M9%205v14M13.5%208.5l.8%201.7%201.9.3-1.4%201.3.3%201.9-1.6-.9-1.7.9.4-1.9-1.4-1.3%201.9-.3.8-1.7Z%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--reactivation { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%227.5%22%20ry%3D%223%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M4.5%205v7c0%201.7%203.4%203%207.5%203s7.5-1.3%207.5-3V5M4.5%2012v7c0%201.7%203.4%203%207.5%203s7.5-1.3%207.5-3v-7%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  .bg-header__ai-tile-icon--managed { --bg-header-ai-menu-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%20%20%3Cpath%20d%3D%22m4%208%204%203%204-6%204%206%204-3-1%2010H5L4%208Z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%2018v2h8v-2M8%2010l-1.5-4M12%205V2.5M16%2010l1.5-4%22%2F%3E%0A%3C%2Fsvg%3E%0A"); }
  /* BeanGrower AI menu refinements. */
  .bg-header__ai-menu { grid-template-rows: auto auto; align-items: stretch; }
  .bg-header__ai-menu-intro { grid-column: 1; grid-row: 1 / span 2; }
  .bg-header__ai-menu-intro .bg-header__ai-title, .bg-header__ai-menu-intro .bg-header__ai-proof strong { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-menu-intro .bg-header__ai-title em { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-menu-intro .bg-header__ai-copy, .bg-header__ai-menu-intro .bg-header__ai-proof span { color: var(--relative-text-color, var(--text-color)); }
  .bg-header__ai-menu-main { grid-column: 2; grid-row: 1; align-self: start; padding-block-end: 0; }
  .bg-header__ai-panel > .bg-header__ai-solutions { grid-column: 2; grid-row: 2; margin-block-start: var(--space-xs); }
  .bg-header__ai-menu-actions { display: grid; justify-items: start; gap: var(--space-xs); }
  .bg-header__ai-menu-actions .bg-button-wrap { inline-size: 100%; }
  .bg-header__ai-menu-actions .bg-button { inline-size: 100%; justify-content: center; }
  .bg-header__ai-menu-actions > a:last-child { justify-self: center; color: var(--relative-link-color, var(--link-color)); font-size: var(--text-s); font-weight: 700; text-decoration: none; }
  .bg-header__ai-category-heading > strong { color: var(--relative-heading-color, var(--heading-color)); }
  & .bg-header__ai-category-heading { display: grid; grid-template-columns: 42px minmax(0, 1fr) max-content; grid-template-rows: 1fr; align-items: center; }
  & .bg-header__ai-category-heading > .bg-header__ai-category-icon { grid-column: 1; grid-row: 1; }
  & .bg-header__ai-category-heading > strong { grid-column: 2; grid-row: 1; min-inline-size: 0; }
  & .bg-header__ai-category-heading > span:last-child { grid-column: 3; grid-row: 1; margin-inline-start: 0; }
  .bg-header__ai-category-grid a { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-category-icon:has(svg)::after { display: none; }
  .bg-header__ai-category-icon svg { inline-size: 1.4375rem; block-size: 1.4375rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
  .bg-header__ai-solution { display: flex; block-size: 6.25rem; min-block-size: 0; gap: 0.4375rem; align-items: start; padding-block: var(--space-xs) 0.1875rem; border: 1px solid var(--bg-header-border); color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-solution > span { min-inline-size: 0; flex: 1 1 auto; }
  & .bg-header__ai-solution { display: grid; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: 1fr; align-items: flex-start; }
  & .bg-header__ai-solution > .bg-header__ai-tile-icon { grid-column: 1; grid-row: 1; }
  & .bg-header__ai-solution > span { grid-column: 2; grid-row: 1; min-inline-size: 0; }
  .bg-header__ai-solution > .bg-header__ai-tile-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }
  .bg-header__ai-solution > .bg-header__ai-tile-icon::after { background: currentColor; }
  .bg-header__ai-solution small { color: var(--relative-text-color, var(--text-color)); }
  .bg-header__ai-solution em { color: var(--relative-link-color, var(--link-color)); }
  .bg-header__ai-managed { align-content: start; border-inline-start: 1px solid var(--bg-header-border); border-radius: 0; background: transparent; }
  .bg-header__ai-managed > .bg-header__mega-eyebrow { color: var(--relative-link-color, var(--link-color)); }
  .bg-header__ai-managed > .bg-header__ai-tile-icon { background: var(--bg-primary-soft); color: var(--icon-color); color-scheme: var(--icon-scheme); }
  .bg-header__ai-managed > div { align-self: center; }
  .bg-header__ai-managed h3 { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-managed a { color: var(--relative-link-color, var(--link-color)); }
  .bg-header__ai-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-m); min-block-size: 4.25rem; padding-block: var(--space-xs); }
  .bg-header__ai-footer p { max-inline-size: 35.625rem; }
  .bg-header__ai-footer > div { display: flex; align-items: center; gap: var(--space-m); }
  .bg-header__ai-footer > div > span { color: color-mix(in oklch, currentColor 82%, transparent); font-size: var(--text-s); font-weight: 600; text-align: end; }
  .bg-header__ai-footer > div > span strong { display: block; color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-footer > :not(.bg-header__ai-footer-content) { display: none; }
  .bg-header__ai-footer > .bg-header__ai-footer-content { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, auto); align-items: center; gap: 0; inline-size: 100%; }
  .bg-header__ai-footer-intro, .bg-header__ai-footer-benefit { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); }
  .bg-header__ai-footer-intro { padding-inline-end: var(--space-m); }
  .bg-header__ai-footer-intro p { max-inline-size: 36.25rem; margin: 0; color: inherit; font-family: var(--heading-font-family); font-size: var(--text-s); font-weight: 400; line-height: 1.25; }
  .bg-header__ai-footer-intro svg, .bg-header__ai-footer-benefit svg { flex: 0 0 auto; inline-size: 1.75rem; block-size: 1.75rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
  .bg-header__ai-footer-growth-icon { stroke-width: 2.3; }
  .bg-header__ai-footer-benefit { min-block-size: 2rem; padding-inline: var(--space-m); border-inline-start: 1px solid color-mix(in oklch, currentColor 38%, transparent); font-size: var(--text-s); font-weight: 400; white-space: nowrap; }
  .bg-header__ai-managed { display: block; padding-block: 0; padding-inline-start: var(--space-s); }
  .bg-header__ai-managed > .bg-header__mega-eyebrow { margin: 0 0 var(--space-xs); }
  .bg-header__ai-managed-card { display: flex; gap: 0.4375rem; align-items: start; block-size: auto; min-block-size: 6.25rem; padding-block: var(--space-xs) 0.1875rem; padding-inline: var(--space-xs); border-radius: var(--radius); }
  .bg-header__ai-managed-card > div { min-inline-size: 0; flex: 1 1 auto; }
  .bg-header__ai-managed-card > .bg-header__ai-tile-icon { display: grid; place-items: center; inline-size: 1.875rem; block-size: 1.875rem; border-radius: var(--radius-circle); }
  .bg-header__ai-managed-card > .bg-header__ai-tile-icon::after { background: currentColor; }
  .bg-header__ai-managed-card h3, .bg-header__ai-managed-card p, .bg-header__ai-managed-card a { margin: 0; }
  .bg-header__ai-managed-card h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.15; }
  .bg-header__ai-managed-card p { margin-block-start: 0.1875rem; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); line-height: 1.25; }
  .bg-header__ai-managed-card a { display: inline-block; margin-block-start: 0.125rem; color: var(--relative-link-color, var(--link-color)); font-size: var(--text-xs); font-weight: 700; text-decoration: none; }
  .bg-header__ai-menu-intro { justify-content: flex-start; gap: var(--space-m); }
  .bg-header__ai-menu-intro > div:last-child { gap: var(--space-s); }
  .bg-header__ai-menu-intro .bg-header__ai-copy, .bg-header__ai-menu-intro .bg-header__ai-proof span { color: var(--relative-text-color, var(--text-color)); }
  .bg-header__ai-menu-intro .bg-header__ai-copy strong { color: var(--relative-link-color, var(--link-color)); }
  .bg-header__ai-badge { border-color: var(--primary-light); }
  .bg-header__ai-category-grid .bg-header__ai-tile-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }
  @media (max-width: 1365px) {
  }

  /* The navigation is moved into this wrapper in mobile mode. */
  .bg-header__mobile .bg-header__nav-list,
  .bg-header__mobile .bg-header__nav-item,
  .bg-header__mobile .bg-header__nav-details,
  .bg-header__mobile .bg-header__mega--ai,
  .bg-header__mobile .bg-header__ai-panel,
  .bg-header__mobile .bg-header__ai-menu,
  .bg-header__mobile .bg-header__ai-menu-main,
  .bg-header__mobile .bg-header__ai-categories,
  .bg-header__mobile .bg-header__ai-category,
  .bg-header__mobile .bg-header__ai-category-grid,
  .bg-header__mobile .bg-header__ai-category-grid a {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  .bg-header__mobile .bg-header__nav-item,
  .bg-header__mobile .bg-header__nav-details,
  .bg-header__mobile .bg-header__mega--ai {
    box-sizing: border-box;
    inline-size: 100%;
  }

  .bg-header__mega-icon-glyph--annual-accounts-tax-returns, .bg-header__mega-specialist-icon-glyph--annual-accounts-tax-returns { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2213%22%20x2%3D%2214%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2217%22%20x2%3D%2214%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M16%2011l1%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2213%22%20x2%3D%2214%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2217%22%20x2%3D%2214%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M16%2011l1%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--asset-protection, .bg-header__mega-specialist-icon-glyph--asset-protection { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Crect%20x%3D%229%22%20y%3D%2211%22%20width%3D%226%22%20height%3D%225%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M10%2011V9.5a2%202%200%200%201%204%200V11%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Crect%20x%3D%229%22%20y%3D%2211%22%20width%3D%226%22%20height%3D%225%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M10%2011V9.5a2%202%200%200%201%204%200V11%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--audit, .bg-header__mega-specialist-icon-glyph--audit { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m21%2021-4.3-4.3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2011h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%208v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m21%2021-4.3-4.3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2011h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%208v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--bookkeeping-vat-management-accounts, .bg-header__mega-specialist-icon-glyph--bookkeeping-vat-management-accounts { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4%2019.5A2.5%202.5%200%200%201%206.5%2017H20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M6.5%202H20v20H6.5A2.5%202.5%200%200%201%204%2019.5v-15A2.5%202.5%200%200%201%206.5%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%207h7%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2011h7%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4%2019.5A2.5%202.5%200%200%201%206.5%2017H20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M6.5%202H20v20H6.5A2.5%202.5%200%200%201%204%2019.5v-15A2.5%202.5%200%200%201%206.5%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%207h7%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2011h7%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--business-rates-rent, .bg-header__mega-specialist-icon-glyph--business-rates-rent { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10l7-5%207%205v11%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021v-6h6v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10l7-5%207%205v11%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021v-6h6v6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--business-sales, .bg-header__mega-specialist-icon-glyph--business-sales { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m11%2017%202%202a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m14%2014%202.5%202.5a1%201%200%201%200%203-3l-3.88-3.88a3%203%200%200%200-4.24%200l-.88.88a1%201%200%201%201-3-3l2.81-2.81a5.79%205.79%200%200%201%207.06-.87l.47.28a2%202%200%200%200%201.42.25L21%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m21%203%201%2011h-2%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%203%202%2014l6.5%206.5a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%204h8%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m11%2017%202%202a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m14%2014%202.5%202.5a1%201%200%201%200%203-3l-3.88-3.88a3%203%200%200%200-4.24%200l-.88.88a1%201%200%201%201-3-3l2.81-2.81a5.79%205.79%200%200%201%207.06-.87l.47.28a2%202%200%200%200%201.42.25L21%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m21%203%201%2011h-2%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%203%202%2014l6.5%206.5a1%201%200%201%200%203-3%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%204h8%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--business-valuations, .bg-header__mega-specialist-icon-glyph--business-valuations { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20.59%2013.41%2013.42%2020.58a2%202%200%200%201-2.83%200L2%2012V2h10l8.59%208.59a2%202%200%200%201%200%202.82z%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%227.5%22%20r%3D%221.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10%2017l2.5-2.5L15%2017%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12.5%2014.5V18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20.59%2013.41%2013.42%2020.58a2%202%200%200%201-2.83%200L2%2012V2h10l8.59%208.59a2%202%200%200%201%200%202.82z%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%227.5%22%20r%3D%221.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10%2017l2.5-2.5L15%2017%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12.5%2014.5V18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--cis-subcontractors, .bg-header__mega-specialist-icon-glyph--cis-subcontractors { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m15%2012-8.5%208.5c-.83.83-2.17.83-3%200a2.12%202.12%200%200%201%200-3L12%209%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17.64%2015%2022%2010.64%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m20.91%2011.7-1.25-1.25c-.6-.6-.93-1.4-.93-2.25v-.86L16.01%204.6a5.56%205.56%200%200%200-3.94-1.64H9l.92.82A6.18%206.18%200%200%201%2012%208.4v1.56l2%202h2.47l2.26%202.26%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22m15%2012-8.5%208.5c-.83.83-2.17.83-3%200a2.12%202.12%200%200%201%200-3L12%209%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17.64%2015%2022%2010.64%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m20.91%2011.7-1.25-1.25c-.6-.6-.93-1.4-.93-2.25v-.86L16.01%204.6a5.56%205.56%200%200%200-3.94-1.64H9l.92.82A6.18%206.18%200%200%201%2012%208.4v1.56l2%202h2.47l2.26%202.26%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--cloud-accounting, .bg-header__mega-specialist-icon-glyph--cloud-accounting { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.5%2019H9a7%207%200%201%201%206.71-9h1.79a4.5%204.5%200%201%201%200%209Z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10.5%2013.5h2.5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%2016v-3.5a1.25%201.25%200%200%201%202.5%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.5%2019H9a7%207%200%201%201%206.71-9h1.79a4.5%204.5%200%201%201%200%209Z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10.5%2013.5h2.5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M11%2016v-3.5a1.25%201.25%200%200%201%202.5%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--commercial-finance, .bg-header__mega-specialist-icon-glyph--commercial-finance { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22%3E%3C%2Fellipse%3E%0A%3Cpath%20d%3D%22M4%205v6c0%201.66%203.58%203%208%203s8-1.34%208-3V5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2011v6c0%201.66%203.58%203%208%203s8-1.34%208-3v-6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22%3E%3C%2Fellipse%3E%0A%3Cpath%20d%3D%22M4%205v6c0%201.66%203.58%203%208%203s8-1.34%208-3V5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2011v6c0%201.66%203.58%203%208%203s8-1.34%208-3v-6%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--company-secretarial, .bg-header__mega-specialist-icon-glyph--company-secretarial { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2214%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2217%22%20r%3D%223.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m12.5%2017%201%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2214%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2217%22%20r%3D%223.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22m12.5%2017%201%201%202-2%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--expats-digital-nomads, .bg-header__mega-specialist-icon-glyph--expats-digital-nomads { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.8%2019.2%2016%2011l3.5-3.5C21%206%2021.5%204%2021%203c-1-.5-3%200-4.5%201.5L13%208%204.8%206.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1%201%20.3%201.3L9%2012l-2%203H4l-1%201%203%202%202%203%201-1v-3l3-2%203.5%205.3c.3.4.8.5%201.3.3l.5-.2c.4-.3.6-.7.5-1.2z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17.8%2019.2%2016%2011l3.5-3.5C21%206%2021.5%204%2021%203c-1-.5-3%200-4.5%201.5L13%208%204.8%206.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1%201%20.3%201.3L9%2012l-2%203H4l-1%201%203%202%202%203%201-1v-3l3-2%203.5%205.3c.3.4.8.5%201.3.3l.5-.2c.4-.3.6-.7.5-1.2z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--franchising-your-business, .bg-header__mega-specialist-icon-glyph--franchising-your-business { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%229.5%22%20y%3D%226%22%20width%3D%225%22%20height%3D%2215%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%2217%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2011h5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17%2011h5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%229.5%22%20y%3D%226%22%20width%3D%225%22%20height%3D%2215%22%3E%3C%2Frect%3E%0A%3Crect%20x%3D%2217%22%20y%3D%2211%22%20width%3D%225%22%20height%3D%2210%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2011h5%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M17%2011h5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--freelancers-contractors, .bg-header__mega-specialist-icon-glyph--freelancers-contractors { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%224%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2018v3%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%222%22%20y%3D%224%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2018v3%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--global-zero-tax-strategy, .bg-header__mega-specialist-icon-glyph--global-zero-tax-strategy { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M2%2012h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%202a15.3%2015.3%200%200%201%204%2010%2015.3%2015.3%200%200%201-4%2010%2015.3%2015.3%200%200%201-4-10%2015.3%2015.3%200%200%201%204-10z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M2%2012h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%202a15.3%2015.3%200%200%201%204%2010%2015.3%2015.3%200%200%201-4%2010%2015.3%2015.3%200%200%201-4-10%2015.3%2015.3%200%200%201%204-10z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--inheritance-tax-estate-planning, .bg-header__mega-specialist-icon-glyph--inheritance-tax-estate-planning { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2010l9-7%209%207v11a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2019l-3.5-3.5a2%202%200%200%201%202.83-2.83L12%2013.34l.67-.67a2%202%200%200%201%202.83%202.83z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%2010l9-7%209%207v11a1%201%200%200%201-1%201H4a1%201%200%200%201-1-1z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2019l-3.5-3.5a2%202%200%200%201%202.83-2.83L12%2013.34l.67-.67a2%202%200%200%201%202.83%202.83z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--insolvency, .bg-header__mega-specialist-icon-glyph--insolvency { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpolyline%20points%3D%2222%2017%2013.5%208.5%208.5%2013.5%202%207%22%3E%3C%2Fpolyline%3E%0A%3Cpolyline%20points%3D%2216%2017%2022%2017%2022%2011%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpolyline%20points%3D%2222%2017%2013.5%208.5%208.5%2013.5%202%207%22%3E%3C%2Fpolyline%3E%0A%3Cpolyline%20points%3D%2216%2017%2022%2017%2022%2011%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--landlords, .bg-header__mega-specialist-icon-glyph--landlords { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%229%2022%209%2012%2015%2012%2015%2022%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%229%2022%209%2012%2015%2012%2015%2022%22%3E%3C%2Fpolyline%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--law, .bg-header__mega-specialist-icon-glyph--law { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%203%202%208h20z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M19%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2010h18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%203%202%208h20z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M5%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M19%2021V10%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2010h18%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--limited-companies, .bg-header__mega-specialist-icon-glyph--limited-companies { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012l2%202%204-4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012l2%202%204-4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--llps, .bg-header__mega-specialist-icon-glyph--llps { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%204v17%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2019h6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%223%22%20r%3D%221%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M3%207h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M0%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%204v17%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M8%2021h8%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2019h6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%223%22%20r%3D%221%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M3%207h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M0%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l-2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%207l2%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%2011h6a3%203%200%200%201-6%200z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--mortgages, .bg-header__mega-specialist-icon-glyph--mortgages { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%2215.5%22%20r%3D%224.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10.5%2012.5%2021%202%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m15.5%207.5%203%203%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m18%205%203%203%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Ccircle%20cx%3D%227.5%22%20cy%3D%2215.5%22%20r%3D%224.5%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M10.5%2012.5%2021%202%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m15.5%207.5%203%203%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m18%205%203%203%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--partnerships, .bg-header__mega-specialist-icon-glyph--partnerships { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17%2021v-2a4%204%200%200%200-4-4H5a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M23%2021v-2a4%204%200%200%200-3-3.87%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M16%203.13a4%204%200%200%201%200%207.75%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M17%2021v-2a4%204%200%200%200-4-4H5a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M23%2021v-2a4%204%200%200%200-3-3.87%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M16%203.13a4%204%200%200%201%200%207.75%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--payroll, .bg-header__mega-specialist-icon-glyph--payroll { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cline%20x1%3D%223%22%20y1%3D%2210%22%20x2%3D%2221%22%20y2%3D%2210%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%222%22%20x2%3D%228%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M12%2014v4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%3E%3C%2Frect%3E%0A%3Cline%20x1%3D%223%22%20y1%3D%2210%22%20x2%3D%2221%22%20y2%3D%2210%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%228%22%20y1%3D%222%22%20x2%3D%228%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%226%22%3E%3C%2Fline%3E%0A%3Cpath%20d%3D%22M12%2014v4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2016h4%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--personal-financial-planning, .bg-header__mega-specialist-icon-glyph--personal-financial-planning { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%203v18h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M7%2014l4-4%203%203%205-6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2210%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2213%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M3%203v18h18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M7%2014l4-4%203%203%205-6%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2211%22%20cy%3D%2210%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3Ccircle%20cx%3D%2214%22%20cy%3D%2213%22%20r%3D%220.5%22%20fill%3D%22%23000%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--self-assessment, .bg-header__mega-specialist-icon-glyph--self-assessment { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2213%22%20x2%3D%2215%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2217%22%20x2%3D%2215%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%3E%3C%2Fpath%3E%0A%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%3E%3C%2Fpolyline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2213%22%20x2%3D%2215%22%20y2%3D%2213%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%229%22%20y1%3D%2217%22%20x2%3D%2215%22%20y2%3D%2217%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--sole-traders, .bg-header__mega-specialist-icon-glyph--sole-traders { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--specialist-tax-claims, .bg-header__mega-specialist-icon-glyph--specialist-tax-claims { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M6%209H4.5a2.5%202.5%200%200%201%200-5H6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%209h1.5a2.5%202.5%200%200%200%200-5H18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2022h16%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2014.66V17c0%20.55-.47.98-.97%201.21C7.85%2018.75%207%2020.24%207%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M14%2014.66V17c0%20.55.47.98.97%201.21C16.15%2018.75%2017%2020.24%2017%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%202H6v7a6%206%200%200%200%2012%200V2Z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M6%209H4.5a2.5%202.5%200%200%201%200-5H6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%209h1.5a2.5%202.5%200%200%200%200-5H18%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M4%2022h16%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2014.66V17c0%20.55-.47.98-.97%201.21C7.85%2018.75%207%2020.24%207%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M14%2014.66V17c0%20.55.47.98.97%201.21C16.15%2018.75%2017%2020.24%2017%2022%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M18%202H6v7a6%206%200%200%200%2012%200V2Z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--startups, .bg-header__mega-specialist-icon-glyph--startups { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4.5%2016.5c-1.5%201.26-2%205-2%205s3.74-.5%205-2c.71-.84.7-2.13-.09-2.91a2.18%202.18%200%200%200-2.91-.09z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m12%2015-3-3a22%2022%200%200%201%202-3.95A12.88%2012.88%200%200%201%2022%202c0%202.72-.78%207.5-6%2011a22.35%2022.35%200%200%201-4%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012H4s.55-3.03%202-4c1.62-1.08%205%200%205%200%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2015v5s3.03-.55%204-2c1.08-1.62%200-5%200-5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M4.5%2016.5c-1.5%201.26-2%205-2%205s3.74-.5%205-2c.71-.84.7-2.13-.09-2.91a2.18%202.18%200%200%200-2.91-.09z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22m12%2015-3-3a22%2022%200%200%201%202-3.95A12.88%2012.88%200%200%201%2022%202c0%202.72-.78%207.5-6%2011a22.35%2022.35%200%200%201-4%202z%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M9%2012H4s.55-3.03%202-4c1.62-1.08%205%200%205%200%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M12%2015v5s3.03-.55%204-2c1.08-1.62%200-5%200-5%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--tax-advice, .bg-header__mega-specialist-icon-glyph--tax-advice { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M9%2018h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2022h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15.09%2014c.18-.98.65-1.74%201.41-2.5A4.65%204.65%200%200%200%2018%208%206%206%200%200%200%206%208c0%201%20.23%202.23%201.5%203.5A4.61%204.61%200%200%201%208.91%2014%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M9%2018h6%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M10%2022h4%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M15.09%2014c.18-.98.65-1.74%201.41-2.5A4.65%204.65%200%200%200%2018%208%206%206%200%200%200%206%208c0%201%20.23%202.23%201.5%203.5A4.61%204.61%200%200%201%208.91%2014%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--tax-investigations-problems-disputes, .bg-header__mega-specialist-icon-glyph--tax-investigations-problems-disputes { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212.01%22%20y2%3D%2216%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Cpath%20d%3D%22M12%2022s8-4%208-10V5l-8-3-8%203v7c0%206%208%2010%208%2010z%22%3E%3C%2Fpath%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2212%22%3E%3C%2Fline%3E%0A%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212.01%22%20y2%3D%2216%22%3E%3C%2Fline%3E%0A%3C%2Fsvg%3E"); }
  .bg-header__mega-icon-glyph--virtual-finance-office-fractional-cfo, .bg-header__mega-specialist-icon-glyph--virtual-finance-office-fractional-cfo { --bg-header-mega-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2212%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2020h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2016l-1%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%2016l1%204%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%229%22%20r%3D%221.8%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M8.5%2014a3.5%203.5%200%200%201%207%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); --bg-header-specialist-icon-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%3E%0A%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2212%22%20rx%3D%221%22%3E%3C%2Frect%3E%0A%3Cpath%20d%3D%22M2%2020h20%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M3%2016l-1%204%22%3E%3C%2Fpath%3E%0A%3Cpath%20d%3D%22M21%2016l1%204%22%3E%3C%2Fpath%3E%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%229%22%20r%3D%221.8%22%3E%3C%2Fcircle%3E%0A%3Cpath%20d%3D%22M8.5%2014a3.5%203.5%200%200%201%207%200%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E"); }
  & :where(a, button, summary):focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: 3px; }
  .bg-header__ai-category--marketing, .bg-header__ai-category--ai { min-inline-size: 0; }
  .bg-header__mega-column--specialist_service_cpt { background: var(--bg-header-mega-muted-bg); }
  .bg-header__cta .bg-button, .bg-header__mobile-cta .bg-button { white-space: nowrap; }
  @media (prefers-reduced-motion: reduce) { .bg-header__mobile { transition: none; } }
  /* AI panel layout follows its available width, independently of the hamburger breakpoint. */
  .bg-header__mega--ai {
    container-name: bg-header-ai;
    container-type: inline-size;
  }

  .bg-header__mobile .bg-header__ai-menu {
    inline-size: 100%;
    max-inline-size: 100%;
    grid-template-columns: minmax(15.625rem, .72fr) minmax(0, 2.28fr);
    grid-template-rows: auto auto;
  }

  .bg-header__mobile .bg-header__ai-menu-intro {
    padding: var(--space-s);
  }

  /* Keep card layout intact when the mobile navigation's general link rule applies. */
  &.is-mobile .bg-header__mobile .bg-header__ai-category-heading {
    display: grid;
    padding-block: 0;
  }

  &.is-mobile .bg-header__ai-category-grid a {
    display: grid;
    padding: 0.375rem;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }

  &.is-mobile .bg-header__mobile .bg-header__ai-solution {
    display: grid;
    padding-block: var(--space-xs) 0.1875rem;
  }

  &.is-mobile .bg-header__ai-menu-actions .bg-button {
    display: inline-flex;
  }

  /* Keep the card link clear of the menu footer when its copy wraps. */
  &.is-mobile .bg-header__ai-managed-card a {
    display: inline-block;
    padding-block: 0;
  }

  .bg-header__mobile .bg-header__ai-footer {
    block-size: auto;
  }

  @container bg-header-ai (inline-size < 72rem) {
    .bg-header__ai-solution-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-header__ai-footer > .bg-header__ai-footer-content {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: var(--space-xs);
    }
    .bg-header__ai-footer-intro { grid-column: 1 / -1; padding-inline-end: 0; }
    .bg-header__ai-footer-benefit { padding-inline: 0; border-inline-start: 0; white-space: normal; }
  }

  @container bg-header-ai (inline-size < 68rem) {
    .bg-header__ai-menu, .bg-header__mobile .bg-header__ai-menu {
      grid-template-columns: minmax(15rem, .75fr) minmax(0, 2.25fr);
    }
    .bg-header__ai-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-header__ai-category-grid--four { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bg-header__ai-solutions { grid-template-columns: minmax(0, 1fr); }
    .bg-header__ai-managed { border-inline-start: 0; padding-inline-start: 0; }
  }

  @container bg-header-ai (inline-size < 56rem) {
    .bg-header__ai-menu, .bg-header__mobile .bg-header__ai-menu {
      grid-template-columns: minmax(0, 1fr);
      grid-template-rows: auto;
    }
    .bg-header__ai-menu-intro, .bg-header__ai-menu-main, .bg-header__ai-panel > .bg-header__ai-solutions {
      grid-column: 1;
      grid-row: auto;
    }
    .bg-header__ai-menu-intro {
      display: grid;
      grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
      gap: var(--space-s);
      border-inline-end: 0;
      border-block-end: 1px solid var(--bg-header-border);
    }
    .bg-header__ai-menu-intro > div:last-child { align-content: center; }
    .bg-header__ai-menu-intro .bg-header__ai-proof { margin: 0; }
    .bg-header__ai-menu-intro .bg-header__ai-title { font-size: var(--text-xl); }
    .bg-header__ai-menu-intro .bg-header__ai-copy { margin-block-end: 0; }
  }

  @container bg-header-ai (inline-size < 40rem) {
    .bg-header__ai-menu-intro { grid-template-columns: minmax(0, 1fr); }
    .bg-header__ai-categories { grid-template-columns: minmax(0, 1fr); }
    .bg-header__ai-category-grid--three, .bg-header__ai-category-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-header__ai-solution-grid { grid-template-columns: minmax(0, 1fr); }
    .bg-header__ai-solution { block-size: auto; min-block-size: 6.25rem; }
    .bg-header__ai-menu-main { padding-inline: var(--space-s); }
    .bg-header__ai-solutions { margin-inline: var(--space-s); }
    .bg-header__ai-footer > .bg-header__ai-footer-content { grid-template-columns: minmax(0, 1fr); }
    .bg-header__ai-footer-intro { grid-column: auto; }
  }

  .bg-header__mega-list > li .bg-header__mega-icon, .bg-header__mega-specialist > * .bg-header__mega-specialist-icon { background: var(--bg-primary-soft); color: var(--icon-color); color-scheme: var(--icon-scheme); }

  /* Resolve menu colours on their own surface, including nested pale panels. */

/* Optional desktop overlay; solid Surface and dropdown colours remain the defaults. */
&.is-hero-overlay {
  margin-block-end: calc(-1 * var(--bg-header-overlay-height, 0px));
}
&.is-hero-overlay:not(.is-overlay-scrolled) {
  background: transparent;
  border-block-end-color: transparent;
  --bg-header-overlay-text: var(--bg-dark-heading);
  --bg-header-overlay-hover: var(--primary-light);
  --bg-header-overlay-hover-bg: color-mix(in oklch, var(--primary-dark) 55%, transparent);

  & .bg-header__logo {
    --bg-logo-light: none;
    --bg-logo-dark: inline-flex;
    color: var(--bg-header-overlay-text);
  }
  & .bg-header__nav-list > li > a,
  & .bg-header__nav-summary,
  & .bg-header__phone-summary,
  & .bg-header__phone > a {
    color: var(--bg-header-overlay-text);
  }
  & .bg-header__nav-list > li > a:is(:hover, :focus-visible),
  & .bg-header__nav-summary:is(:hover, :focus-visible),
  & .bg-header__nav-details[open] > .bg-header__nav-summary {
    color: var(--bg-header-overlay-hover);
    background: var(--bg-header-overlay-hover-bg);
  }
  & .bg-header__nav-summary-link { color: inherit; }
  & .bg-header__phone-summary:focus-visible {
    outline-color: var(--bg-header-overlay-text);
  }
  &.is-overlay-light {
    --bg-header-overlay-text: var(--bg-light-heading);
    --bg-header-overlay-hover: var(--primary);
    --bg-header-overlay-hover-bg: var(--bg-primary-soft);
    & .bg-header__logo {
      --bg-logo-light: inline-flex;
      --bg-logo-dark: none;
    }
  }
}
  /* BeanGrower product identity is fixed; menu colours follow the accountant's native ACSS. */
  .bg-header__ai-brand {
    display: block;
    inline-size: min(100%, 17rem);
    padding: var(--space-xs);
    margin-block-end: var(--space-s);
    border-radius: var(--radius);
    /* Supplied logo's near-black ink: an isolated product-logo backing, not a site colour. */
    background: #121512;
  }
  .bg-header__ai-brand-logo {
    display: block;
    inline-size: 100%;
    block-size: auto;
    aspect-ratio: 2387 / 305;
  }
  .bg-header__ai-category-icon {
    background: var(--bg-primary-soft);
    color: var(--icon-color);
    color-scheme: var(--icon-scheme);
  }
  .bg-header__ai-category-heading > span:last-child { color: var(--relative-link-color, var(--link-color)); }
  .bg-header__ai-category-grid a:hover,
  .bg-header__ai-category-grid a:focus-visible { background: var(--bg-primary-soft); }
  .bg-header__mega--ai :where(a, button, summary):focus-visible {
    outline: var(--focus-width) solid var(--focus-color);
    outline-offset: var(--focus-offset);
  }
  .bg-header__ai-solution:hover { border-color: var(--relative-link-color, var(--link-color)); }
}
.bg-hero--editable-stats {
  /* Preserve existing numerical stats; compact headings have their own typography. */
&:not(.bg-hero--stat-type-highlights) {

  /* Cards remain available through the existing Hero layout prop. */
  &.bg-hero--stat-layout-cards .bg-hero__stat-value {
    font-size: calc(var(--text-xl) * 1.6);
    color: var(--relative-heading-color, var(--heading-color));
  }
  &.bg-hero--stat-layout-cards .bg-hero__stat-label {
    color: var(--relative-text-color, var(--text-color));
    font-weight: 400;
    line-height: 1.4;
  }
  /* Authored stat icons create a compact proof card; icon-free cards stay valid. */
  &.bg-hero--stat-layout-cards .bg-hero__stat:has(> .bg-icon) {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: var(--space-xs);
    padding: var(--space-s);
    box-shadow: none;
  }
  &.bg-hero--stat-layout-cards .bg-hero__stat > .bg-icon {
    display: inline-grid;
    inline-size: 2rem;
    block-size: 2rem;
    color: var(--bg-brand-accent, var(--primary));
    background: transparent;
  }
  &.bg-hero--stat-layout-cards .bg-hero__stat:has(> .bg-icon) .bg-hero__stat-value {
    font-size: calc(var(--text-xl) * 1.1);
    line-height: 1.1;
    text-wrap: initial;
  }
  &.bg-hero--stat-layout-cards .bg-hero__stat:has(> .bg-icon) .bg-hero__stat-label {
    font-size: var(--text-s);
  }
  @container (inline-size < 60rem) {
    &.bg-hero--stat-layout-cards .bg-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @container (inline-size < 30rem) {
    &.bg-hero--stat-layout-cards .bg-hero__stat:has(> .bg-icon) { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
    &.bg-hero--stat-layout-cards .bg-hero__stat:has(> .bg-icon) .bg-hero__stat-value { font-size: var(--text-xl); }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--stat-layout-cards .bg-hero__stats { grid-template-columns: minmax(0, 1fr); }
  }

}
}
.bg-mctb-speed {
  
  display: grid;
  gap: var(--space-m);
  min-inline-size: 0;
  container: mctb-speed / inline-size;

  .bg-mctb-speed__stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-s);
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .bg-mctb-speed__card {
    display: flex;
    flex-direction: column;
    gap: var(--space-s);
    min-inline-size: 0;
    padding: var(--space-m);
    border-radius: var(--radius);
  }

  .bg-mctb-speed__value { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: 700; line-height: 1; letter-spacing: -.04em; }
  .bg-mctb-speed__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 600; line-height: 1.35; }
  .bg-mctb-speed__copy { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.55; }
  .bg-mctb-speed__reference { font-size: .65em; vertical-align: super; line-height: 0; margin-inline-start: .15em; }

  .bg-mctb-speed__insight { display: flex; align-items: center; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); }
  .bg-mctb-speed__icon { display: grid; place-items: center; flex: none; inline-size: var(--space-l); aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-mctb-speed__glyph { display: block; inline-size: 1.5em; block-size: 1.5em; }
  .bg-mctb-speed__insight-copy { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  .bg-mctb-speed__insight-heading { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }
  .bg-mctb-speed__sources { max-inline-size: none; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-mctb-speed__source-link { color: inherit; text-decoration: underline; text-underline-offset: .15em; }

  @container mctb-speed (inline-size < 64rem) {
    .bg-mctb-speed__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @container mctb-speed (inline-size < 42rem) {
    .bg-mctb-speed__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @container mctb-speed (inline-size < 28rem) {
    .bg-mctb-speed__stats { grid-template-columns: minmax(0, 1fr); }
    .bg-mctb-speed__insight { align-items: start; gap: var(--space-s); padding: var(--space-s); }
  }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-mctb-speed__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-mctb-speed__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-beangrower-ai-pricing-options {
  min-inline-size: 0;


  .bg-beangrower-ai-pricing-options__top { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .95fr) minmax(0, 1.12fr); gap: var(--space-s); align-items: end; }
  .bg-beangrower-ai-pricing-options__intro { grid-column: 1 / 3; text-align: center; }
  .bg-beangrower-ai-pricing-options__intro h2 { max-inline-size: 44.375rem; margin: 0 auto; color: var(--relative-heading-color, var(--heading-color)); font-size: clamp(var(--h2), 4.8cqi, var(--h1)); line-height: .98; letter-spacing: -.055em; }
  .bg-beangrower-ai-pricing-options__intro h2 span { color: var(--bg-brand-accent, var(--primary)); }
  .bg-beangrower-ai-pricing-options__intro p { margin: var(--space-s) auto 0; font-size: var(--text-m); line-height: 1.4; }
  .bg-beangrower-ai-pricing-options__start-intro { grid-column: 3; padding-block-end: var(--space-xs); text-align: left; }
  .bg-beangrower-ai-pricing-options__start-intro--desktop { align-self: start; }
  .bg-beangrower-ai-pricing-options__start-intro--standalone { display: none; }
  .bg-beangrower-ai-pricing-options__start-intro h3, .bg-beangrower-ai-pricing-options__start-intro p { margin: 0; }
  .bg-beangrower-ai-pricing-options__start-intro h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.12; letter-spacing: -.035em; }
  .bg-beangrower-ai-pricing-options__start-intro p { margin-block-start: 0.4375rem; font-size: var(--text-m); line-height: 1.4; }

  .bg-beangrower-ai-pricing-options__main { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .95fr) minmax(0, 1.12fr); column-gap: var(--space-s); row-gap: calc(var(--space-m) + 0.75rem); }
  .bg-beangrower-ai-pricing-options__saving { grid-column: 1 / 3; display: flex; align-items: center; justify-content: center; gap: var(--space-s); inline-size: 100%; padding: var(--space-xs) var(--space-m); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); }
  .bg-beangrower-ai-pricing-options__saving p { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 800; line-height: 1.2; text-align: center; }
  .bg-beangrower-ai-pricing-options__saving strong { color: var(--bg-brand-accent, var(--primary)); }
  .bg-beangrower-ai-pricing-options__saving-icon { display: grid; place-items: center; flex: 0 0 auto; inline-size: 2.25rem; block-size: 2.25rem; border-radius: var(--radius); background: var(--primary); color: var(--white); }
  .bg-beangrower-ai-pricing-options__saving-icon svg { inline-size: 1.375rem; block-size: 1.375rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }

  .bg-beangrower-ai-pricing-options__plans { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .95fr) minmax(0, 1.12fr); gap: var(--space-s); align-items: stretch; }
  .bg-beangrower-ai-pricing-options__plan { position: relative; display: grid; align-content: start; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); box-shadow: 0 0.75rem 2rem color-mix(in srgb, var(--black) 20%, transparent); }
  .bg-beangrower-ai-pricing-options__plan--plus { border: 2px solid var(--secondary); }
  .bg-beangrower-ai-pricing-options__recommended { position: absolute; inset-block-start: calc(var(--space-m) * -1); inset-inline-start: 50%; z-index: 1; inline-size: 11.25rem; padding: 0.4375rem var(--space-s) 0.5625rem; border-radius: var(--radius); background: var(--secondary); color: var(--text-dark); font-size: var(--text-s); font-weight: 800; letter-spacing: .05em; text-align: center; text-transform: uppercase; transform: translateX(-50%); white-space: nowrap; }
  .bg-beangrower-ai-pricing-options__plan-head { display: grid; grid-template-columns: 4.375rem minmax(0, 1fr); gap: var(--space-xs); align-items: start; }
  .bg-beangrower-ai-pricing-options__plan-head p, .bg-beangrower-ai-pricing-options__plan-head h3, .bg-beangrower-ai-pricing-options__plan-head small { margin: 0; }
  .bg-beangrower-ai-pricing-options__plan-head p { padding-block-start: 0.3125rem; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 800; line-height: 1; }
  .bg-beangrower-ai-pricing-options__plan-head h3 { color: var(--primary); font-size: clamp(1.625rem, 2.45cqi, 2.25rem); line-height: 1; letter-spacing: -.05em; white-space: nowrap; }
  .bg-beangrower-ai-pricing-options__plan--plus .bg-beangrower-ai-pricing-options__plan-head h3 { color: var(--secondary-semi-dark); }
  .bg-beangrower-ai-pricing-options__plan-head small { display: block; margin-block-start: 0.5rem; font-size: var(--text-s); line-height: 1.35; }
  .bg-beangrower-ai-pricing-options__plan-mark { display: grid; place-items: center; inline-size: 4rem; block-size: 4rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); background: var(--bg-decoration-surface, var(--bg-light)); color: currentColor; }
  .bg-beangrower-ai-pricing-options__plan-mark svg { inline-size: 3rem; block-size: 2.375rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.45; }
  .bg-beangrower-ai-pricing-options__price-row { display: grid; grid-template-columns: var(--grid-2); gap: var(--space-s); align-items: start; }
  .bg-beangrower-ai-pricing-options__price { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 0.125rem; color: var(--relative-text-color, var(--text-color)); white-space: nowrap; }
  .bg-beangrower-ai-pricing-options__price strong { font-size: clamp(var(--h3), 4cqi, var(--h2)); letter-spacing: -.06em; line-height: .9; }
  .bg-beangrower-ai-pricing-options__price span { font-size: var(--text-s); font-weight: 700; }
  .bg-beangrower-ai-pricing-options__price small { flex-basis: 100%; margin-block-start: 0.3125rem; font-size: var(--text-s); font-weight: 700; line-height: 1.15; }
  .bg-beangrower-ai-pricing-options__price--client { color: var(--primary); }
  .bg-beangrower-ai-pricing-options__plan--plus .bg-beangrower-ai-pricing-options__price--client { color: var(--secondary-semi-dark); }
  .bg-beangrower-ai-pricing-options__founding-rate { display: inline-flex; align-self: flex-start; justify-self: start; margin-block-start: calc(var(--space-s) * -1 + 0.4375rem); padding: 0.25rem 0.4375rem; border: 1px solid var(--primary); border-radius: var(--radius); background: var(--primary-ultra-light); color: var(--primary-semi-dark); font-size: 0.625rem; font-weight: 800; letter-spacing: .06em; line-height: 1; text-transform: uppercase; white-space: nowrap; }
  .bg-beangrower-ai-pricing-options__plan--plus .bg-beangrower-ai-pricing-options__founding-rate { border-color: var(--secondary-semi-dark); background: var(--secondary-ultra-light); color: var(--secondary-semi-dark); }
  .bg-beangrower-ai-pricing-options__founding-rate-note { grid-column: 1 / 3; align-self: start; margin: 0; padding: var(--space-xs) var(--space-s); border: 1px solid var(--primary-semi-light); border-radius: var(--radius); background: var(--primary-ultra-light); color: var(--primary-semi-dark); font-size: var(--text-s); line-height: 1.35; }
  .bg-beangrower-ai-pricing-options__founding-rate-note p { margin: 0; }
  .bg-beangrower-ai-pricing-options__setup { display: flex; align-items: center; justify-content: center; gap: 0.4375rem; margin: 0; padding: 0.4375rem var(--space-xs); border: 1px solid var(--primary-semi-light); border-radius: var(--radius); background: var(--primary-ultra-light); color: var(--primary-semi-dark); font-size: var(--text-s); line-height: 1.2; text-align: center; }
  .bg-beangrower-ai-pricing-options__plan--plus .bg-beangrower-ai-pricing-options__setup { border-color: var(--secondary-semi-light); background: var(--secondary-ultra-light); color: var(--secondary-semi-dark); }
  .bg-beangrower-ai-pricing-options__setup svg { inline-size: 1.25rem; block-size: 1.25rem; fill: currentColor; }

  .bg-beangrower-ai-pricing-options__feature-set { padding-block-start: var(--space-xs); border-block-start: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); }
  .bg-beangrower-ai-pricing-options__feature-set > p, .bg-beangrower-ai-pricing-options__included > p, .bg-beangrower-ai-pricing-options__plus-list > p { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 800; }
  .bg-beangrower-ai-pricing-options__feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.375rem; margin: var(--space-xs) 0 0; padding: 0; list-style: none; }
  .bg-beangrower-ai-pricing-options__feature-grid li { display: grid; grid-template-columns: 1.5625rem minmax(0, 1fr); gap: 0.3125rem; align-items: center; min-block-size: 2.9375rem; padding: 0.3125rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); color: currentColor; font-size: var(--text-xs); font-weight: 800; line-height: 1.08; }
  .bg-beangrower-ai-pricing-options__feature-icon { display: block; min-inline-size: 0; min-block-size: 0; inline-size: 1.375rem; block-size: 1.375rem; background: currentColor; mask: var(--pricing-feature-icon) center / contain no-repeat; -webkit-mask: var(--pricing-feature-icon) center / contain no-repeat; }
  .bg-beangrower-ai-pricing-options__feature-icon--website { --pricing-feature-icon: url("../assets/bg-ai-website-tools.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--crm { --pricing-feature-icon: url("../assets/bg-ai-crm.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--leads { --pricing-feature-icon: url("../assets/bg-ai-lead-capture.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--ai { --pricing-feature-icon: url("../assets/bg-ai-ai-assistants.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--inbox { --pricing-feature-icon: url("../assets/bg-ai-multi-channel-inbox.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--phone { --pricing-feature-icon: url("../assets/bg-ai-virtual-phone-system.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--bookings { --pricing-feature-icon: url("../assets/bg-ai-bookings.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--reviews { --pricing-feature-icon: url("../assets/bg-ai-reviews-reputation.svg"); }
  .bg-beangrower-ai-pricing-options__feature-icon--social { --pricing-feature-icon: url("../assets/bg-ai-social-media-planner.svg"); }
  .bg-beangrower-ai-pricing-options__more { padding-block-start: var(--space-xs); border-block-end: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); padding-block-end: var(--space-xs); text-align: center; }
  .bg-beangrower-ai-pricing-options__included { padding-block-start: var(--space-xs); }
  .bg-beangrower-ai-pricing-options__included ul { display: grid; grid-template-columns: var(--grid-2); gap: 0.375rem var(--space-s); margin: var(--space-xs) 0 0; padding: 0; list-style: none; }
  .bg-beangrower-ai-pricing-options__included li { position: relative; padding-inline-start: 1.1875rem; font-size: var(--text-s); line-height: 1.2; }
  .bg-beangrower-ai-pricing-options__included li::before { position: absolute; inset-block-start: 0.0625rem; inset-inline-start: 0; color: var(--primary); content: '✓'; font-weight: 800; }
  .bg-beangrower-ai-pricing-options__footnote { display: flex; align-items: center; gap: var(--space-xs); margin: 0; padding: 0.4375rem var(--space-xs); border: 1px solid var(--tertiary-semi-light); border-radius: var(--radius); background: var(--tertiary-ultra-light); color: var(--tertiary-semi-dark); font-size: var(--text-s); line-height: 1.2; }
  .bg-beangrower-ai-pricing-options__footnote span, .bg-beangrower-ai-pricing-options__usage-note span { display: grid; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; border: 1px solid currentColor; border-radius: var(--radius); font-weight: 800; }

  .bg-beangrower-ai-pricing-options__plus-list { padding-block-start: var(--space-xs); border-block-start: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); }
  .bg-beangrower-ai-pricing-options__plus-list ul { display: grid; margin: var(--space-xs) 0 0; padding: 0; list-style: none; }
  .bg-beangrower-ai-pricing-options__plus-list li { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--space-s); padding-block: var(--space-s); border-block-end: 1px solid var(--secondary-ultra-light); }
  .bg-beangrower-ai-pricing-options__plus-list li > span { display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); background: var(--bg-decoration-surface, var(--bg-light)); color: currentColor; font-size: var(--text-xl); font-weight: 800; }
  .bg-beangrower-ai-pricing-options__plus-list li > span svg { inline-size: 1.6875rem; block-size: 1.6875rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
  .bg-beangrower-ai-pricing-options__plus-list li > span .bg-beangrower-ai-pricing-options__whatsapp-icon { fill: currentColor; stroke: none; }
  .bg-beangrower-ai-pricing-options__plus-list h4, .bg-beangrower-ai-pricing-options__plus-list p { margin: 0; }
  .bg-beangrower-ai-pricing-options__plus-list h4 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.14; }
  .bg-beangrower-ai-pricing-options__plus-list p { margin-block-start: 0.25rem; font-size: var(--text-s); line-height: 1.35; }

  .bg-beangrower-ai-pricing-options__standalone { grid-column: 3; grid-row: 1 / span 2; display: grid; align-content: start; gap: var(--space-s); margin-block-start: -12.25rem; }
  .bg-beangrower-ai-pricing-options__standalone-card { display: grid; grid-template-columns: 4.25rem minmax(0, 1fr) minmax(11.25rem, .9fr); gap: var(--space-s); align-items: start; padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); box-shadow: 0 0.5rem 1.5rem color-mix(in srgb, var(--black) 14%, transparent); }
  .bg-beangrower-ai-pricing-options__standalone-icon { display: grid; place-items: center; inline-size: 3.75rem; block-size: 3.75rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); color: currentColor; font-size: 2.125rem; }
  .bg-beangrower-ai-pricing-options__mask { display: block; inline-size: 55%; block-size: 55%; background: currentColor; mask: var(--pricing-icon-mask) center / contain no-repeat; -webkit-mask: var(--pricing-icon-mask) center / contain no-repeat; }
  .bg-beangrower-ai-pricing-options__mask--receptionist { --pricing-icon-mask: url("../assets/use-cases-ai-receptionist-mask-vector.svg"); }
  .bg-beangrower-ai-pricing-options__mask--missed-call { --pricing-icon-mask: url("../assets/use-cases-missed-call-text-back-mask-vector.svg"); }
  .bg-beangrower-ai-pricing-options__mask--reactivation { --pricing-icon-mask: url("../assets/bg-ai-database-reactivation.svg"); }
  .bg-beangrower-ai-pricing-options__standalone-card h3, .bg-beangrower-ai-pricing-options__standalone-card p { margin: 0; }
  .bg-beangrower-ai-pricing-options__standalone-card h3 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.12; }
  .bg-beangrower-ai-pricing-options__standalone-card > div:nth-child(2) > p { margin-block-start: 0.4375rem; font-size: var(--text-s); line-height: 1.35; }
  .bg-beangrower-ai-pricing-options__standalone-prices { display: grid; grid-template-columns: var(--grid-2); gap: var(--space-xs); align-items: start; }
  .bg-beangrower-ai-pricing-options__standalone-prices > p { display: grid; grid-template-columns: minmax(0, 1fr); align-self: start; align-items: start; padding-block-start: 0.25rem; }
  .bg-beangrower-ai-pricing-options__standalone-prices strong { font-size: var(--text-xl); letter-spacing: -.05em; line-height: 1; }
  .bg-beangrower-ai-pricing-options__standalone-prices span { margin-block-start: 0.1875rem; font-size: var(--text-xs); font-weight: 700; line-height: 1.1; }
  .bg-beangrower-ai-pricing-options__standalone-prices small { margin-block-start: 0.1875rem; font-size: var(--text-xs); font-weight: 700; line-height: 1.1; }
  .bg-beangrower-ai-pricing-options__client-price { color: var(--primary); }
  .bg-beangrower-ai-pricing-options__standalone-prices em { display: flex; grid-column: 1 / -1; align-items: center; justify-content: center; gap: 0.375rem; inline-size: 100%; padding-block-start: var(--space-xs); border-block-start: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-style: normal; text-align: center; }
  .bg-beangrower-ai-pricing-options__standalone-link { grid-column: 2 / -1; justify-self: end; margin-block-start: calc(var(--space-xs) * -1); color: var(--primary); font-size: var(--text-s); font-weight: 800; line-height: 1.2; text-decoration: underline; text-underline-offset: 0.1875rem; }
  .bg-beangrower-ai-pricing-options__standalone-link span { display: inline-block; margin-inline-start: 0.1875rem; text-decoration: none; }
  .bg-beangrower-ai-pricing-options__standalone-card:nth-of-type(2) .bg-beangrower-ai-pricing-options__client-price, .bg-beangrower-ai-pricing-options__standalone-card:nth-of-type(2) .bg-beangrower-ai-pricing-options__standalone-link { color: var(--secondary-semi-dark); }
  .bg-beangrower-ai-pricing-options__standalone-card:nth-of-type(3) .bg-beangrower-ai-pricing-options__client-price, .bg-beangrower-ai-pricing-options__standalone-card:nth-of-type(3) .bg-beangrower-ai-pricing-options__standalone-link { color: var(--accent-semi-dark); }
  .bg-beangrower-ai-pricing-options__standalone-card--reactivation .bg-beangrower-ai-pricing-options__client-price, .bg-beangrower-ai-pricing-options__standalone-card--reactivation .bg-beangrower-ai-pricing-options__standalone-link { color: var(--tertiary-semi-dark); }
  .bg-beangrower-ai-pricing-options__settings-icon { inline-size: 1.0625rem; block-size: 1.0625rem; fill: currentColor; }
  .bg-beangrower-ai-pricing-options__usage-note { display: flex; align-items: center; justify-content: center; gap: 0.4375rem; margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-beangrower-ai-pricing-options__managed { position: relative; display: grid; grid-template-columns: 4.25rem minmax(0, 1fr) minmax(8.75rem, .65fr); gap: var(--space-s); align-items: center; padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); }
  .bg-beangrower-ai-pricing-options__managed-icon { display: grid; place-items: center; align-self: start; inline-size: 3.75rem; block-size: 3.75rem; border-radius: var(--radius); font-size: 2.0625rem; line-height: 1; }
  .bg-beangrower-ai-pricing-options__managed-mask { display: block; inline-size: 55%; block-size: 55%; background: currentColor; mask: url("../assets/bg-ai-managed-service.svg") center / contain no-repeat; -webkit-mask: url("../assets/bg-ai-managed-service.svg") center / contain no-repeat; }
  .bg-beangrower-ai-pricing-options__managed-label { position: absolute; inset-block-start: var(--space-xs); inset-inline-end: var(--space-s); padding: 0.25rem 0.4375rem; border-radius: var(--radius); background: var(--primary); color: var(--white); font-size: 0.5625rem; font-weight: 800; letter-spacing: .04em; line-height: 1; text-transform: uppercase; }
  .bg-beangrower-ai-pricing-options__managed h3, .bg-beangrower-ai-pricing-options__managed p { margin: 0; }
  .bg-beangrower-ai-pricing-options__managed h3 { color: var(--primary-semi-dark); font-size: var(--text-l); line-height: 1.04; letter-spacing: -.04em; }
  .bg-beangrower-ai-pricing-options__managed p { margin-block-start: 0.4375rem; font-size: var(--text-s); line-height: 1.3; }
  .bg-beangrower-ai-pricing-options__managed-price { display: grid; justify-items: center; align-content: center; padding-block-start: 1.375rem; color: var(--primary-semi-dark); text-align: center; }
  .bg-beangrower-ai-pricing-options__managed-price > span, .bg-beangrower-ai-pricing-options__managed-price small { font-size: var(--text-s); font-weight: 700; line-height: 1; }
  .bg-beangrower-ai-pricing-options__managed-price strong { font-size: clamp(var(--h3), 4cqi, var(--h2)); letter-spacing: -.06em; line-height: .92; }
  .bg-beangrower-ai-pricing-options__managed-price .bg-button { inline-size: 100%; margin-block-start: var(--space-xs); font-size: var(--text-s); }
  .bg-beangrower-ai-pricing-options__managed-price .bg-button span { display: inline-block; margin-inline-start: 0.25rem; }
  .bg-beangrower-ai-pricing-options__other, .bg-beangrower-ai-pricing-options__usage { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); color: currentColor; }
  .bg-beangrower-ai-pricing-options__other > span, .bg-beangrower-ai-pricing-options__usage > span { display: grid; place-items: center; inline-size: 2.375rem; block-size: 2.375rem; border: 2px solid currentColor; border-radius: var(--radius); font-size: var(--text-l); font-weight: 800; }
  .bg-beangrower-ai-pricing-options__usage > span svg { inline-size: 1.5625rem; block-size: 1.5625rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
  .bg-beangrower-ai-pricing-options__other p, .bg-beangrower-ai-pricing-options__usage h3, .bg-beangrower-ai-pricing-options__usage p { margin: 0; }
  .bg-beangrower-ai-pricing-options__other p, .bg-beangrower-ai-pricing-options__usage p { font-size: var(--text-s); line-height: 1.35; }
  .bg-beangrower-ai-pricing-options__usage h3 { color: currentColor; font-size: var(--text-m); line-height: 1.15; }
  .bg-beangrower-ai-pricing-options__usage p { margin-block-start: 0.3125rem; }
  .bg-beangrower-ai-pricing-options__usage a { display: inline-block; margin-block-start: 0.3125rem; color: inherit; font-size: var(--text-s); font-weight: 700; }

  .bg-beangrower-ai-pricing-options__reassurance { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-s); margin: var(--space-xs) 0 0; padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); background: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 80%, var(--black)); list-style: none; }
  .bg-beangrower-ai-pricing-options__reassurance li { display: grid; grid-template-columns: 2.875rem minmax(0, 1fr); gap: var(--space-xs); align-items: center; }
  .bg-beangrower-ai-pricing-options__reassurance li > span { display: grid; place-items: center; inline-size: 2.5rem; block-size: 2.5rem; border-radius: var(--radius); background: var(--primary); color: var(--white); font-size: var(--text-l); }
  .bg-beangrower-ai-pricing-options__reassurance li > span svg { inline-size: 1.4375rem; block-size: 1.4375rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
  .bg-beangrower-ai-pricing-options__reassurance strong, .bg-beangrower-ai-pricing-options__reassurance small { display: block; }
  .bg-beangrower-ai-pricing-options__reassurance strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.2; }
  .bg-beangrower-ai-pricing-options__reassurance small { margin-block-start: 0.1875rem; font-size: var(--text-s); line-height: 1.2; }

  .bg-beangrower-ai-pricing-options__coffee-card { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); align-items: center; gap: var(--space-s); margin: var(--space-m) 0 0; padding: var(--space-m) var(--space-l); border: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); border-radius: var(--radius); }
  .bg-beangrower-ai-pricing-options__coffee-icon { display: inline-grid; place-items: center; inline-size: 4.25rem; block-size: 4.25rem; border-radius: var(--radius); }
  .bg-beangrower-ai-pricing-options__coffee-icon svg { display: block; inline-size: 2.375rem; block-size: 2.375rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; }
  .bg-beangrower-ai-pricing-options__coffee-card p { margin: 0; color: var(--relative-heading-color, var(--heading-color)); }

  @container (inline-size < 80rem) {
    .bg-beangrower-ai-pricing-options__standalone { margin-block-start: 0; }
    .bg-beangrower-ai-pricing-options__plans { grid-template-columns: var(--grid-2); }
    .bg-beangrower-ai-pricing-options__founding-rate-note { grid-column: 1 / -1; }
    .bg-beangrower-ai-pricing-options__standalone { grid-column: 1 / -1; grid-row: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bg-beangrower-ai-pricing-options__start-intro--desktop { display: none; }
    .bg-beangrower-ai-pricing-options__start-intro--standalone { display: block; grid-column: 1 / -1; padding-block: var(--space-l) var(--space-xs); }
    .bg-beangrower-ai-pricing-options__standalone-card { grid-template-columns: 3.625rem minmax(0, 1fr); }
    .bg-beangrower-ai-pricing-options__standalone-prices { grid-column: 1 / -1; grid-template-columns: var(--grid-2); padding-block-start: var(--space-xs); border-block-start: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); }
    .bg-beangrower-ai-pricing-options__standalone-link { grid-column: 1 / -1; justify-self: start; margin-block-start: calc(var(--space-xs) * -1); }
    .bg-beangrower-ai-pricing-options__managed { grid-template-columns: 3.25rem minmax(0, 1fr); align-items: start; }
    .bg-beangrower-ai-pricing-options__managed-icon { inline-size: 3.375rem; block-size: 3.375rem; }
    .bg-beangrower-ai-pricing-options__managed-label { position: static; display: inline-flex; margin-block-end: var(--space-xs); }
    .bg-beangrower-ai-pricing-options__managed-price { grid-column: 2; grid-template-columns: auto auto auto; align-self: start; justify-content: start; justify-items: start; column-gap: 0.25rem; padding-block-start: var(--space-xs); text-align: left; }
    .bg-beangrower-ai-pricing-options__managed-price .bg-button { grid-column: 1 / -1; inline-size: fit-content; }
    .bg-beangrower-ai-pricing-options__other, .bg-beangrower-ai-pricing-options__usage { grid-column: span 1; }
    .bg-beangrower-ai-pricing-options__usage-note { grid-column: 1 / -1; justify-content: start; }
  }

  @container (inline-size < 58rem) {
    .bg-beangrower-ai-pricing-options__top { grid-template-columns: var(--grid-1); gap: var(--space-s); }
    .bg-beangrower-ai-pricing-options__intro, .bg-beangrower-ai-pricing-options__start-intro { grid-column: auto; }
    .bg-beangrower-ai-pricing-options__main { grid-template-columns: var(--grid-1); }
    .bg-beangrower-ai-pricing-options__saving { grid-column: auto; }
    .bg-beangrower-ai-pricing-options__plans, .bg-beangrower-ai-pricing-options__standalone { grid-template-columns: var(--grid-1); }
    .bg-beangrower-ai-pricing-options__plans { row-gap: calc(var(--space-m) + 2rem); }
    .bg-beangrower-ai-pricing-options__founding-rate-note { grid-column: auto; }
    .bg-beangrower-ai-pricing-options__standalone { grid-column: auto; }
    .bg-beangrower-ai-pricing-options__standalone-card { grid-template-columns: 4.25rem minmax(0, 1fr) minmax(11.25rem, .9fr); }
    .bg-beangrower-ai-pricing-options__standalone-prices { grid-column: auto; border-block-start: 0; padding-block-start: 0; }
    .bg-beangrower-ai-pricing-options__standalone-link { grid-column: 2 / -1; justify-self: end; }
    .bg-beangrower-ai-pricing-options__other, .bg-beangrower-ai-pricing-options__usage { grid-column: auto; }
    .bg-beangrower-ai-pricing-options__reassurance { grid-template-columns: var(--grid-2); }
  }

  @container (inline-size < 38rem) {
    .bg-beangrower-ai-pricing-options__intro h2 { font-size: var(--h2); }
    .bg-beangrower-ai-pricing-options__saving { align-items: flex-start; justify-content: start; border-radius: var(--radius); }
    .bg-beangrower-ai-pricing-options__saving p { text-align: left; font-size: var(--text-m); }
    .bg-beangrower-ai-pricing-options__plan { padding: var(--space-s); }
    .bg-beangrower-ai-pricing-options__plan-head { grid-template-columns: 4rem minmax(0, 1fr); }
    .bg-beangrower-ai-pricing-options__plan-mark { inline-size: 3.75rem; block-size: 3.75rem; font-size: 2.375rem; }
    .bg-beangrower-ai-pricing-options__feature-grid { grid-template-columns: var(--grid-2); }
    .bg-beangrower-ai-pricing-options__included ul { grid-template-columns: var(--grid-1); }
    .bg-beangrower-ai-pricing-options__standalone-card { grid-template-columns: 3.75rem minmax(0, 1fr); }
    .bg-beangrower-ai-pricing-options__standalone-icon { inline-size: 3.375rem; block-size: 3.375rem; }
    .bg-beangrower-ai-pricing-options__standalone-prices { grid-column: 1 / -1; padding-block-start: var(--space-xs); border-block-start: 1px solid color-mix(in oklch, var(--neutral-light) 50%, transparent); }
    .bg-beangrower-ai-pricing-options__standalone-link { grid-column: 1 / -1; justify-self: start; }
    .bg-beangrower-ai-pricing-options__managed { grid-template-columns: 3.375rem minmax(0, 1fr); }
    .bg-beangrower-ai-pricing-options__managed-icon { inline-size: 3.25rem; block-size: 3.25rem; }
    .bg-beangrower-ai-pricing-options__managed-label { position: static; display: inline-flex; margin-block-end: 0.3125rem; }
    .bg-beangrower-ai-pricing-options__managed-price { grid-column: 1 / -1; grid-template-columns: auto auto auto; justify-content: start; justify-items: start; column-gap: 0.25rem; padding-block-start: var(--space-xs); text-align: left; }
    .bg-beangrower-ai-pricing-options__managed-price .bg-button { grid-column: 1 / -1; }
    .bg-beangrower-ai-pricing-options__reassurance { grid-template-columns: var(--grid-1); }
    .bg-beangrower-ai-pricing-options__coffee-card { grid-template-columns: 3.375rem minmax(0, 1fr); padding: var(--space-s); }
    .bg-beangrower-ai-pricing-options__coffee-icon { inline-size: 3.375rem; block-size: 3.375rem; }
    .bg-beangrower-ai-pricing-options__coffee-icon svg { inline-size: 1.875rem; block-size: 1.875rem; }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */
  .bg-beangrower-ai-pricing-options__closing { display: grid; gap: var(--space-l); }
  .bg-beangrower-ai-pricing-options__introduction, .bg-beangrower-ai-pricing-options__closing { container-type: inline-size; }

}
.bg-content-groups-01 {
  container-type: inline-size;

  & .bg-content-groups-01__container { display: grid; gap: var(--space-l); }
  & .bg-content-groups-01__grid { display: grid; grid-template-columns: var(--bg-content-groups-01-columns, minmax(0, 2fr) minmax(0, 3fr)); align-items: stretch; gap: var(--space-l) var(--space-xxl); }
  & .bg-content-groups-01__panel {
    display: grid; align-content: start; gap: 0; min-inline-size: 0; padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }
  & .bg-content-groups-01__intro { display: flex; align-items: center; gap: var(--space-s); }
  & .bg-content-groups-01__title { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.25; }
  & .bg-content-groups-01__text, & .bg-content-groups-01__closing, & .bg-content-groups-01__item-text { margin: 0; font-size: var(--text-m); line-height: 1.45; color: var(--relative-text-color, var(--text-color)); }
  & .bg-content-groups-01__list { display: grid; margin: 0; padding: 0; list-style: none; }
  & .bg-content-groups-01__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-s); align-items: start; padding-block: var(--space-s); margin: 0; }
  & .bg-content-groups-01__item + .bg-content-groups-01__item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  & .bg-content-groups-01__item:first-child { padding-block-start: 0; }
  & .bg-content-groups-01__item:last-child { padding-block-end: 0; }
  & .bg-content-groups-01__tick { display: grid; place-items: center; inline-size: 1.25em; block-size: 1.25em; margin-block-start: 0.1em; border-radius: var(--radius-circle); background: var(--relative-link-color, var(--primary)); color: var(--bg-decoration-surface, var(--text-light)); font-weight: 700; line-height: 1; }
  & .bg-content-groups-01__item-text strong, & .bg-content-groups-01__closing strong { color: var(--relative-heading-color, var(--heading-color)); }
  @container (inline-size < 48rem) {
    .bg-content-groups-01__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-l); }
  }

  /* Optional separate cards in the right column, e.g. CIS status guidance. */
  & .bg-content-groups-01__panel[data-layout="cards"] { padding: 0; border: 0; border-radius: 0; background: transparent; }
  & .bg-content-groups-01__cards { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
  & .bg-content-groups-01__card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); margin: 0; padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  & .bg-content-groups-01__card:not(:has(.bg-icon)) { grid-template-columns: minmax(0, 1fr); }
  & .bg-content-groups-01__card-copy { display: grid; gap: 0; min-inline-size: 0; }
  & .bg-content-groups-01__card-title { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.25; }

  &[data-columns="50-50"] { --bg-content-groups-01-columns: minmax(0, 1fr) minmax(0, 1fr); }

  /* Optional unboxed checklist, used by Tax Healthcheck. Existing panel/card layouts retain their styling. */
  &[data-right-layout="compact"] .bg-content-groups-01__grid { align-items: start; }
  & .bg-content-groups-01__panel[data-layout="compact"] { padding: 0; border: 0; border-radius: 0; background: transparent; }
  & .bg-content-groups-01__panel[data-layout="compact"] .bg-content-groups-01__list { gap: var(--space-s); }
  & .bg-content-groups-01__panel[data-layout="compact"] .bg-content-groups-01__item { padding-block: 0; border-block-start: 0; }
  @container (inline-size >= 48rem) {
    .bg-content-groups-01__panel[data-layout="compact"][data-list-columns="2"] .bg-content-groups-01__list { position: relative; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-m); }
    .bg-content-groups-01__panel[data-layout="compact"][data-list-columns="2"] .bg-content-groups-01__list::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 50%; border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); pointer-events: none; }
  }
  & .bg-content-groups-01__panel > * + * { margin-block-start: var(--space-m); }
  & .bg-content-groups-01__intro + .bg-content-groups-01__text,
  & .bg-content-groups-01__card-title + .bg-content-groups-01__text { margin-block-start: var(--paragraph-spacing); }
}
.bg-comparison {
  --bg-comparison-panel-radius: var(--radius);
  --bg-comparison-problem-border: color-mix(in oklch, var(--heading-color) 12%, transparent);
  --bg-comparison-benefit-border: color-mix(in oklch, var(--text-light) 18%, transparent);

  container-type: inline-size;

  & .bg-comparison__container {
    display: grid;
    gap: var(--space-l);
  }



  & .bg-comparison__panels {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-l);
  }

  & .bg-comparison__panel {
    display: flex;
    flex-direction: column;
    min-block-size: 100%;
    padding: var(--space-xl);
    overflow: hidden;
    border-radius: var(--bg-comparison-panel-radius);
  }

  & .bg-comparison__panel--problems {
    border: 1px solid var(--bg-comparison-problem-border);
    box-shadow: var(--box-shadow-2);
  }

  & .bg-comparison__panel--benefits {
    position: relative;
    border: 1px solid var(--bg-comparison-benefit-border);
  }

  & .bg-comparison__panel--benefits::before {
    content: '';
    position: absolute;
    inset-block-start: calc(var(--space-xl) * -1.5);
    inset-inline-end: calc(var(--space-xl) * -1.5);
    inline-size: clamp(10rem, 22cqi, 16rem);
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    pointer-events: none;
  }

  & .bg-comparison__panel-head,
  & .bg-comparison__list,
  & .bg-comparison__panel-footer {
    position: relative;
    z-index: 1;
  }

  & .bg-comparison__panel-head {
    display: grid;
    gap: 0;
  }

  & .bg-comparison__eyebrow,
  & .bg-comparison__lede,
  & .bg-comparison__item p,
  & .bg-comparison__panel-footer p {
    margin: 0;
  }

  & .bg-comparison__eyebrow {
    display: inline-flex;
    inline-size: fit-content;
    align-items: center;
    gap: var(--space-3xs, 0.35rem);
    min-block-size: 2rem;
    padding-inline: var(--space-s);
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  & .bg-comparison__eyebrow--problems {
    background: var(--bg-secondary-soft);
    color: var(--secondary-semi-dark);
  }

  & .bg-comparison__eyebrow--benefits {
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    color: var(--bg-brand-accent, var(--primary));
  }

  & .bg-comparison__separator {
    white-space: pre-wrap;
  }

  & .bg-comparison__eyebrow-icon {
    align-self: center;
    color: inherit;
  }

  & .bg-comparison__title {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2em;
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h3);
    line-height: 1.12;
    text-wrap: balance;
  }

  & .bg-comparison__title em {
    color: var(--bg-brand-accent, var(--primary));
    font-style: normal;
  }

  & .bg-comparison__lede {
    max-inline-size: 48ch;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-comparison__list {
    display: grid;
    margin-block: var(--space-l) 0;
    padding: 0;
    list-style: none;
  }

  & .bg-comparison__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-s);
    align-items: start;
    padding-block: var(--space-s);
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  & .bg-comparison__item:first-child {
    padding-block-start: 0;
  }

  /* The footer supplies the single final divider for each panel. */
  & .bg-comparison__item:last-child {
    border-block-end: 0;
  }

  & .bg-comparison__marker {
    display: grid;
    place-items: center;
    inline-size: 1.875rem;
    block-size: 1.875rem;
    border-radius: var(--radius);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1;
  }

  & .bg-comparison__marker--problem {
    background: var(--bg-secondary-soft);
    color: var(--secondary-semi-dark);
  }

  & .bg-comparison__marker--benefit {
    background: var(--relative-link-color, var(--primary));
    color: var(--bg-decoration-surface, var(--text-light));
  }

  & .bg-comparison__item p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.5;
    text-wrap: pretty;
  }

  & .bg-comparison__item strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 800;
  }


  & .bg-comparison__panel-footer {
    margin-block-start: auto;
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  & .bg-comparison__panel-footer p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-comparison__panel-footer strong {
    color: var(--bg-brand-accent, var(--primary));
    font-weight: 800;
  }

  & .bg-comparison__panel--problems .bg-comparison__panel-footer strong {
    color: var(--secondary-semi-dark);
  }


  & .bg-comparison__versus {
    position: absolute;
    z-index: 2;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    display: grid;
    place-items: center;
    inline-size: 4rem;
    block-size: 4rem;
    border: 0.25rem solid var(--body-bg-color);
    border-radius: var(--radius-circle);
    background: var(--base);
    color: var(--text-light);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.08em;
    transform: translate(-50%, -50%);
  }

  & .bg-comparison__cta {
    display: flex;
    justify-content: center;
  }

  @container (inline-size < 66rem) {
    .bg-comparison__panel {
      padding: var(--space-l);
    }
  }

  @container (inline-size < 52rem) {
    .bg-comparison__panels {
      grid-template-columns: 1fr;
      gap: var(--space-m);
    }

    .bg-comparison__versus {
      display: none;
    }
  }

  @container (inline-size < 32rem) {
    .bg-comparison__panel {
      padding: var(--space-m);
      border-radius: var(--radius);
    }

    .bg-comparison__eyebrow {
      font-size: 0.625rem;
    }
  }
  & .bg-comparison__panel-head > * + * { margin-block-start: var(--space-s); }
  & .bg-comparison__title + .bg-comparison__lede { margin-block-start: var(--paragraph-spacing); }
}
.bg-reviews-process {
  /* General Section and SectionHeader own section spacing and the introduction. */
  container: reviews-process / inline-size;
  display: grid;
  gap: var(--space-l);

  .bg-reviews-process__flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: var(--space-l); padding: var(--space-l); margin: 0; list-style: none; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-reviews-process__stage { position: relative; display: grid; justify-items: center; gap: var(--space-s); min-inline-size: 0; text-align: center; }
  .bg-reviews-process__icon { position: relative; display: grid; place-items: center; inline-size: 6rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-reviews-process__stage-number { position: absolute; inset-block-start: -.5em; inset-inline-start: -.5em; display: grid; place-items: center; inline-size: 1.8em; aspect-ratio: 1; border-radius: var(--radius-circle); font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-process__glyph { display: block; inline-size: 50%; block-size: 50%; }
  .bg-reviews-process__stage-label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.4; text-wrap: balance; }
  .bg-reviews-process__arrow { position: absolute; inset-block-start: 2.25rem; inset-inline-end: calc(-.75rem - var(--space-l) / 2); inline-size: 1.5rem; block-size: 1.5rem; color: var(--relative-text-color, var(--text-color)); }

  .bg-reviews-process__details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-l); padding: 0; margin: 0; list-style: none; }
  .bg-reviews-process__detail { gap: var(--space-s); }
  .bg-reviews-process__number { color: var(--relative-link-color, var(--primary)); font-size: var(--h2); font-weight: 700; line-height: 1; }
  .bg-reviews-process__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.25; text-wrap: balance; }
  .bg-reviews-process__copy { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }

  @container reviews-process (inline-size < 54rem) {
    .bg-reviews-process__details { grid-template-columns: minmax(0, 1fr); }
  }
  @container reviews-process (inline-size < 48rem) {
    .bg-reviews-process__flow { grid-template-columns: minmax(0, 1fr); padding: var(--space-m); }
    .bg-reviews-process__stage { grid-template-columns: auto minmax(0, 1fr); align-items: center; justify-items: start; gap: var(--space-m); text-align: start; }
    .bg-reviews-process__icon { inline-size: 4.5rem; }
    .bg-reviews-process__stage-label { text-wrap: pretty; }
    .bg-reviews-process__arrow { inset-block-start: auto; inset-block-end: calc(var(--space-l) * -.75); inset-inline-start: 1.5rem; inset-inline-end: auto; rotate: 90deg; }
  }

/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-process__icon:not(.surface-primary, .surface-secondary), .bg-reviews-process__stage-number:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-process__icon:is(.surface-primary, .surface-secondary), .bg-reviews-process__stage-number:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

/* A neutral rim separates the marker even when both brand colours match. */
.bg-reviews-process__stage-number { outline: 3px solid var(--white); }

}
.bg-cta-01 {
  container-type: inline-size;

  & .bg-cta-01__panel {
    display: grid;
    grid-template-columns: minmax(0, 30rem) minmax(0, 1fr);
    gap: var(--space-xl);
    padding: clamp(var(--space-l), 5cqi, var(--space-xxl));
    border: 1px solid var(--primary-light);
    box-shadow: 0 var(--space-xs) var(--space-l) color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
  }

  & .bg-cta-01__content {
    display: grid;
    align-content: start;
    justify-items: start;
    gap: var(--space-m);
    padding-block: var(--space-s);
  }

  & .bg-cta-01__head {
    max-inline-size: 43ch;
  }



  & .bg-cta-01__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
    margin-block-start: var(--space-xs);
  }

  & .bg-cta-01__reassurance {
    display: flex;
    align-items: flex-start;
    gap: var(--space-xs);
    max-inline-size: 43ch;
    margin: var(--space-xs) 0 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.5;
  }

  & .bg-cta-01__reassurance .bg-icon {
    flex: 0 0 auto;
  }

  & .bg-cta-01__role {
    padding: var(--space-l);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

  & .bg-cta-01__role-head {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-block-end: 0;
  }

  & .bg-cta-01__role-mark {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: var(--icon-size-l);
    block-size: var(--icon-size-l);
    border-radius: var(--radius-circle);
    font-family: Georgia, serif;
    font-size: var(--text-l);
    font-weight: 700;
    font-style: italic;
  }

  & .bg-cta-01__role-head h3,
  & .bg-cta-01__notice h4 {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.3;
  }

  & .bg-cta-01__role-list {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  & .bg-cta-01__role-intro {
    margin: 0 0 var(--space-s);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.5;
  }

  & .bg-cta-01__role-item,
  & .bg-cta-01__notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-s);
    padding-block: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

  & .bg-cta-01__role-item .bg-icon,
  & .bg-cta-01__notice-icon .bg-icon {
    margin-block-start: 0.15em;
  }

  & .bg-cta-01__role-content,
  & .bg-cta-01__notice-content {
    margin: 0;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.5;
  }

  & .bg-cta-01__role-content :where(p, ul, ol),
  & .bg-cta-01__notice-content :where(p, ul, ol) {
    margin: 0;
  }

  & .bg-cta-01__role-content :where(p, ul, ol) + :where(p, ul, ol),
  & .bg-cta-01__notice-content :where(p, ul, ol) + :where(p, ul, ol) {
    margin-block-start: var(--paragraph-spacing);
  }

  & .bg-cta-01__role-content :where(ul, ol),
  & .bg-cta-01__notice-content :where(ul, ol) {
    padding-inline-start: var(--space-m);
  }

  & .bg-cta-01__notice {
    padding-block-end: 0;
  }

  & .bg-cta-01__notice-content {
    display: grid;
    gap: 0;
  }

  @container (inline-size < 68rem) {
    & .bg-cta-01__panel {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }
  }

  @container (inline-size < 32rem) {
    & .bg-cta-01__panel,
    & .bg-cta-01__role {
      padding: var(--space-m);
    }

    & .bg-cta-01__actions {
      display: grid;
      inline-size: 100%;
    }

    & .bg-cta-01__actions .bg-button {
      inline-size: 100%;
      justify-content: center;
    }
  }& .bg-cta-01__placeholder { border-radius: var(--radius); }
  & .bg-cta-01__role-head + .bg-cta-01__role-intro,
  & .bg-cta-01__notice-content > :is(h3, h4) + p { margin-block-start: var(--paragraph-spacing); }
}
.bg-hero--visual-mini-checklist {
  &.surface-primary {
  --bg-hero-accent: var(--primary-light);
  position: relative;
  isolation: isolate;
  overflow-x: clip;

  .bg-hero__mini-checklist {
    --bg-hero-mini-card-surface: var(--surface-background-color, var(--surface-1-background-color));
  }

  .bg-hero__mini-checklist-item {
    align-items: start;
  }

  .bg-hero__mini-checklist-art {
    --bg-hero-mini-art-primary: var(--primary);
    --bg-hero-mini-art-primary-deep: var(--primary-semi-dark);
    --bg-hero-mini-art-detail: var(--primary-light);
    --bg-hero-mini-art-cloud: color-mix(in srgb, var(--white) 85%, var(--primary));
    --bg-hero-mini-art-line: var(--primary-dark);
    --bg-hero-mini-art-surface: var(--surface-1-background-color);
    --bg-hero-mini-art-heading: var(--text-dark);
  }
}


}
.bg-content-list-05 {
  --bg-content-list-05-card-surface: color-mix(in oklch, var(--bg-decoration-surface, var(--body-bg-color)) 98%, var(--relative-heading-color, var(--heading-color)));
  --bg-content-list-05-card-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);

  container-type: inline-size;

  & .bg-content-list-05__container {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    align-items: start;
    gap: var(--space-xl);
  }

  & .bg-content-list-05__intro {
    display: grid;
    align-content: start;
    gap: var(--space-m);
    max-inline-size: 35rem;
  }




  & .bg-content-list-05__reassurance {
    padding: var(--space-m);
    border: 1px solid var(--bg-content-list-05-card-border);
    border-radius: var(--radius);
    background: var(--bg-content-list-05-card-surface);
  }

  & .bg-content-list-05__reassurance p,
  & .bg-content-list-05__list-label,
  & .bg-content-list-05__item p {
    margin: 0;
  }

  & .bg-content-list-05__reassurance p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-l);
    line-height: 1.6;
    text-wrap: pretty;
  }

  & .bg-content-list-05__reassurance strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 700;
  }

  & .bg-content-list-05__list-wrap {
    display: grid;
    gap: var(--space-s);
  }

  & .bg-content-list-05__list-label {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.4;
  }

  & .bg-content-list-05__list {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    counter-reset: bg-content-list-05-item;
    list-style: none;
  }

  & .bg-content-list-05__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: var(--space-s);
    min-block-size: 5.625rem;
    padding: var(--space-m);
    border: 1px solid var(--bg-content-list-05-card-border);
    border-radius: var(--radius);
    background: var(--bg-content-list-05-card-surface);
    counter-increment: bg-content-list-05-item;
  }

  & .bg-content-list-05__number {
    display: grid;
    place-items: center;
    inline-size: 2.5rem;
    block-size: 2.5rem;
    border-radius: var(--radius);
    background: var(--bg-secondary-soft);
    color: var(--secondary-semi-dark);
    font-size: var(--text-s);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
  }

  & .bg-content-list-05__number::before {
    content: counter(bg-content-list-05-item, decimal-leading-zero);
  }

  & .bg-content-list-05__item p {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.45;
    text-wrap: pretty;
  }

  @container (inline-size < 60rem) {
    .bg-content-list-05__container {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }

    .bg-content-list-05__intro {
      max-inline-size: 42.5rem;
    }
  }

  @container (inline-size < 42rem) {
    .bg-content-list-05__list {
      grid-template-columns: 1fr;
    }

    .bg-content-list-05__item {
      min-block-size: auto;
      padding: var(--space-s) var(--space-m);
    }
  }
}
.bg-reviews-benefits {
  

  /* General Section owns the two columns, proportions and stacking. SectionHeader owns the heading. */
  min-inline-size: 0;

  &.bg-reviews-benefits__dashboard { margin: 0; padding: var(--space-xs); border-radius: var(--radius); box-shadow: var(--box-shadow-2); }
  .bg-reviews-benefits__screen { overflow: hidden; border-radius: var(--radius); container: reviews-dashboard / inline-size; }
  .bg-reviews-benefits__dashboard-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-reviews-benefits__dashboard-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); }
  .bg-reviews-benefits__platforms { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
  .bg-reviews-benefits__platform { padding: .3em .6em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-benefits__dashboard-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); }
  .bg-reviews-benefits__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xs); margin: 0; padding: 0; }
  .bg-reviews-benefits__stat { padding: var(--space-xs); border-radius: var(--radius); }
  .bg-reviews-benefits__stat-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.4; }
  .bg-reviews-benefits__stat-value { display: flex; align-items: center; gap: .25em; margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); font-weight: 700; line-height: 1.4; }
  .bg-reviews-benefits__stat-value--positive { color: var(--primary); }
  .bg-reviews-benefits__small-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-reviews-benefits__chart { display: grid; gap: var(--space-xs); }
  .bg-reviews-benefits__bars { display: flex; align-items: end; gap: var(--space-xs); block-size: 8rem; border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-reviews-benefits__bar { flex: 1; min-inline-size: 0; block-size: 22%; border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); background: color-mix(in oklch, var(--primary) 22%, var(--body-bg-color)); }
  .bg-reviews-benefits__bar:nth-child(2) { block-size: 30%; }
  .bg-reviews-benefits__bar:nth-child(3) { block-size: 26%; background: var(--tertiary); }
  .bg-reviews-benefits__bar:nth-child(4) { block-size: 48%; background: color-mix(in oklch, var(--primary) 45%, var(--body-bg-color)); }
  .bg-reviews-benefits__bar:nth-child(5) { block-size: 64%; background: color-mix(in oklch, var(--primary) 70%, var(--body-bg-color)); }
  .bg-reviews-benefits__bar:nth-child(6) { block-size: 78%; background: var(--primary); }
  .bg-reviews-benefits__bar:nth-child(7) { block-size: 96%; background: var(--secondary); }
  .bg-reviews-benefits__review { display: grid; gap: var(--space-xs); padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-reviews-benefits__review-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs); font-size: var(--text-s); color: var(--relative-heading-color, var(--heading-color)); }
  /* Rating stars intentionally keep the fixed review-gold colour. */
  .bg-reviews-benefits__stars { display: inline-flex; gap: .12em; color: var(--bg-review-stars-color); }
  .bg-reviews-benefits__star { display: inline-block; inline-size: 1em; block-size: 1em; color: var(--bg-review-stars-color); fill: currentColor; }
  .bg-reviews-benefits__stat-value > .bg-reviews-benefits__star { inline-size: .55em; block-size: .55em; }
  .bg-reviews-benefits__sample-copy { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-reviews-benefits__reply { display: grid; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }
  .bg-reviews-benefits__reply-label { display: flex; align-items: center; gap: .5em; color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
  .bg-reviews-benefits__reply-icon { flex-shrink: 0; inline-size: 1.5em; block-size: 1.5em; }
  /* Static dashboard controls are illustrative labels, not interactive buttons. */
  .bg-reviews-benefits__sample-actions { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
  .bg-reviews-benefits__sample-action { padding: .5em .75em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; }

  &.bg-reviews-benefits__features { display: grid; gap: var(--space-s); list-style: none; margin: 0; padding: 0; }
  .bg-reviews-benefits__feature { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }
  .bg-reviews-benefits__icon { display: grid; place-items: center; inline-size: 2.75rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-reviews-benefits__glyph { inline-size: 55%; block-size: 55%; }
  .bg-reviews-benefits__feature-copy { display: grid; gap: var(--space-xs); }
  .bg-reviews-benefits__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.3; text-wrap: pretty; }
  .bg-reviews-benefits__copy, .bg-reviews-benefits__feature-copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }

  @container reviews-dashboard (inline-size < 24rem) {
    .bg-reviews-benefits__stats { gap: var(--space-xs); }
    .bg-reviews-benefits__stat { padding: var(--space-xs); }
    .bg-reviews-benefits__dashboard-body, .bg-reviews-benefits__review, .bg-reviews-benefits__reply { padding: var(--space-xs); }
  }
  /* Keep the illustration's statistics readable inside a narrow component column. */
  @container reviews-dashboard (inline-size < 20rem) {
    .bg-reviews-benefits__stats { grid-template-columns: minmax(0, 1fr); }
    .bg-reviews-benefits__stat { display: flex; align-items: center; justify-content: space-between; gap: var(--space-xs); }
  }

/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-benefits__icon:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-benefits__icon:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

}
.bg-nav {
  min-inline-size: 0;
}
.bg-start {
  container-type: inline-size;

  --bg-start-action-icon-size: var(--icon-size-s);
  --bg-start-blob-size: 13.125rem;

  .bg-start__container {
    display: grid;
    gap: var(--space-xl);
  }

  .bg-start__packages {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
    align-items: start;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-start__item {
    display: grid;
    align-items: start;
    min-inline-size: 0;
  }

  .bg-start__packages > :only-child {
    grid-column: 1 / -1;
    justify-self: center;
    inline-size: min(100%, 75%);
  }

  .bg-start__package {
    position: relative;
    overflow: hidden;
    display: grid;
    align-content: stretch;
    justify-items: start;
    gap: var(--space-s);
    inline-size: 100%;
    min-inline-size: 0;
    padding: var(--space-l);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-start__tag {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    inline-size: fit-content;
    max-inline-size: 100%;
    padding: calc(var(--space-xs) / 2) var(--space-xs);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;
    text-transform: uppercase;
  }

  .bg-start__tag::before {
    content: '';
    inline-size: 0.35em;
    block-size: 0.35em;
    border-radius: var(--radius-circle);
    background: currentColor;
  }

  .bg-start__title {
    position: relative;
    z-index: 1;
    font-size: var(--h3);
  }

  .bg-start__price-row {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-xs);
  }

  .bg-start__price {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: calc(var(--h1) * 1.2);
    font-weight: 800;
    line-height: 1;
    overflow-wrap: anywhere;
  }

  .bg-start__price-note {
    display: grid;
    gap: calc(var(--space-xs) / 4);
    padding-block-end: calc(var(--space-xs) / 2);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .bg-start__price-note > :first-child {
    color: var(--relative-text-color, var(--text-color));
    font-weight: 700;
    text-transform: none;
  }

  .bg-start__price-note > :last-child {
    color: var(--bg-brand-accent, var(--primary));
  }

  .bg-start__copy {
    position: relative;
    z-index: 1;
    font-size: var(--text-m);
  }

  .bg-start__disclosure {
    position: relative;
    z-index: 1;
    inline-size: 100%;
  }

  .bg-start__details {
    position: relative;
    z-index: 1;
    padding-block-start: var(--space-s);
  }

  .bg-start__details-title {
    /* Separate the disclosure heading from its inclusion list. */
    margin-block-end: var(--space-s);
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-start__package--accent .bg-start__details-title {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-start__details p {
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-start__details .bg-start__terms-note {
    margin-block-start: var(--space-s);
  }

  .bg-start__detail-list {
    --list-marker-size: 1.375rem;
    --list-marker-gap: var(--space-xs);
    --list-marker-offset-y: calc((1lh - var(--list-marker-size)) / 2);
    --list-marker-colour: var(--bg-ultra-light-link);
    --list-marker-tick-colour: var(--bg-ultra-light);

    display: grid;
    gap: var(--space-xs);
    margin: 0;
    padding-inline-start: calc(var(--list-marker-size) + var(--list-marker-gap));
    font-size: calc(var(--text-s) * 1.1);
    line-height: 1.45;
  }

  .bg-start__detail-list strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 800;
  }

  .bg-start__detail-list + .bg-start__emphasis {
    margin-block-start: var(--space-s);
  }

  .bg-start__emphasis {
    color: var(--bg-brand-accent, var(--primary));
    font-style: italic;
    font-weight: 800;
  }

  .bg-start__package--accent .bg-start__emphasis {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-start__action {
    position: relative;
    z-index: 1;
    justify-self: end;
    max-inline-size: 100%;
  }

  .bg-start__read-more [data-icon] {
    inline-size: var(--bg-start-action-icon-size);
    block-size: var(--bg-start-action-icon-size);
    flex-shrink: 0;
  }

  .bg-start__read-more {
    display: inline-flex;
    min-block-size: 2.75rem;
    list-style: none;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--bg-brand-accent, var(--primary));
    font: inherit;
    font-size: var(--text-s);
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
  }

  .bg-start__read-more::-webkit-details-marker {
    display: none;
  }

  .bg-start__read-more:focus-visible {
    outline: var(--focus-width) solid currentColor;
    outline-offset: var(--focus-offset);
  }

  .bg-start__read-less-label,
  .bg-start__disclosure[open] .bg-start__read-more-label {
    display: none;
  }

  .bg-start__disclosure[open] .bg-start__read-less-label {
    display: inline;
  }

  .bg-start__read-more svg {
    transition: transform 0.2s ease;
  }

  .bg-start__disclosure[open] .bg-start__read-more svg {
    transform: rotate(180deg);
  }

  .bg-start__read-more svg path {
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-start__blob {
    position: absolute;
    z-index: 0;
    pointer-events: none;
    border-radius: var(--radius-circle);
  }

  .bg-start__blob--primary {
    inset-block-start: calc(var(--bg-start-blob-size) * -0.42);
    inset-inline-end: calc(var(--bg-start-blob-size) * -0.25);
    inline-size: var(--bg-start-blob-size);
    block-size: var(--bg-start-blob-size);
    background: var(--bg-brand-accent, var(--primary));
    opacity: 0.08;
  }

  .bg-start__blob--accent {
    inset-block-start: calc(var(--bg-start-blob-size) * -0.42);
    inset-inline-end: calc(var(--bg-start-blob-size) * -0.22);
    inline-size: var(--bg-start-blob-size);
    block-size: var(--bg-start-blob-size);
    background: var(--secondary);
    opacity: 0.12;
  }

  @media (prefers-reduced-motion: reduce) {
    .bg-start__read-more svg {
      transition: none;
    }
  }

  @container (inline-size < 48rem) {
    .bg-start__packages {
      grid-template-columns: var(--grid-1);
    }

    .bg-start__packages > :only-child {
      inline-size: 100%;
    }
  }

  @container (inline-size < 34rem) {
    .bg-start__package {
      padding: var(--space-m);
    }

    .bg-start__price-row {
      align-items: start;
      flex-direction: column;
      gap: calc(var(--space-xs) / 2);
    }

    .bg-start__price-note {
      padding-block-end: 0;
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */
  .bg-start__package.bg--ultra-light {
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

/* The Second Opinion badge uses the native Secondary Surface. */
.bg-start__tag.bg-start__tag--accent {
  border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}

/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-start__package.bg-start__package--accent {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
}

/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
.bg-start__tag.bg--light {
  --relative-text-color: var(--bg-soft-primary-text);
  --relative-heading-color: var(--bg-soft-primary-text);
  --icon-color: var(--bg-soft-primary-text);
  color: var(--relative-text-color);
}

}
.bg-beangrower-ai-connected-core {
  min-inline-size: 0;

  .bg-beangrower-ai-connected-core__footer p {
    color: var(--primary);
  }

  .bg-beangrower-ai-connected-core__platform {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(9.375rem, .95fr) repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 0.875rem;
  }

  .bg-beangrower-ai-connected-core__tool {
    position: relative;
    display: grid;
    align-content: start;
    justify-items: center;
    gap: var(--space-xs);
    min-inline-size: 0;
    padding: 0.875rem 0.625rem;
    border: 1px solid var(--bg-connected-core-border);
    border-radius: var(--radius);
    text-align: center;
  }

  .bg-beangrower-ai-connected-core__tool--primary { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); --bg-connected-core-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-connected-core__tool--secondary { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); --bg-connected-core-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-connected-core__tool--tertiary { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); --bg-connected-core-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-connected-core__tool--accent { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); --bg-connected-core-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-connected-core__tool-icon,
  .bg-beangrower-ai-connected-core__step > span {
    display: inline-grid;
    place-items: center;
    border-radius: var(--radius);
    background: var(--bg-connected-core-surface);
    color: var(--bg-connected-core-text);
  }

  .bg-beangrower-ai-connected-core__tool-icon {
    inline-size: 3.875rem;
    block-size: 3.875rem;
  }

  .bg-beangrower-ai-connected-core__tool-icon svg,
  .bg-beangrower-ai-connected-core__core-icon svg,
  .bg-beangrower-ai-connected-core__step svg {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-beangrower-ai-connected-core__tool-icon svg {
    inline-size: 2.5rem;
    block-size: 2.5rem;
    stroke-width: 1.7;
  }

  .bg-beangrower-ai-connected-core__tool h3 {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-s);
    line-height: 1.2;
  }

  .bg-beangrower-ai-connected-core__tool p {
    font-size: var(--text-s);
    line-height: 1.42;
  }

  .bg-beangrower-ai-connected-core__tool::after {
    position: absolute;
    inset-block-end: -0.4375rem;
    inset-inline-start: 50%;
    inline-size: 0.875rem;
    block-size: 0.875rem;
    border: 2px solid var(--body-bg-color);
    border-radius: var(--radius-circle);
    background: var(--bg-connected-core-text);
    content: '';
    transform: translateX(-50%);
  }

  .bg-beangrower-ai-connected-core__core {
    position: relative;
    display: grid;
    grid-template-rows: auto auto;
    align-content: center;
    justify-items: center;
    align-self: center;
    gap: 0.25rem;
    --bg-connected-core-core-size: clamp(9.375rem, 11cqi, 11.25rem);
    box-sizing: border-box;
    inline-size: var(--bg-connected-core-core-size);
    block-size: var(--bg-connected-core-core-size);
    min-inline-size: 0;
    min-block-size: 0;
    justify-self: center;
    padding: var(--space-s);
    border: 0.75rem solid color-mix(in srgb, var(--bg-primary-soft) 75%, transparent);
    border-radius: var(--radius-circle);
    text-align: center;
  }

  .bg-beangrower-ai-connected-core__core::before {
    position: absolute;
    inset-block-end: calc(100% + 0.9375rem);
    inset-inline-start: 50%;
    block-size: 3rem;
    border-inline-start: 2px dashed var(--primary-light);
    content: '';
    transform: translateX(-50%);
  }

  .bg-beangrower-ai-connected-core__core::after {
    position: absolute;
    inset-block-start: -1.25rem;
    inset-inline-start: 50%;
    inline-size: 0;
    block-size: 0;
    border-inline: 0.375rem solid transparent;
    border-block-start: 0.5rem solid var(--primary-light);
    content: '';
    transform: translateX(-50%);
  }

  .bg-beangrower-ai-connected-core__core-icon {
    display: grid;
    place-items: center;
    inline-size: 3.25rem;
    block-size: 3.25rem;
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-beangrower-ai-connected-core__core-icon svg { inline-size: 3.125rem; block-size: 3.125rem; fill: currentColor; stroke: none; }

  .bg-beangrower-ai-connected-core__core strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.05; letter-spacing: -0.04em; }

  .bg-beangrower-ai-connected-core__core p { position: absolute; z-index: 1; inset-block-start: calc(100% + var(--space-xs)); inline-size: max-content; max-inline-size: calc(100% + var(--space-l)); padding: 0.5rem var(--space-s); border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; }

  .bg-beangrower-ai-connected-core__connections { block-size: 4rem; margin-block-start: calc(var(--space-s) * -1); color: var(--primary-light); }

  .bg-beangrower-ai-connected-core__connections svg { display: block; inline-size: 100%; block-size: 100%; overflow: visible; }

  .bg-beangrower-ai-connected-core__connections path { fill: none; stroke: currentColor; stroke-dasharray: 2 6; stroke-linecap: round; stroke-width: 2; }

  .bg-beangrower-ai-connected-core__flow {
    display: grid;
    grid-template-columns: minmax(14.375rem, .8fr) minmax(0, 2.2fr);
    gap: var(--space-s);
    padding: var(--space-s);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-connected-core__flow-intro {
    display: grid;
    align-content: center;
    gap: 0.25rem;
  }

  .bg-beangrower-ai-connected-core__flow-intro > p {
    color: var(--primary);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  .bg-beangrower-ai-connected-core__flow h3 { font-size: var(--text-xl); line-height: 1; letter-spacing: -0.045em; }

  .bg-beangrower-ai-connected-core__flow-intro > span { font-size: var(--text-s); line-height: 1.5; }

  .bg-beangrower-ai-connected-core__steps {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-items: center;
    align-content: center;
    align-self: stretch;
    margin: 0;
    padding: var(--space-xs);
    border-radius: var(--radius);
    list-style: none;
  }

  .bg-beangrower-ai-connected-core__step {
    --bg-connected-core-surface: var(--bg-primary-soft);
    --bg-connected-core-text: var(--icon-color);
    position: relative;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.4375rem;
    min-inline-size: 0;
    padding-inline: 0.25rem;
    text-align: center;
  }

  .bg-beangrower-ai-connected-core__step--secondary { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); }

  .bg-beangrower-ai-connected-core__step--tertiary { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); }

  .bg-beangrower-ai-connected-core__step--accent { --bg-connected-core-surface: var(--bg-primary-soft); --bg-connected-core-text: var(--icon-color); }

  .bg-beangrower-ai-connected-core__step > span { inline-size: 2.875rem; block-size: 2.875rem; }

  .bg-beangrower-ai-connected-core__step svg { inline-size: 1.625rem; block-size: 1.625rem; stroke-width: 1.8; }

  .bg-beangrower-ai-connected-core__step strong { color: var(--heading-color); font-size: var(--text-s); line-height: 1.25; }

  .bg-beangrower-ai-connected-core__step:not(:last-child)::after {
    position: absolute;
    inset-block-start: calc(1.4375rem - .5em);
    inset-inline-end: 0;
    inline-size: 1em;
    color: var(--primary);
    content: '→';
    font-size: var(--text-l);
    font-weight: 700;
    line-height: 1;
    text-align: center;
    transform: translateX(50%);
  }

  .bg-beangrower-ai-connected-core__footer {
    display: grid;
    place-items: center;
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    border-radius: var(--radius);
    text-align: center;
  }

  .bg-beangrower-ai-connected-core__footer > div { max-inline-size: 53.125rem; }

  .bg-beangrower-ai-connected-core__footer h3 { font-size: var(--text-xl); line-height: 1.1; letter-spacing: -0.045em; }

  .bg-beangrower-ai-connected-core__footer p { margin-block-start: 0.25rem; font-size: var(--text-l); font-weight: 700; line-height: 1.3; }

  @container (inline-size < 80rem) {
    .bg-beangrower-ai-connected-core__platform { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bg-beangrower-ai-connected-core__core {
      grid-row: 2;
      grid-column: 2;
      justify-self: center;
      margin-block: var(--space-s) 6.5rem;
    }
    .bg-beangrower-ai-connected-core__core::before,
    .bg-beangrower-ai-connected-core__core::after { display: none; }
    .bg-beangrower-ai-connected-core__tool:nth-child(5) { grid-row: 3; grid-column: 1; }
    .bg-beangrower-ai-connected-core__tool:nth-child(6) { grid-row: 3; grid-column: 2; }
    .bg-beangrower-ai-connected-core__tool:nth-child(7) { grid-row: 3; grid-column: 3; }
    .bg-beangrower-ai-connected-core__connections { display: none; }
  }

  @container (inline-size < 58rem) {
    .bg-beangrower-ai-connected-core__flow { grid-template-columns: 1fr; }
    .bg-beangrower-ai-connected-core__steps { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: var(--space-m); }
    .bg-beangrower-ai-connected-core__step:nth-child(4)::after { display: none; }
  }

  @container (inline-size < 42rem) {
    .bg-beangrower-ai-connected-core__platform { grid-template-columns: 1fr; }
    .bg-beangrower-ai-connected-core__core {
      grid-row: auto;
      grid-column: auto;
      margin-block: var(--space-s) 6.5rem;
    }
    .bg-beangrower-ai-connected-core__tool:nth-child(5),
    .bg-beangrower-ai-connected-core__tool:nth-child(6),
    .bg-beangrower-ai-connected-core__tool:nth-child(7) { grid-row: auto; grid-column: auto; }
    .bg-beangrower-ai-connected-core__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-beangrower-ai-connected-core__step:nth-child(even)::after { display: none; }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  &.bg-beangrower-ai-connected-core__body { display: grid; row-gap: var(--space-m); }

  .bg-beangrower-ai-connected-core__tool-icon, .bg-beangrower-ai-connected-core__step > span { color: var(--icon-color); color-scheme: var(--icon-scheme); }
}
.bg-hero--editable-visual {
    /* A single native item structure; presentation matches the existing hero designs. */
  /* dashboard */
  &.bg-hero--visual-dashboard .bg-hero-visual__title,
  &.bg-hero--visual-dashboard .bg-hero-visual__headline,
  &.bg-hero--visual-dashboard .bg-hero-visual__note {
    margin: 0;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: clamp(0.55rem, 1.35cqi, 0.75rem);
    min-block-size: 0;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    min-block-size: 0;
    overflow: hidden;
    padding: clamp(0.62rem, 1.65cqi, 0.78rem);
    border: 0;
    border-radius: var(--bg-hero-visual-item-radius);
    background: color-mix(in srgb, var(--bg-hero-visual-accent-soft) 50%, var(--bg-hero-visual-surface));
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) {
    padding-block-end: clamp(0.42rem, 1.25cqi, 0.55rem);
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__title {
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 600;
    line-height: 1.2;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__headline {
    margin-block-start: 0.45rem;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: 0;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__headline {
    margin-block-start: 0.28rem;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__note {
    margin-block-start: 0.35rem;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__note {
    margin-block-start: 0.12rem;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--check) .bg-hero__dashboard-checkmark svg {
    inline-size: 52%;
    block-size: 52%;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.6;
  }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--check) .bg-hero__dashboard-checkmark svg path {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__items {
    gap: 0.45rem;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__item {
    padding: 0.5rem 0.6rem;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) {
    padding-block-end: 0.38rem;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.12;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__headline {
    margin-block-start: 0.3rem;
    font-size: var(--bg-hero-item-headline-size);
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__headline {
    margin-block-start: 0.22rem;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__note {
    margin-block-start: 0.2rem;
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.15;
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__note {
    margin-block-start: 0.1rem;
  }
  &.bg-hero--visual-dashboard.bg-hero--visual-dashboard .bg-hero-visual__item {
    overflow: hidden;
  }
  &.bg-hero--visual-dashboard.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--calendar) .bg-hero__dashboard-calendar {
    margin-block-start: auto;
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__items {
      gap: 0.45rem;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__item {
      padding: 0.5rem 0.6rem;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) {
      padding-block-end: 0.38rem;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__title {
      font-size: var(--bg-hero-item-title-size);
      line-height: 1.12;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__headline {
      margin-block-start: 0.3rem;
      font-size: var(--bg-hero-item-headline-size);
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__headline {
      margin-block-start: 0.22rem;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__note {
      margin-block-start: 0.2rem;
      font-size: var(--bg-hero-item-note-size);
      line-height: 1.15;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-dashboard.bg-hero.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__note {
      margin-block-start: 0.1rem;
    }
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__items {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(2, auto);
    }
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__headline {
      line-height: 1.04;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__items {
      grid-template-columns: 1fr;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__item {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: start;
      column-gap: var(--space-xs);
      row-gap: 0.2rem;
      min-block-size: 0;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__title {
      grid-column: 1;
      grid-row: 1;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__headline {
      grid-column: 1;
      grid-row: 2;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-dashboard .bg-hero-visual__note {
      grid-column: 1;
      grid-row: 3;
    }
  }
  /* checklist */
  &.bg-hero--visual-checklist .bg-hero-visual__title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.2;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__note {
    display: inline;
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__headline {
    font-size: var(--bg-hero-item-headline-size);
    line-height: 1.16;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__title,
  &.bg-hero--visual-checklist .bg-hero-visual__headline,
  &.bg-hero--visual-checklist .bg-hero-visual__note {
    margin: 0;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__items {
    display: grid;
    grid-template-rows: repeat(4, minmax(0, 1fr));
    min-block-size: 0;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.55rem;
    min-inline-size: 0;
    min-block-size: 0;
    overflow: hidden;
    padding-block: 0.3rem;
    border-block-end: 1px solid var(--bg-hero-visual-border, color-mix(in oklch, var(--bg-hero-visual-text) 14%, transparent));
  }
  /* Checklist uses a consistent tick; saved item icons remain available to other visuals. */
  &.bg-hero--visual-checklist .bg-hero-visual__icon {
    display: inline-grid;
    place-items: center;
    margin-block-start: max(0px, calc((var(--bg-hero-item-title-size) * 1.5 - 1.35rem) / 2));
    inline-size: 1.35rem;
    block-size: 1.35rem;
    border-radius: var(--radius-circle);
    background: var(--bg-hero-visual-accent-soft);
    color: var(--bg-hero-visual-accent-text);
  }
  &.bg-hero--visual-checklist .bg-hero-visual__icon .bg-hero-visual__glyph {
    display: none;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__icon::before {
    content: '';
    box-sizing: border-box;
    inline-size: 27%;
    block-size: 44%;
    border-inline-end: 0.125rem solid currentColor;
    border-block-end: 0.125rem solid currentColor;
    transform: translateY(-0.06rem) rotate(45deg);
  }
  &.bg-hero--visual-checklist .bg-hero-visual__copy {
    display: block;
    min-inline-size: 0;
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.5;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__title {
    display: inline;
    margin-inline-end: 0.35rem;
    min-inline-size: 0;
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 600;
    line-height: 1.15;
    overflow-wrap: break-word;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__title::after,
  &.bg-hero--visual-checklist .bg-hero-visual__headline::after {
    content: '';
  }
  &.bg-hero--visual-checklist .bg-hero-visual__headline {
    display: inline;
    margin-inline-end: 0.35rem;
    min-inline-size: 0;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 500;
    line-height: 1.15;
    overflow-wrap: break-word;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__note {
    display: inline;
    min-inline-size: 0;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
    overflow-wrap: break-word;
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-checklist .bg-hero-visual__item {
      gap: 0.45rem;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-checklist .bg-hero-visual__items {
      grid-template-rows: none;
      gap: 0.25rem;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-checklist .bg-hero-visual__item {
      align-items: start;
      min-block-size: auto;
      overflow: visible;
      padding-block: 0.5rem;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-checklist .bg-hero-visual__copy {
      display: block;
    }
  }
  @container (inline-size < 20rem) {
    &.bg-hero--visual-checklist .bg-hero-visual__title,
    &.bg-hero--visual-checklist .bg-hero-visual__headline,
    &.bg-hero--visual-checklist .bg-hero-visual__note {
      display: inline;
      margin-inline-end: 0;
    }
  }
  /* summary */
  &.bg-hero--visual-summary .bg-hero-visual__copy {
    min-inline-size: 0;
  }
  &.bg-hero--visual-summary .bg-hero-visual__title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.2;
  }
  &.bg-hero--visual-summary .bg-hero-visual__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
    gap: 0;
    margin-block: var(--space-xs);
    min-inline-size: 0;
  }
  &.bg-hero--visual-summary .bg-hero-visual__item {
    display: grid;
    grid-template-columns: var(--bg-hero-summary-icon-size) minmax(0, 1fr);
    align-items: center;
    gap: calc(var(--space-xs) / 2);
    min-inline-size: 0;
    padding: calc(var(--space-xs) * 0.6);
  }
  &.bg-hero--visual-summary .bg-hero-visual__item:nth-child(odd) {
    border-inline-end: 1px solid var(--bg-hero-summary-divider);
  }
  &.bg-hero--visual-summary .bg-hero-visual__item:nth-child(-n + 2) {
    border-block-end: 1px solid var(--bg-hero-summary-divider);
  }
  &.bg-hero--visual-summary .bg-hero-visual__icon {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-hero-summary-icon-size);
    block-size: var(--bg-hero-summary-icon-size);
    color: var(--bg-hero-visual-accent-text);
  }
  &.bg-hero--visual-summary .bg-hero-visual__copy {
    display: grid;
    gap: calc(var(--space-xs) / 3);
    min-inline-size: 0;
  }
  &.bg-hero--visual-summary .bg-hero-visual__title,
  &.bg-hero--visual-summary .bg-hero-visual__note,
  &.bg-hero--visual-summary .bg-hero-visual__headline {
    margin: 0;
    min-inline-size: 0;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }
  &.bg-hero--visual-summary .bg-hero-visual__title {
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 600;
  }
  &.bg-hero--visual-summary .bg-hero-visual__note {
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
  }
  &.bg-hero--visual-summary .bg-hero-visual__headline {
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 500;
    letter-spacing: 0;
  }
  &.bg-hero--visual-summary .bg-hero-visual__item:not(:has(.bg-hero-visual__icon)) {
    grid-template-columns: minmax(0, 1fr);
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-summary.bg-hero--visual-summary .bg-hero-visual__items {
      grid-template-columns: minmax(0, 1fr);
    }
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-summary.bg-hero--visual-summary .bg-hero-visual__item {
      border-inline-end: 0;
      border-block-end: 0;
    }
  }
  @container (inline-size < 37.5rem) {
    &.bg-hero--visual-summary.bg-hero--visual-summary .bg-hero-visual__item:not(:last-child) {
      border-block-end: 1px solid var(--bg-hero-summary-divider);
    }
  }
  /* process */
  &.bg-hero--visual-process .bg-hero-visual__copy {
    min-inline-size: 0;
  }
  &.bg-hero--visual-process .bg-hero-visual__title,
  &.bg-hero--visual-process .bg-hero-visual__headline,
  &.bg-hero--visual-process .bg-hero-visual__note {
    margin: 0;
  }
  &.bg-hero--visual-process .bg-hero-visual__number {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: var(--radius-circle);
    position: relative;
    z-index: 1;
    background: var(--bg-hero-visual-accent-soft);
    color: var(--bg-hero-visual-accent-text);
    font-size: calc(var(--text-s) * 1.08);
    font-weight: 600;
    line-height: 1;
  }
  &.bg-hero--visual-process .bg-hero-visual__items {
    display: grid;
    gap: var(--bg-hero-process-list-gap);
    min-block-size: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: bg-hero-process;
  }
  &.bg-hero--visual-process .bg-hero-visual__item {
    position: relative;
    display: grid;
    grid-template-columns: 2.95rem minmax(0, 1fr);
    align-items: start;
    gap: 0.85rem;
    min-inline-size: 0;
    min-block-size: 0;
    padding: var(--bg-hero-process-item-padding-block) 0;
    counter-increment: bg-hero-process;
  }
  &.bg-hero--visual-process .bg-hero-visual__number::before {
    content: counter(bg-hero-process);
  }
  &.bg-hero--visual-process .bg-hero-visual__title {
    display: inline;
    margin-inline-end: 0.4rem;
    color: var(--bg-hero-visual-text);
    font-size: var(--bg-hero-item-title-size);
    font-weight: 600;
    line-height: 1.15;
    overflow-wrap: break-word;
  }
  &.bg-hero--visual-process .bg-hero-visual__title::after,
  &.bg-hero--visual-process .bg-hero-visual__headline::after {
    content: '';
  }
  &.bg-hero--visual-process .bg-hero-visual__headline {
    display: inline;
    margin-inline-end: 0.4rem;
    color: var(--bg-hero-visual-accent);
    font-size: var(--bg-hero-item-headline-size);
    font-weight: 500;
    line-height: 1.16;
    overflow-wrap: break-word;
  }
  &.bg-hero--visual-process .bg-hero-visual__note {
    display: block;
    color: var(--bg-hero-visual-muted);
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.22;
    overflow-wrap: break-word;
  }
  &.bg-hero--visual-process .bg-hero__visual-shell--compact .bg-hero-visual__number {
    font-size: calc(var(--text-s) * 1.04);
  }
  &.bg-hero--visual-process .bg-hero__visual-shell--compact .bg-hero-visual__item {
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: 0.7rem;
    padding: var(--bg-hero-process-item-padding-block) 0;
  }
  &.bg-hero--visual-process.bg-hero.bg-hero--visual-process .bg-hero-visual__number {
    inline-size: var(--bg-hero-process-number-size);
    block-size: var(--bg-hero-process-number-size);
  }
  &.bg-hero--visual-process.bg-hero.bg-hero--visual-process .bg-hero-visual__item:not(:last-child)::after {
    content: '';
    position: absolute;
    z-index: 0;
    inset-block-start: calc(var(--bg-hero-process-item-padding-block) + var(--bg-hero-process-number-size));
    inset-block-end: calc(-1 * (var(--bg-hero-process-list-gap) + var(--bg-hero-process-item-padding-block)));
    inset-inline-start: calc(var(--bg-hero-process-number-size) / 2);
    block-size: auto;
    border-inline-start: 1px solid var(--bg-hero-visual-accent);
    opacity: 0.42;
    transform: translateX(-50%);
    pointer-events: none;
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-process.bg-hero.bg-hero--visual-process .bg-hero-visual__item {
      grid-template-columns: 2.25rem minmax(0, 1fr);
      gap: 0.7rem;
      padding: var(--bg-hero-process-item-padding-block) 0;
    }
  }
  @container (inline-size < 86rem) {
    &.bg-hero--visual-process.bg-hero.bg-hero--visual-process .bg-hero-visual__number {
      font-size: calc(var(--text-s) * 1.04);
    }
  }
  &.bg-hero--visual-process .bg-hero-visual__title {
    font-size: var(--bg-hero-item-title-size);
    line-height: 1.2;
  }
  &.bg-hero--visual-process .bg-hero-visual__note {
    display: block;
    font-size: var(--bg-hero-item-note-size);
    line-height: 1.25;
  }
  &.bg-hero--visual-process .bg-hero-visual__headline {
    font-size: var(--bg-hero-item-headline-size);
    line-height: 1.16;
  }
  /* Shared native content and design-specific decoration. */
  & .bg-hero-visual { display: contents; }
  & .bg-hero-visual__items { list-style: none; padding-inline-start: 0; }
  &.bg-hero--visual-checklist .bg-hero-visual__items { margin: 0; }
  & .bg-hero-visual__copy { min-inline-size: 0; }
  & .bg-hero-visual__title:empty,
  & .bg-hero-visual__headline:empty,
  & .bg-hero-visual__note:empty { display: none; }
  &:not(.bg-hero--visual-dashboard) .bg-hero-visual__decoration,
  &:not(.bg-hero--visual-process) .bg-hero-visual__number { display: none; }
  &.bg-hero--visual-process .bg-hero-visual__icon { display: none; }
  &.bg-hero--visual-summary .bg-hero-visual__note { grid-row: 2; }
  &.bg-hero--visual-summary .bg-hero-visual__headline { grid-row: 3; }
  &.bg-hero--visual-dashboard .bg-hero-visual__items { margin: 0; }
  &.bg-hero--visual-dashboard .bg-hero-visual__copy,
  &.bg-hero--visual-dashboard .bg-hero-visual__decoration { display: contents; }
  &.bg-hero--visual-dashboard .bg-hero-visual__icon,
  &.bg-hero--visual-dashboard .bg-hero__visual-footer { display: none; }
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__icon {
    display: grid; place-items: center; order: 4;
    inline-size: 2.75rem; block-size: 2.75rem; margin: auto auto 0;
    color: var(--bg-hero-visual-accent);
  }
  &.bg-hero--visual-dashboard .bg-hero__visual-shell--compact .bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) .bg-hero-visual__icon { inline-size: 2.55rem; block-size: 2.55rem; }

  /* Keep decorative calendar dots at their authored size in the canvas. */
  & .bg-hero-visual__decoration .bg-hero__dashboard-calendar span {
    min-inline-size: 0;
    min-block-size: 0;
  }

  /* Keep dashboard artwork after the text while its control is first in Structure. */
  &.bg-hero--visual-dashboard .bg-hero-visual__decoration > * { order: 4; }

  /* Text-only cards use the space otherwise occupied by dashboard artwork. */
  &.bg-hero--visual-dashboard .bg-hero-visual__item:has(.bg-hero-visual__decoration--metric) {
    justify-content: space-between;
  }

  /* Native visual icons: artwork is editable; the visual owns its presentation. */
  & .bg-hero-visual__glyph {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    color: inherit;
    stroke-width: var(--bg-hero-visual-icon-stroke, 1.9);
  }
  & .bg-hero-visual__glyph:not([fill]) { fill: currentColor; }
  & .bg-hero-visual__glyph :where(path, circle, rect, ellipse, line, polyline, polygon) {
    stroke-width: calc(var(--bg-hero-visual-icon-stroke, 1.9) * var(--bg-icon-stroke-ratio, 1));
    vector-effect: non-scaling-stroke;
  }
  & .bg-hero-visual__badge {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    inline-size: 1.75rem;
    block-size: 1.75rem;
    border-radius: var(--radius-circle);
    line-height: 1;
    vertical-align: middle;
  }
  & .bg-hero-visual__badge > .bg-hero-visual__glyph { inline-size: 72%; block-size: 72%; }
  & .bg-hero-visual__badge--header {
    inline-size: 4rem;
    block-size: 4rem;
    --bg-hero-visual-icon-stroke: 1.6;
  }
  &.bg-hero--visual-summary .bg-hero-visual__icon {
    border-radius: var(--radius-circle);
    background: var(--bg-hero-visual-accent-soft);
    color: var(--bg-hero-visual-accent-text);
  }

  /* Optional mini-checklist text should not leave an empty heading or badge. */
  & .bg-hero__mini-checklist-title:empty,
  & .bg-hero__mini-checklist-trust:not(:has(p:not(:empty))) { display: none; }

  /* Let longer CTA labels wrap within the hero at narrow widths. */
  & .bg-hero__actions { min-inline-size: 0; max-inline-size: 100%; }
  & .bg-hero__actions .bg-button-wrap { min-inline-size: 0; max-inline-size: 100%; }
  & .bg-hero__actions .bg-button { max-inline-size: 100%; }

  & .bg-hero__content { min-inline-size: 0; max-inline-size: 100%; }

  /* Shared hierarchy; each visual retains its own layout. */
  & .bg-hero__visual-title { font-weight: 700; color: var(--bg-hero-visual-text); }
  & .bg-hero__visual-subtitle,
  & .bg-hero__visual-footer-text { color: var(--bg-hero-visual-muted); }
  & .bg-hero__visual-footer-title { font-weight: 600; }
  /* Row text flows inline, wrapping naturally without moving its leading marker. */
  &.bg-hero--visual-checklist .bg-hero-visual__note,
  &.bg-hero--visual-process .bg-hero-visual__note { display: inline; margin-block-start: 0; }
  &.bg-hero--visual-checklist .bg-hero-visual__item {
    border-block-end-color: color-mix(in srgb, var(--bg-hero-visual-text) 9%, transparent);
  }
  &.bg-hero--visual-checklist .bg-hero-visual__item:last-child { border-block-end: 0; }
  /* Wrapped rows size to their content in both Standard and Compact. */
  &.bg-hero--visual-checklist :is(.bg-hero__visual-shell, .bg-hero__visual-card) {
    aspect-ratio: auto;
    block-size: auto;
  }
  &.bg-hero--visual-checklist .bg-hero-visual__items { grid-template-rows: repeat(4, auto); }
  &.bg-hero--visual-checklist .bg-hero-visual__item { padding-block: .7rem; overflow: visible; }
  & .bg-hero-visual__note { color: var(--relative-text-color, var(--text-color)); }
  & .bg-hero__mini-checklist-title { font-weight: 700; }

/* Native badge Surfaces own both fill and foreground. */
& .bg-hero-visual__badge:not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary)) { background: var(--bg-decoration-surface, var(--bg-light)); color: var(--relative-link-color, var(--primary)); }

/* Numbered overview uses the shared header, items and footer slots.
   It shows each item's title and headline; stored notes and artwork remain for other designs. */
&.bg-hero--visual-overview {
  & .bg-hero__visual-shell {
    overflow: visible; aspect-ratio: auto; padding: 0; border: 0;
    background: transparent; box-shadow: none;
  }
  & .bg-hero__visual-panel { block-size: auto; }
  & .bg-hero__visual-card {
    rotate: 1deg; aspect-ratio: auto; block-size: auto; overflow: visible;
    display: grid; gap: var(--space-s); padding: var(--space-m);
    border-color: color-mix(in srgb, var(--relative-heading-color) 12%, transparent);
    box-shadow: 0 1rem 3rem color-mix(in srgb, var(--text-dark) 9%, transparent);
  }
  & .bg-hero__visual-header { display: flex; gap: var(--space-s); align-items: center; padding: 0; }
  & .bg-hero__visual-heading { display: grid; gap: .35em; min-inline-size: 0; }
  & .bg-hero__visual-kicker {
    color: var(--relative-link-color); font-size: var(--text-xs); font-weight: 700;
    letter-spacing: .08em; text-transform: uppercase;
  }
  & .bg-hero__visual-title { font-size: var(--text-l); line-height: 1.15; text-wrap: balance; }
  & .bg-hero__visual-subtitle { font-size: var(--text-s); line-height: 1.4; }
  & .bg-hero-visual__badge--header { inline-size: 3.25rem; block-size: 3.25rem; }
  & .bg-hero-visual__items {
    counter-reset: hero-overview; margin: 0; padding: 0; list-style: none;
    display: grid; gap: .5rem;
  }
  & .bg-hero-visual__item {
    counter-increment: hero-overview; display: grid; grid-template-columns: auto minmax(0, 1fr);
    align-items: center; gap: var(--space-xs); padding: calc(var(--space-s) * .875) var(--space-xs); border-radius: var(--radius);
    background: var(--bg-primary-soft);
  }
  & .bg-hero-visual__number {
    display: grid; place-items: center; inline-size: 1.75rem; block-size: 1.75rem;
    border: 1px solid color-mix(in srgb, var(--relative-link-color) 35%, transparent);
    border-radius: var(--radius-circle); color: var(--relative-link-color); font-size: var(--text-xs);
  }
  & .bg-hero-visual__number::before { content: counter(hero-overview, decimal-leading-zero); }
  & .bg-hero-visual__copy { display: grid; gap: .25em; }
  & .bg-hero-visual__title, & .bg-hero-visual__headline { margin: 0; font-size: var(--text-s); line-height: 1.4; }
  & .bg-hero-visual__title { font-weight: 700; color: var(--relative-heading-color); }
  & .bg-hero-visual__headline { font-weight: 400; color: var(--relative-text-color); }
  & .bg-hero-visual__note, & .bg-hero-visual__icon { display: none; }
  & .bg-hero__visual-footer { display: flex; justify-content: center; align-items: center; gap: var(--space-xs); margin: 0; padding: 0; background: none; text-align: center; }
  & .bg-hero__visual-footer-title, & .bg-hero__visual-footer-text { font-size: var(--text-s); line-height: 1.5; }
  & .bg-hero__visual-footer-title { font-weight: 400; color: var(--relative-text-color); }
  & .bg-hero__visual-shell--compact .bg-hero__visual-card { padding: var(--space-s); }
  @container (inline-size < 37.5rem) {
    & .bg-hero__visual-card { rotate: .6deg; padding: var(--space-s); }
    & .bg-hero-visual__item { gap: var(--space-xs); }
  }
}

}
.bg-content-list-03 {
  container-type: inline-size;

  & .bg-content-list-03__container {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: var(--space-xl);
  }

  & .bg-content-list-03__intro {
    display: grid;
    align-content: start;
    gap: 0;
    max-inline-size: 35rem;
  }

  & .bg-content-list-03__kicker {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-l);
    font-weight: 800;
    line-height: 1.35;
  }

  & .bg-content-list-03__text {
    max-inline-size: 54ch;
    font-size: var(--text-m);
    line-height: 1.6;
    text-wrap: pretty;
  }

  & .bg-content-list-03__panel {
    position: relative;
    display: grid;
    align-content: start;
    justify-items: start;
    gap: var(--space-m);
    padding: var(--space-l);
    border-radius: var(--radius);
    overflow: hidden;
  }

  & .bg-content-list-03__panel::before {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    inline-size: min(30%, 10rem);
    block-size: min(48%, 8.75rem);
    border-end-start-radius: var(--radius-circle);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 8%, transparent);
    pointer-events: none;
  }

  & .bg-content-list-03__tag {
    position: relative;
    display: inline-flex;
    inline-size: fit-content;
    max-inline-size: 100%;
    padding: calc(var(--space-xs) / 2) var(--space-s);
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  & .bg-content-list-03__list {
    position: relative;
    display: grid;
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  & .bg-content-list-03__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: var(--space-s);
  }

  & .bg-content-list-03__check {
    display: grid;
    place-items: center;
    inline-size: var(--icon-size-s);
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
  }

  & .bg-content-list-03__check svg {
    inline-size: 65%;
    block-size: 65%;
  }

  & .bg-content-list-03__item p {
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.55;
    text-wrap: pretty;
  }

  & .bg-content-list-03__item strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 800;
  }

  /* Keep the words separated if Studio removes inter-element whitespace. */
  & .bg-content-list-03__item-supporting-text {
    margin-inline-start: 0.25em;
  }

  @container (inline-size < 58rem) {
    & .bg-content-list-03__container {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }

    & .bg-content-list-03__intro {
      max-inline-size: 41.25rem;
    }
  }

  @container (inline-size < 38rem) {
    & .bg-content-list-03__panel {
      padding: var(--space-m);
    }

    & .bg-content-list-03__item {
      gap: var(--space-xs);
    }
  }
  & .bg-content-list-03__intro > * + * { margin-block-start: var(--space-s); }
  & .bg-content-list-03__head + .bg-content-list-03__kicker,
  & .bg-content-list-03__head + .bg-content-list-03__text,
  & .bg-content-list-03__kicker + .bg-content-list-03__text { margin-block-start: var(--paragraph-spacing); }
}
.bg-hero--editable-trust {
    /* One editable trust slot, with presentation supplied by the selected display. */
  & .bg-hero__trust-google-copy {
    display: contents;
  }
  & .bg-hero__trustline .bg-hero__compact-trust-icon {
    display: none;
  }
  & .bg-hero__compact-trust .bg-hero__trustline-item {
    align-items: flex-start;
    gap: calc(var(--space-xs) / 2);
    margin-inline-start: 0;
    padding-inline-start: 0;
  }
  & .bg-hero__compact-trust .bg-hero__trustline-item::before {
    content: none;
  }
  & .bg-hero__compact-trust .bg-hero__google,
  & .bg-hero__compact-trust .bg-hero__stars,
  & .bg-hero__compact-trust .bg-hero__trust-count {
    display: none;
  }
  & .bg-hero__compact-trust .bg-hero__trust-google-copy {
    display: inline;
  }
  & .bg-hero__compact-trust .bg-hero__rating {
    font-weight: inherit;
  }
  & .bg-hero__compact-trust .bg-hero__credential-badge {
    display: inline;
    padding: 0;
    border: 0;
    font-size: inherit;
    letter-spacing: normal;
    line-height: inherit;
    text-transform: none;
  }

  /* Trust mini components inherit the active hero presentation. */
  & .bg-hero__compact-trust {
    --bg-trust-compact-label-display: inline;
    --bg-trust-full-label-display: none;
  }

}
.bg-button--large {
  /* Opt-in vertical padding for individual Button component instances. */
  --btn-padding-block: 1em;

}
.bg-beangrower-ai-usage-rates {
  
  container-type: inline-size;


  .bg-beangrower-ai-usage-rates__intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(16.875rem, .8fr);
    gap: var(--space-xl);
    align-items: center;
  }

  .bg-beangrower-ai-usage-rates__copy {
    display: grid;
    gap: var(--space-s);
  }

  .bg-beangrower-ai-usage-rates__copy p {
    margin: 0;
    font-size: var(--text-m);
  }

  .bg-beangrower-ai-usage-rates__copy strong {
    color: var(--relative-link-color, var(--primary));
  }

  .bg-beangrower-ai-usage-rates__five-percent {
    display: grid;
    grid-template-columns: 4.75rem minmax(0, 1fr);
    gap: var(--space-s);
    align-items: center;
    padding: var(--space-m);
    border-radius: var(--radius);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-beangrower-ai-usage-rates__five-percent > strong {
    display: grid;
    place-items: center;
    inline-size: 4rem;
    block-size: 4rem;
    border: 2px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    font-size: var(--text-xl);
  }

  .bg-beangrower-ai-usage-rates__five-percent h2,
  .bg-beangrower-ai-usage-rates__five-percent p {
    margin: 0;
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-beangrower-ai-usage-rates__five-percent h2 {
    font-size: var(--text-l);
  }

  .bg-beangrower-ai-usage-rates__five-percent p {
    margin-block-start: 0.375rem;
    font-size: var(--text-s);
  }

  .bg-beangrower-ai-usage-rates__pay-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18.75rem, .68fr);
    gap: var(--space-xl);
    align-items: center;
    padding: clamp(var(--space-m), 4cqi, var(--space-xl));
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-usage-rates__wallet {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr);
    gap: var(--space-s);
    align-items: center;
    padding: var(--space-m);
    border-radius: var(--radius);
    box-shadow: 0 0.625rem 1.75rem color-mix(in srgb, var(--black) 10%, transparent);
  }

  .bg-beangrower-ai-usage-rates__wallet > span {
    display: grid;
    place-items: center;
    inline-size: 2.625rem;
    block-size: 2.625rem;
    border-radius: var(--radius);
    
    color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit;
  }

  .bg-beangrower-ai-usage-rates__wallet svg {
    inline-size: 1.8125rem;
    block-size: 1.8125rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
  }

  .bg-beangrower-ai-usage-rates__wallet p {
    margin: 0;
    font-size: var(--text-m);
  }

  .bg-beangrower-ai-usage-rates__credit-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--space-s);
    margin: var(--space-l) 0 0;
    padding: 0;
    list-style: none;
  }

  .bg-beangrower-ai-usage-rates__credit-grid li {
    display: grid;
    justify-items: center;
    gap: 0.25rem;
    min-block-size: 10.625rem;
    padding: var(--space-m) var(--space-s);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    box-shadow: 0 0.5rem 1.375rem color-mix(in srgb, var(--black) 7%, transparent);
    text-align: center;
  }

  .bg-beangrower-ai-usage-rates__credit-grid span {
    display: grid;
    place-items: center;
    inline-size: 2.625rem;
    block-size: 2.625rem;
    border-radius: var(--radius);
    
    color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit;
    font-size: var(--text-l);
  }

  .bg-beangrower-ai-usage-rates__credit-grid svg {
    inline-size: 1.375rem;
    block-size: 1.375rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
  }

  .bg-beangrower-ai-usage-rates__credit-grid small {
    font-size: var(--text-s);
    line-height: 1.15;
  }

  .bg-beangrower-ai-usage-rates__credit-grid strong {
    color: var(--relative-link-color, var(--primary));
    font-size: var(--text-xl);
    line-height: 1;
    letter-spacing: -.04em;
  }

  .bg-beangrower-ai-usage-rates__rate-card {
    
  }

  .bg-beangrower-ai-usage-rates__table-wrap {
    container: bg-usage-table / inline-size;
    min-inline-size: 0;
    max-inline-size: 100%;
    overflow-x: auto;
    margin-block-start: var(--space-l);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    
  }

  .bg-beangrower-ai-usage-rates__table {
    inline-size: 100%;
    min-inline-size: 65rem;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: var(--text-s);
  }

  .bg-beangrower-ai-usage-rates__table col:nth-child(1) {
    inline-size: 22%;
  }

  .bg-beangrower-ai-usage-rates__table col:nth-child(2) {
    inline-size: 10%;
  }

  .bg-beangrower-ai-usage-rates__table col:nth-child(3) {
    inline-size: 16%;
  }

  .bg-beangrower-ai-usage-rates__table col:nth-child(4) {
    inline-size: 16%;
  }

  .bg-beangrower-ai-usage-rates__scroll-hint:not([hidden]) {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-block: var(--space-s) var(--space-xs);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    font-weight: 600;
  }

  .bg-beangrower-ai-usage-rates__table th,
  .bg-beangrower-ai-usage-rates__table td {
    padding: var(--space-xs) var(--space-s);
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    text-align: left;
    vertical-align: top;
    line-height: 1.35;
  }

  .bg-beangrower-ai-usage-rates__table tbody th:not([colspan]) {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 800;
  }

  .bg-beangrower-ai-usage-rates__table td {
    overflow-wrap: break-word;
  }

  .bg-beangrower-ai-usage-rates__category th {
    padding: 0.4375rem var(--space-s);
    
    color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit;
    font-size: var(--text-s);
    letter-spacing: .05em;
    text-transform: uppercase;
  }

  .bg-beangrower-ai-usage-rates__table-note td {
    padding: var(--space-s) var(--space-m);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
  }

  .bg-beangrower-ai-usage-rates__table-note strong {
    color: var(--relative-link-color, var(--primary));
  }

  .bg-beangrower-ai-usage-rates__rate-note {
    display: grid;
    grid-template-columns: 2.125rem minmax(0, 1fr);
    gap: var(--space-s);
    margin-block-start: var(--space-s);
    padding: var(--space-s) var(--space-m);
    border-radius: var(--radius);
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-beangrower-ai-usage-rates__rate-note span {
    display: grid;
    place-items: center;
    inline-size: 1.625rem;
    block-size: 1.625rem;
    border: 1px solid currentColor;
    border-radius: var(--radius);
    font-weight: 800;
  }

  .bg-beangrower-ai-usage-rates__rate-note p {
    margin: 0;
    font-size: var(--text-s);
  }

  .bg-beangrower-ai-usage-rates__rate-note a {
    color: var(--relative-link-color, var(--link-color));
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
  }

  .bg-beangrower-ai-usage-rates__details-table-wrap {
    overflow-x: auto;
    margin-block-start: var(--space-l);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-usage-rates__details-table {
    inline-size: 100%;
    border-collapse: collapse;
    font-size: var(--text-s);
  }

  .bg-beangrower-ai-usage-rates__details-table th,
  .bg-beangrower-ai-usage-rates__details-table td {
    padding: var(--space-s) var(--space-m);
    border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    text-align: left;
    vertical-align: top;
  }

  .bg-beangrower-ai-usage-rates__details-table tbody th {
    inline-size: clamp(6.25rem, 18cqi, 11.25rem);
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 800;
  }

  @container (inline-size < 72rem) {
    .bg-beangrower-ai-usage-rates__credit-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  @container (inline-size < 58rem) {
    .bg-beangrower-ai-usage-rates__intro-grid,
    .bg-beangrower-ai-usage-rates__pay-panel {
      grid-template-columns: var(--grid-1);
    }

    .bg-beangrower-ai-usage-rates__credit-grid {
      grid-template-columns: var(--grid-2);
    }

  }

  @container (inline-size < 38rem) {
    .bg-beangrower-ai-usage-rates__credit-grid {
      gap: var(--space-xs);
    }

    .bg-beangrower-ai-usage-rates__credit-grid li {
      min-block-size: 8.75rem;
      padding: var(--space-s) var(--space-xs);
    }

  }

  .bg-beangrower-ai-usage-rates__currency-callout { display: grid; gap: var(--space-xs); margin-block-start: var(--space-m); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-beangrower-ai-usage-rates__currency-title { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-l); line-height: 1.3; }


  /* Independent scrolling keeps all five columns available at every width. */
  .bg-beangrower-ai-usage-rates__table-wrap, .bg-beangrower-ai-usage-rates__top-scroll { scrollbar-color: var(--primary) var(--bg-primary-soft); scrollbar-width: auto; }
  .bg-beangrower-ai-usage-rates__table-wrap:focus-visible, .bg-beangrower-ai-usage-rates__top-scroll:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
  .bg-beangrower-ai-usage-rates__top-scroll { overflow-x: auto; overflow-y: hidden; block-size: 1.125rem; min-block-size: 0; max-inline-size: 100%; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius);  position: sticky; inset-block-start: 0; z-index: 3; }
  .bg-beangrower-ai-usage-rates__top-scroll[hidden], .bg-beangrower-ai-usage-rates__scroll-hint[hidden] { display: none; }
  .bg-beangrower-ai-usage-rates__scroll-width { block-size: 1px; min-block-size: 0; }
  .bg-beangrower-ai-usage-rates__top-scroll:not([hidden]) + .bg-beangrower-ai-usage-rates__table-wrap { margin-block-start: var(--space-xs); }
  .bg-beangrower-ai-usage-rates__table-wrap::-webkit-scrollbar, .bg-beangrower-ai-usage-rates__top-scroll::-webkit-scrollbar { height: 14px; }
  .bg-beangrower-ai-usage-rates__table-wrap::-webkit-scrollbar-track, .bg-beangrower-ai-usage-rates__top-scroll::-webkit-scrollbar-track { background: var(--bg-primary-soft); }
  .bg-beangrower-ai-usage-rates__table-wrap::-webkit-scrollbar-thumb, .bg-beangrower-ai-usage-rates__top-scroll::-webkit-scrollbar-thumb { background: var(--primary); border: 3px solid var(--bg-primary-soft); border-radius: var(--radius); }
  @container bg-usage-table (inline-size < 65rem) {
    .bg-beangrower-ai-usage-rates__table col:nth-child(1) { inline-size: 8rem; }
    .bg-beangrower-ai-usage-rates__table col:nth-child(2) { inline-size: 8rem; }
    .bg-beangrower-ai-usage-rates__table col:nth-child(3), .bg-beangrower-ai-usage-rates__table col:nth-child(4) { inline-size: 10rem; }
    .bg-beangrower-ai-usage-rates__table tbody th[scope="row"], .bg-beangrower-ai-usage-rates__table thead th:first-child { position: sticky; inset-inline-start: 0; z-index: 2;  box-shadow: 3px 0 5px color-mix(in srgb, var(--base) 12%, transparent); }
    .bg-beangrower-ai-usage-rates__table thead th:first-child {  }
    .bg-beangrower-ai-usage-rates__table th, .bg-beangrower-ai-usage-rates__table td { padding-inline: var(--space-xs); }
  }

/* Native surface relationships own fills; foregrounds remain local to each badge or cell. */
.bg-beangrower-ai-usage-rates__five-percent > strong, .bg-beangrower-ai-usage-rates__wallet > span, .bg-beangrower-ai-usage-rates__credit-grid span, .bg-beangrower-ai-usage-rates__rate-note > span { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }
.bg-beangrower-ai-usage-rates__five-percent h2, .bg-beangrower-ai-usage-rates__currency-title, .bg-beangrower-ai-usage-rates__table thead th, .bg-beangrower-ai-usage-rates__details-table thead th, .bg-beangrower-ai-usage-rates__category th { color: var(--relative-heading-color, var(--heading-color)); }

}
.bg-reviews-comparison {
  
  /* General Section owns the section, columns, panels and responsive stacking. */
  .bg-reviews-comparison__list { display: grid; gap: var(--space-xs); padding: 0; margin: 0; list-style: none; }
  .bg-reviews-comparison__item { display: flex; align-items: flex-start; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }
  .bg-reviews-comparison__icon { display: inline-grid; place-items: center; flex: 0 0 auto; inline-size: 1.6em; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-reviews-comparison__glyph { display: block; inline-size: 1em; block-size: 1em; }
  .bg-reviews-comparison__text { min-inline-size: 0; font-size: var(--text-m); line-height: 1.5; }

  .bg-reviews-comparison__heading--primary { color: var(--primary); }

  /* One heading track and five shared comparison tracks. Each pair grows to fit
     its longer statement; no fixed heights or JavaScript measurements. */
  @container (inline-size >= 36rem) {
    &.bg-section-general-01__panel { display: grid; grid-template-rows: subgrid; grid-row: span 6; row-gap: var(--space-m); }
    .bg-reviews-comparison__list { grid-row: span 5; grid-template-rows: subgrid; row-gap: var(--space-xs); }
  }
  /* Below 36rem, General Section stacks the panels and each list sizes naturally. */

/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-comparison__icon:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-comparison__icon:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

.bg-reviews-comparison__icon.bg--light { border: 1px solid var(--primary); }

.bg-reviews-comparison__badge.surface-panel { border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

}
.bg-beangrower-ai-old-new {
  min-inline-size: 0;

  & .bg-section-head { max-inline-size: 51.25rem; margin-inline: auto; }

  .bg-beangrower-ai-old-new__comparison { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 4rem minmax(0, 1fr); gap: var(--space-m); align-items: stretch; }

  .bg-beangrower-ai-old-new__comparison > :not(.bg-beangrower-ai-old-new__art) { position: relative; z-index: 1; }

  .bg-beangrower-ai-old-new__art { position: absolute; z-index: 0; display: block; inline-size: min(39vw, 37.5rem); block-size: min(51vw, 48.75rem); inset-block-end: 0; background: center bottom / contain no-repeat; opacity: .94; pointer-events: none; }

  .bg-beangrower-ai-old-new__art--old { inset-inline-start: min(-34vw, -32.5rem); background-image: url("../assets/old-new-software-sprawl-vector.svg"); }

  .bg-beangrower-ai-old-new__art--new { inset-inline-end: min(-24vw, -22.5rem); background-image: linear-gradient(145deg, var(--primary-semi-light), var(--primary) 52%, var(--primary)); mask: url("../assets/old-new-growth-vector.svg") center bottom / contain no-repeat; -webkit-mask: url("../assets/old-new-growth-vector.svg") center bottom / contain no-repeat; }

  .bg-beangrower-ai-old-new__panel { display: grid; grid-template-rows: auto 1fr; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: 0 0.75rem 1.875rem color-mix(in srgb, var(--black) 7%, transparent); }

  .bg-beangrower-ai-old-new__panel--old { }

  .bg-beangrower-ai-old-new__panel--new { border-color: var(--bg-primary-soft); }

  .bg-beangrower-ai-old-new__panel-header h3, .bg-beangrower-ai-old-new__panel-header p { margin: 0; }

  .bg-beangrower-ai-old-new__panel-header h3 { margin-block-start: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-xl); line-height: 1.08; letter-spacing: -.035em; }

  .bg-beangrower-ai-old-new__tag { display: inline-flex; inline-size: fit-content; padding: 0.4375rem 0.8125rem; border-radius: var(--radius); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-xs); font-weight: 800; letter-spacing: .06em; line-height: 1; text-transform: uppercase; }

  .bg-beangrower-ai-old-new__list { display: grid; grid-template-rows: repeat(4, minmax(0, 1fr)); gap: var(--space-s); margin: 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-old-new__list li { display: grid; grid-template-columns: 5.75rem minmax(0, 1fr); gap: var(--space-s); align-items: center; min-block-size: 5.5rem; }

  .bg-beangrower-ai-old-new__list h4, .bg-beangrower-ai-old-new__list p { margin: 0; }

  .bg-beangrower-ai-old-new__list h4 { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.15; }

  .bg-beangrower-ai-old-new__list p { margin-block-start: 0.25rem; font-size: var(--text-s); line-height: 1.35; }

  .bg-beangrower-ai-old-new__icon { display: grid; place-items: center; inline-size: 5.25rem; block-size: 5.25rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius);   }

  .bg-beangrower-ai-old-new__icon svg, .bg-beangrower-ai-old-new__arrows svg, .bg-beangrower-ai-old-new__footer svg { display: block; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }

  .bg-beangrower-ai-old-new__icon svg { inline-size: 2.625rem; block-size: 2.625rem; stroke-width: 1.55; }

  .bg-beangrower-ai-old-new__icon--connected svg { stroke-width: 2.05; }

  .bg-beangrower-ai-old-new__arrows { display: grid; grid-template-rows: auto repeat(4, minmax(0, 1fr)); padding-block-start: calc(2.3125rem + var(--space-xs)); }

  .bg-beangrower-ai-old-new__arrows::before { content: ''; }

  .bg-beangrower-ai-old-new__arrows span { display: grid; place-self: center; place-items: center; inline-size: 3.125rem; block-size: 3.125rem; border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--primary); }

  .bg-beangrower-ai-old-new__arrows svg { inline-size: 1.625rem; block-size: 1.625rem; stroke-width: 1.7; }

  .bg-beangrower-ai-old-new__footer { display: grid; gap: var(--space-m); margin-block-start: var(--space-xs); padding: var(--space-s) var(--space-m); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 18%, transparent); }

  .bg-beangrower-ai-old-new__footer > p { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: clamp(var(--text-l), 1.7cqi, 1.75rem); font-weight: 800; line-height: 1.18; letter-spacing: -.045em; text-align: center; white-space: nowrap; }

  .bg-beangrower-ai-old-new__footer > p strong { color: var(--primary); font-size: inherit; font-weight: inherit; }

  .bg-beangrower-ai-old-new__footer ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-m); margin: 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-old-new__footer li { display: grid; grid-template-columns: 3.625rem minmax(0, 1fr); gap: var(--space-xs); align-items: center; }

  .bg-beangrower-ai-old-new__footer li > span { display: grid; place-items: center; inline-size: 3.375rem; block-size: 3.375rem; border-radius: var(--radius); background: color-mix(in srgb, var(--neutral) 8%, transparent); color: var(--neutral-semi-dark); }

  .bg-beangrower-ai-old-new__footer svg { inline-size: 1.8125rem; block-size: 1.8125rem; stroke-width: 1.55; }

  .bg-beangrower-ai-old-new__footer li strong, .bg-beangrower-ai-old-new__footer li small { display: block; }

  .bg-beangrower-ai-old-new__footer li strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.2; }

  .bg-beangrower-ai-old-new__footer li small { margin-block-start: 0.1875rem; font-size: var(--text-s); line-height: 1.25; }

  @media (width < 90rem) {
    .bg-beangrower-ai-old-new__art { display: none; }
  }

  @container (inline-size < 58rem) {
    .bg-beangrower-ai-old-new__comparison { grid-template-columns: minmax(0, 1fr) 3.125rem minmax(0, 1fr); gap: var(--space-s); }
    .bg-beangrower-ai-old-new__panel { padding: var(--space-s); }
    .bg-beangrower-ai-old-new__panel-header h3 { font-size: var(--text-l); }
    .bg-beangrower-ai-old-new__list li { grid-template-columns: 4.125rem minmax(0, 1fr); gap: var(--space-xs); min-block-size: 4.625rem; }
    .bg-beangrower-ai-old-new__icon { inline-size: 3.875rem; block-size: 3.875rem; }
    .bg-beangrower-ai-old-new__icon svg { inline-size: 2.0625rem; block-size: 2.0625rem; }
    .bg-beangrower-ai-old-new__list h4 { font-size: var(--text-s); }
    .bg-beangrower-ai-old-new__list p { font-size: var(--text-xs); }
    .bg-beangrower-ai-old-new__arrows span { inline-size: 2.625rem; block-size: 2.625rem; }
  }

  @container (inline-size < 44rem) {
    .bg-beangrower-ai-old-new__comparison { grid-template-columns: var(--grid-1); }
    .bg-beangrower-ai-old-new__panel { padding: var(--space-m); }
    .bg-beangrower-ai-old-new__list { grid-template-rows: none; }
    .bg-beangrower-ai-old-new__list li { grid-template-columns: 4.875rem minmax(0, 1fr); min-block-size: 4.875rem; }
    .bg-beangrower-ai-old-new__icon { inline-size: 4.5rem; block-size: 4.5rem; }
    .bg-beangrower-ai-old-new__icon svg { inline-size: 2.375rem; block-size: 2.375rem; }
    .bg-beangrower-ai-old-new__arrows { display: grid; grid-template-rows: none; padding: 0; }
    .bg-beangrower-ai-old-new__arrows span { display: none; }
    .bg-beangrower-ai-old-new__arrows span:first-child { display: grid; justify-self: center; transform: rotate(90deg); }
    .bg-beangrower-ai-old-new__footer { padding-inline: 0; }
    .bg-beangrower-ai-old-new__footer > p { white-space: normal; }
    .bg-beangrower-ai-old-new__footer ul { grid-template-columns: var(--grid-1); gap: var(--space-s); max-inline-size: 21.25rem; margin-inline: auto; }
  }

  @container (inline-size < 30rem) {
    .bg-beangrower-ai-old-new__panel { padding: var(--space-s); }
    .bg-beangrower-ai-old-new__list li { grid-template-columns: 3.875rem minmax(0, 1fr); min-block-size: 0; }
    .bg-beangrower-ai-old-new__icon { inline-size: 3.625rem; block-size: 3.625rem; }
    .bg-beangrower-ai-old-new__icon svg { inline-size: 1.875rem; block-size: 1.875rem; }
    .bg-beangrower-ai-old-new__footer > p { font-size: var(--text-l); }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */
  /* The artwork reaches the viewport edges; only the comparison cards are width-limited. */

  &.bg-beangrower-ai-old-new__body { position: relative; inline-size: 100vw; max-inline-size: none; margin-inline: calc(50% - 50vw); padding-inline: var(--gutter); overflow-x: clip; }

  .bg-beangrower-ai-old-new__comparison { max-inline-size: 72.5rem; margin-inline: auto; }

  .bg-beangrower-ai-old-new__icon, .bg-beangrower-ai-old-new__tick, .bg-beangrower-ai-old-new__footer-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-old-new__panel--new .bg-beangrower-ai-old-new__icon { border-color: var(--primary); }
  /* Share actual heading/point tracks, so arrows follow wrapping copy.
     Below 44rem the existing stacked panels and single down-arrow remain. */
  @supports (grid-template-rows: subgrid) {
    @container (inline-size >= 44rem) {
      .bg-beangrower-ai-old-new__comparison { grid-template-rows: auto repeat(4, auto); row-gap: var(--space-s); }
      .bg-beangrower-ai-old-new__panel { grid-row: 1 / span 5; grid-template-rows: subgrid; }
      .bg-beangrower-ai-old-new__panel--old { grid-column: 1; }
      .bg-beangrower-ai-old-new__panel--new { grid-column: 3; }
      .bg-beangrower-ai-old-new__panel-header { grid-row: 1; }
      .bg-beangrower-ai-old-new__list { grid-row: 2 / span 4; grid-template-rows: subgrid; }
      .bg-beangrower-ai-old-new__arrows { grid-column: 2; grid-row: 1 / span 5; grid-template-rows: subgrid; row-gap: var(--space-s); padding-block: calc(var(--space-m) + 1px); }
    }
    @container (44rem <= inline-size < 58rem) {
      .bg-beangrower-ai-old-new__arrows { padding-block: calc(var(--space-s) + 1px); }
    }
  }

}
.bg-reviews-cta {
  display: grid;
  justify-items: center;
  gap: var(--space-s);
  text-align: center;
  .bg-reviews-cta__actions { display: flex; justify-content: center; inline-size: 100%; }
  .bg-reviews-cta__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs) var(--space-m); list-style: none; padding-inline-start: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; }
  .bg-reviews-cta__terms { max-inline-size: 75ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-reviews-cta__terms a { color: var(--relative-link-color, var(--link-color)); text-decoration: underline; text-underline-offset: .16em; }
  .bg-reviews-cta__terms a:focus-visible { outline: 2px solid var(--relative-link-color, var(--primary)); outline-offset: .2em; }
  @container (inline-size < 36rem) {
    .bg-reviews-cta__actions .bg-button-wrap, .bg-reviews-cta__actions .bg-button { inline-size: 100%; }
    .bg-reviews-cta__actions .bg-button { justify-content: center; }
  }
}
.bg-newsletter {
  container-type: inline-size;

  .bg-newsletter__container {
    min-inline-size: 0;
  }

  .bg-newsletter__panel {
    position: relative;
    display: grid;
    grid-template-columns: var(--grid-2);
    align-items: center;
    gap: var(--space-xl);
    overflow: hidden;
    padding: var(--space-xl);
    border-radius: var(--radius);
  }

  .bg-newsletter__blob {
    position: absolute;
    right: -5rem;
    bottom: -5rem;
    inline-size: 20rem;
    block-size: 20rem;
    border-radius: var(--radius-circle);
    background: var(--bg-brand-accent, var(--primary));
    opacity: 0.15;
    pointer-events: none;
  }

  .bg-newsletter__copy,
  .bg-newsletter__mock {
    position: relative;
    min-inline-size: 0;
  }

  .bg-newsletter__copy {
    display: grid;
    gap: var(--space-s);
    justify-items: start;
  }

  .bg-newsletter__eyebrow {
    display: inline-flex;
    inline-size: max-content;
    max-inline-size: 100%;
    padding: 0.45em 1.1em;
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-newsletter__title {
    max-inline-size: 20ch;
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.1;
    font-size: calc(var(--h3) * 1.2);
    overflow-wrap: anywhere;
  }

  .bg-newsletter__text {
    max-inline-size: 48ch;
    font-size: var(--text-m);
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  .bg-newsletter__form {
    display: flex;
    gap: calc(var(--space-xs) / 2);
    inline-size: min(100%, 29.375rem);
    margin-block-start: var(--space-xs);
  }

  .bg-newsletter__email {
    flex: 1 1 14.375rem;
    min-inline-size: 0;
    padding: 0.875em 1.125em;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 18%, transparent);
    border-radius: var(--radius);
    background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    color: var(--relative-heading-color, var(--heading-color));
    font: inherit;
    font-size: var(--text-s);
  }

  .bg-newsletter__email::placeholder {
    color: var(--relative-text-color, var(--text-color));
  }

  .bg-newsletter__email:focus-visible {
    outline: 2px solid var(--bg-brand-accent, var(--primary));
    outline-offset: 3px;
  }

  .bg-newsletter__submit {
    flex: 0 0 auto;
  }

  .bg-newsletter__mock {
    padding: var(--space-m);
    border-radius: var(--radius);
    box-shadow: 0 1.875rem 3.75rem color-mix(in oklch, var(--black) 30%, transparent);
    transform: rotate(2deg);
  }

  .bg-newsletter__mock-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-s);
    padding-block-end: var(--space-xs);
    margin-block-end: var(--space-s);
    border-block-end: 0.125rem solid var(--bg-brand-accent, var(--primary));
  }

  .bg-newsletter__mock-name {
    font-size: var(--h4);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    overflow-wrap: anywhere;
  }

  .bg-newsletter__mock-logo {
    display: block;
    flex: 0 0 auto;
    inline-size: clamp(4rem, 18%, 6rem);
    max-inline-size: clamp(4rem, 18%, 6rem);
    max-block-size: 2rem;
    margin-block-start: calc(var(--space-xs) * -0.2);
    margin-inline-start: auto;
    object-fit: contain;
    object-position: right center;
  }

  .bg-newsletter__mock-title {
    /* Deliberate preview spacing beyond the shared ACSS text reset. */
    margin-block-end: calc(var(--space-xs) / 2);
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.3;
  }

  .bg-newsletter__mock-desc {
    /* Separate the preview introduction from its list. */
    margin-block-end: var(--space-xs);
    font-size: var(--text-s);
    line-height: 1.5;
  }

  .bg-newsletter__mock-list {
    display: grid;
    gap: calc(var(--space-xs) / 2);
    padding: var(--space-xs) 0 0;
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    font-size: var(--text-s);
    font-weight: 600;
    list-style: none;
  }

  .bg-newsletter__mock-list li::before {
    content: '\25B8';
    margin-inline-end: calc(var(--space-xs) / 2);
    color: var(--bg-brand-accent, var(--primary));
  }

  @container (inline-size < 56rem) {
    .bg-newsletter__panel {
      grid-template-columns: var(--grid-1);
      gap: var(--space-l);
      padding: var(--space-l);
    }
  }

  @container (inline-size < 36rem) {
    .bg-newsletter__panel {
      padding: var(--space-m);
    }

    .bg-newsletter__form {
      flex-direction: column;
    }

    .bg-newsletter__email {
      /* The desktop width basis must not become the stacked input height. */
      flex-basis: auto;
    }

    .bg-newsletter__submit,
    .bg-newsletter__submit .bg-button-wrap,
    .bg-newsletter__submit .bg-button {
      inline-size: 100%;
    }

    .bg-newsletter__submit .bg-button {
      justify-content: center;
    }

    .bg-newsletter__mock {
      transform: rotate(0deg);
    }
  }
/* The shared role owns its fill; ACSS owns the foreground relationship. */
.bg-newsletter__eyebrow.bg-newsletter__eyebrow--accent {
  --bg-decoration-surface: var(--bg-secondary-soft);
  background-color: var(--bg-decoration-surface);
}

/* Soft accent labels use the darker ACSS shade of their own colour family.
   Body copy and solid Surface relationships are unaffected. */
.bg-newsletter__eyebrow.bg-newsletter__eyebrow--accent.bg--ultra-light {
  --relative-text-color: var(--bg-soft-secondary-text);
  --relative-heading-color: var(--bg-soft-secondary-text);
  --icon-color: var(--bg-soft-secondary-text);
  color: var(--relative-text-color);
}

}
.bg-everything {
  container-type: inline-size;

  --bg-everything-card-radius: var(--radius);
  --bg-everything-icon-box-size: calc(var(--icon-size-l) * 0.7);
  --bg-everything-icon-svg-size: var(--icon-size-m);
  --bg-everything-tagline-icon-box-size: var(--icon-size-l);
  --bg-everything-tagline-icon-svg-size: var(--icon-size-m);

  .bg-everything__container {
    display: grid;
    gap: var(--space-l);
  }

  .bg-everything__grid {
    display: grid;
    grid-template-columns: var(--grid-3);
    gap: var(--space-s);
    padding: 0;
    list-style: none;
  }

  .bg-everything__item {
    display: grid;
    min-inline-size: 0;
  }

  .bg-everything__card {
    display: grid;
    align-content: start;
    gap: var(--space-s);
    min-inline-size: 0;
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--bg-everything-card-radius);
  }

  .bg-everything__icon,
  .bg-everything__tagline-icon {
    display: inline-grid;
    place-items: center;
  }

  .bg-everything__icon {
    justify-self: start;
    inline-size: var(--bg-everything-icon-box-size);
    block-size: var(--bg-everything-icon-box-size);
    border-radius: var(--icon-radius);
    /* Match the shared Icon component: ACSS owns icon colours and box styling. */
    color-scheme: var(--icon-scheme);
    color: var(--icon-color);
    background: var(--icon-background);
    border: var(--icon-border-width) var(--icon-border-style) var(--icon-border-color);
  }

  .bg-everything__icon :where(svg) {
    color: inherit;
    inline-size: var(--bg-everything-icon-svg-size);
    block-size: var(--bg-everything-icon-svg-size);
    max-inline-size: 100%;
    max-block-size: 100%;
  }

  .bg-everything__card-title {
    font-size: var(--h4);
  }

  .bg-everything__card p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.55;
  }

  .bg-everything__tagline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-m);
    padding: var(--space-l);
    border-radius: var(--bg-everything-card-radius);
  }

  .bg-everything__tagline-icon {
    inline-size: var(--bg-everything-tagline-icon-box-size);
    block-size: var(--bg-everything-tagline-icon-box-size);
    border-radius: var(--radius-circle);
  }

  .bg-everything__tagline-icon :where(svg) {
    inline-size: var(--bg-everything-tagline-icon-svg-size);
    block-size: var(--bg-everything-tagline-icon-svg-size);
    max-inline-size: 100%;
    max-block-size: 100%;
  }

  .bg-everything__tagline-copy {
    max-inline-size: 45em;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-l);
    font-weight: 500;
    line-height: 1.45;
  }

  .bg-everything__tagline-highlight {
    color: var(--bg-brand-accent, var(--primary));
  }

  .bg-everything__tagline-actions {
    grid-column: 2;
    justify-self: start;
  }

  @container (inline-size < 64rem) {
    .bg-everything__grid {
      grid-template-columns: var(--grid-2);
    }
  }

  @container (inline-size < 40rem) {
    .bg-everything__grid,
    .bg-everything__tagline {
      grid-template-columns: var(--grid-1);
    }

    .bg-everything__tagline-actions {
      grid-column: 1;
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */
}
.bg-tax-article {
  .bg-tax-article__title { color: red; }
}
.bg-content-list-slots-01 {
  container-type: inline-size;
  & .bg-content-list-slots-01__container { display: grid; grid-template-columns: var(--bg-content-list-slots-01-columns, minmax(0, 1fr) minmax(0, 2fr)); align-items: start; gap: var(--space-xl) var(--space-xxl); }
  &[data-columns="40-60"] { --bg-content-list-slots-01-columns: minmax(0, 2fr) minmax(0, 3fr); }
  &[data-columns="45-55"] { --bg-content-list-slots-01-columns: minmax(0, 9fr) minmax(0, 11fr); }
  &[data-columns="50-50"] { --bg-content-list-slots-01-columns: minmax(0, 1fr) minmax(0, 1fr); }
  &[data-heading-position="above"] .bg-content-list-slots-01__container { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-l); }
  & .bg-content-list-slots-01__introduction, & .bg-content-list-slots-01__content { min-inline-size: 0; }
  & .bg-content-list-slots-01__list { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
  & .bg-content-list-slots-01__item { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); margin: 0; padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  & .bg-content-list-slots-01__item:not(:has(> .bg-icon)) { grid-template-columns: minmax(0, 1fr); }
  & .bg-content-list-slots-01__copy { display: grid; gap: 0; min-inline-size: 0; }
  & .bg-content-list-slots-01__title { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.25; }
  & .bg-content-list-slots-01__text { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; }
  & .bg-content-list-slots-01__item:has(> .bg-icon):not(:has(.bg-content-list-slots-01__text)) { align-items: center; }
  /* All four designs use the same page-owned list items. */
  &:not([data-list-style="icon-cards"]) .bg-content-list-slots-01__list { gap: 0; }
  &:not([data-list-style="icon-cards"]) .bg-content-list-slots-01__item {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--relative-text-color, var(--text-color));
    padding: 0 0 var(--space-s) calc(1.25em + var(--space-s));
  }
  &:not([data-list-style="icon-cards"]) .bg-content-list-slots-01__item > .bg-icon { display: none; }
  &:not([data-list-style="icon-cards"]) .bg-content-list-slots-01__item::before {
    content: "✓";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: .1em;
    inline-size: 1.25em;
    block-size: 1.25em;
    display: grid;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: var(--radius-circle);
    font-size: var(--text-m);
    line-height: 1;
  }
  & .bg-content-list-slots-01__panel-header { display: none; }
  &[data-list-style="checklist-panel"] .bg-content-list-slots-01__panel-header:has(> *) { display: flex; align-items: center; gap: var(--space-s); margin-block-end: var(--space-m); }
  &[data-list-style="checklist-panel"] .bg-content-list-slots-01__panel-header > :is(h2, h3, h4) { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); }
  &[data-list-style="bordered-checklist"] .bg-content-list-slots-01__content,
  &[data-list-style="checklist-panel"] .bg-content-list-slots-01__content {
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item { padding-block: var(--space-s); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item::before { inset-block-start: calc(var(--space-s) + .1em); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item + .bg-content-list-slots-01__item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item:first-child { padding-block-start: 0; }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item:first-child::before { inset-block-start: .1em; }
  &:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item:last-child { padding-block-end: 0; }
  & .bg-content-list-slots-01__content { container-type: inline-size; }
  /* One column by default. Two columns require enough width in the content area. */
  @container (inline-size >= 32rem) {
    &[data-list-columns="2"] .bg-content-list-slots-01__list {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      column-gap: calc(var(--space-l) * 2);
    }
    &[data-list-style="icon-cards"][data-list-columns="2"] .bg-content-list-slots-01__list { gap: var(--space-l); }
    &[data-list-columns="2"]:not([data-list-style="icon-cards"]) .bg-content-list-slots-01__list::before {
      content: "";
      position: absolute;
      inset-block: 0;
      inset-inline-start: 50%;
      border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
      pointer-events: none;
    }
    &[data-list-columns="2"]:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item:nth-child(-n + 2) { padding-block-start: 0; border-block-start: 0; }
    &[data-list-columns="2"]:is([data-list-style="bordered-checklist"], [data-list-style="checklist-panel"]) .bg-content-list-slots-01__item:nth-child(-n + 2)::before { inset-block-start: .1em; }
  }
  @container (inline-size < 48rem) { & .bg-content-list-slots-01__container { grid-template-columns: minmax(0, 1fr); gap: var(--space-l); } }
}
.bg-beangrower-ai-features {
  min-inline-size: 0;

  .bg-beangrower-ai-features__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 23.125rem);
    align-items: end;
    gap: var(--space-l);
  }

  .bg-beangrower-ai-features__detail-label { color: var(--primary); font-size: var(--text-s); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }

  .bg-beangrower-ai-features__guide { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-features__guide-icon,
  .bg-beangrower-ai-features__category-heading > span { display: grid; flex: 0 0 auto; place-items: center; border-radius: var(--radius); }

  .bg-beangrower-ai-features__guide-icon { background: var(--primary); box-shadow: 0 0.375rem 0.875rem color-mix(in srgb, var(--primary) 20%, transparent); color: var(--bg-primary-soft); }

  .bg-beangrower-ai-features__guide-icon { inline-size: 3.625rem; block-size: 3.625rem; }

  .bg-beangrower-ai-features__guide-icon svg { inline-size: 1.875rem; block-size: 1.875rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.75; }

  .bg-beangrower-ai-features__guide h3 { font-size: var(--text-m); line-height: 1.15; }

  .bg-beangrower-ai-features__guide p { margin-block-start: 0.3125rem; font-size: var(--text-s); line-height: 1.45; }

  .bg-beangrower-ai-features__categories { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.3fr) minmax(0, .95fr); gap: var(--space-s); }

  .bg-beangrower-ai-features__category {
    --bg-feature-surface: var(--bg-primary-soft);
    --bg-feature-text: var(--primary);
    --bg-feature-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    display: grid;
    align-content: start;
    gap: var(--space-s);
    min-inline-size: 0;
    padding: var(--space-s);
    border: 1px solid var(--bg-feature-border);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-features__category--marketing,
  .bg-beangrower-ai-features__category--platform { }

  .bg-beangrower-ai-features__category--communications { }

  .bg-beangrower-ai-features__category--ai { }

  .bg-beangrower-ai-features__category--payments { }

  .bg-beangrower-ai-features__category--retention { }

  .bg-beangrower-ai-features__category--wide { grid-column: auto; }

  .bg-beangrower-ai-features__category--full { grid-column: 1 / -1; grid-template-columns: minmax(23.75rem, 1.25fr) minmax(0, 1.75fr); align-items: center; }

  .bg-beangrower-ai-features__category-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-xs); }

  .bg-beangrower-ai-features__category-heading > span { inline-size: 3.375rem; block-size: 3.375rem; background: var(--bg-feature-text); box-shadow: 0 0.375rem 0.875rem color-mix(in srgb, var(--bg-feature-text) 20%, transparent); color: var(--bg-feature-surface); }

  .bg-beangrower-ai-features__category-heading svg { inline-size: 1.875rem; block-size: 1.875rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }

  .bg-beangrower-ai-features__category-heading h3 { color: var(--heading-color); font-size: var(--text-m); line-height: 1.1; letter-spacing: -.03em; }

  .bg-beangrower-ai-features__category-heading p { margin-block-start: 0.25rem; font-size: var(--text-s); line-height: 1.35; }

  .bg-beangrower-ai-features__tiles { display: grid; gap: 0.5625rem; }

  .bg-beangrower-ai-features__tiles--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .bg-beangrower-ai-features__tiles--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .bg-beangrower-ai-features__tiles--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .bg-beangrower-ai-features__tiles--three .bg-beangrower-ai-features__tile { padding-inline: 0.25rem; font-size: calc(var(--text-s) * .92); }

  .bg-beangrower-ai-features__footer { display: grid; justify-items: center; gap: 0.3125rem; padding-block-start: var(--space-s); text-align: center; }

  .bg-beangrower-ai-features__footer p { color: var(--primary); font-size: var(--text-s); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }

  .bg-beangrower-ai-features__footer h3 { color: var(--heading-color); font-size: var(--text-xl); line-height: 1.1; letter-spacing: -.04em; }

  .bg-beangrower-ai-features__tile {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.375rem;
    min-block-size: 6.125rem;
    padding: var(--space-xs);
    border: 1px solid transparent;
    border-radius: var(--radius);
    color: var(--heading-color);
    font: inherit;
    font-size: var(--text-s);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
  }

  .bg-beangrower-ai-features__tile:focus-visible,
  .bg-beangrower-ai-features__tile.is-active { border-color: var(--bg-feature-text); background: color-mix(in srgb, var(--body-bg-color) 80%, var(--bg-feature-surface)); box-shadow: 0 0.5rem 1.25rem color-mix(in srgb, var(--bg-feature-text) 16%, transparent); transform: translateY(-0.125rem); outline: none; }

  .bg-beangrower-ai-features__tile:focus-visible { outline: 3px solid color-mix(in srgb, var(--bg-feature-text) 45%, transparent); outline-offset: 3px; }

  .bg-beangrower-ai-features__tile > span:last-child { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: normal; word-break: normal; }

  .bg-beangrower-ai-features__tile-icon { display: grid; place-items: center; inline-size: 1.9375rem; block-size: 1.9375rem; color: var(--bg-feature-text); }

  .bg-beangrower-ai-features__tile-glyph { display: block; inline-size: 1.6875rem; block-size: 1.6875rem; background-color: currentColor; mask: var(--bg-feature-icon-url) center / contain no-repeat; -webkit-mask: var(--bg-feature-icon-url) center / contain no-repeat; }

  .bg-beangrower-ai-features__tile-glyph--ad-manager { --bg-feature-icon-url: url("../assets/bg-ai-ad-manager.svg"); }

  .bg-beangrower-ai-features__tile-glyph--affiliate-management { --bg-feature-icon-url: url("../assets/bg-ai-affiliate-management.svg"); }

  .bg-beangrower-ai-features__tile-glyph--ai-chat-conversation { --bg-feature-icon-url: url("../assets/bg-ai-ai-chat-conversation.svg"); }

  .bg-beangrower-ai-features__tile-glyph--ai-content-productivity { --bg-feature-icon-url: url("../assets/bg-ai-ai-content-productivity.svg"); }

  .bg-beangrower-ai-features__tile-glyph--ai-receptionist-voice { --bg-feature-icon-url: url("../assets/bg-ai-ai-receptionist-voice.svg"); }

  .bg-beangrower-ai-features__tile-glyph--ai-assistants { --bg-feature-icon-url: url("../assets/bg-ai-ai-assistants.svg"); }

  .bg-beangrower-ai-features__tile-glyph--automation { --bg-feature-icon-url: url("../assets/bg-ai-automation.svg"); }

  .bg-beangrower-ai-features__tile-glyph--bookings { --bg-feature-icon-url: url("../assets/bg-ai-bookings.svg"); }

  .bg-beangrower-ai-features__tile-glyph--client-portal { --bg-feature-icon-url: url("../assets/bg-ai-client-portal.svg"); }

  .bg-beangrower-ai-features__tile-glyph--communities-courses { --bg-feature-icon-url: url("../assets/bg-ai-communities-courses.svg"); }

  .bg-beangrower-ai-features__tile-glyph--crm { --bg-feature-icon-url: url("../assets/bg-ai-crm.svg"); }

  .bg-beangrower-ai-features__tile-glyph--document-signing { --bg-feature-icon-url: url("../assets/bg-ai-document-signing.svg"); }

  .bg-beangrower-ai-features__tile-glyph--email-text-marketing { --bg-feature-icon-url: url("../assets/bg-ai-email-text-marketing.svg"); }

  .bg-beangrower-ai-features__tile-glyph--estimates-invoices-payments { --bg-feature-icon-url: url("../assets/bg-ai-estimates-invoices-payments.svg"); }

  .bg-beangrower-ai-features__tile-glyph--ecommerce-online-store { --bg-feature-icon-url: url("../assets/bg-ai-ecommerce-online-store.svg"); }

  .bg-beangrower-ai-features__tile-glyph--events-ticketing { --bg-feature-icon-url: url("../assets/bg-ai-events-ticketing.svg"); }

  .bg-beangrower-ai-features__tile-glyph--forms-surveys-quizzes { --bg-feature-icon-url: url("../assets/bg-ai-forms-surveys-quizzes.svg"); }

  .bg-beangrower-ai-features__tile-glyph--lead-capture { --bg-feature-icon-url: url("../assets/bg-ai-lead-capture.svg"); }

  .bg-beangrower-ai-features__tile-glyph--multi-channel-inbox { --bg-feature-icon-url: url("../assets/bg-ai-multi-channel-inbox.svg"); }

  .bg-beangrower-ai-features__tile-glyph--missed-call-text-back { --bg-feature-icon-url: url("../assets/bg-ai-missed-call-text-back.svg"); }

  .bg-beangrower-ai-features__tile-glyph--mobile-app { --bg-feature-icon-url: url("../assets/bg-ai-mobile-app.svg"); }

  .bg-beangrower-ai-features__tile-glyph--pipelines { --bg-feature-icon-url: url("../assets/bg-ai-pipelines.svg"); }

  .bg-beangrower-ai-features__tile-glyph--pos-tap-to-pay { --bg-feature-icon-url: url("../assets/bg-ai-pos-tap-to-pay.svg"); }

  .bg-beangrower-ai-features__tile-glyph--reviews-reputation { --bg-feature-icon-url: url("../assets/bg-ai-reviews-reputation.svg"); }

  .bg-beangrower-ai-features__tile-glyph--sales-funnels { --bg-feature-icon-url: url("../assets/bg-ai-sales-funnels.svg"); }

  .bg-beangrower-ai-features__tile-glyph--social-media-planner { --bg-feature-icon-url: url("../assets/bg-ai-social-media-planner.svg"); }

  .bg-beangrower-ai-features__tile-glyph--vibe-coding { --bg-feature-icon-url: url("../assets/bg-ai-vibe-coding.svg"); }

  .bg-beangrower-ai-features__tile-glyph--virtual-phone-system { --bg-feature-icon-url: url("../assets/bg-ai-virtual-phone-system.svg"); }

  .bg-beangrower-ai-features__tile-glyph--website-tools { --bg-feature-icon-url: url("../assets/bg-ai-website-tools.svg"); }

  .bg-beangrower-ai-features__preview,
  .bg-beangrower-ai-features__detail { position: fixed; z-index: 50; box-sizing: border-box; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: 0 1.125rem 2.8125rem color-mix(in oklch, var(--text-dark) 22%, transparent); }

  .bg-beangrower-ai-features__preview { inline-size: min(20.3125rem, calc(100vw - 2rem)); padding: var(--space-s); pointer-events: auto; }

  .bg-beangrower-ai-features__preview::before { position: absolute; inset-block: 0; inline-size: 1rem; content: ''; }

  .bg-beangrower-ai-features__preview[data-position="right"]::before { inset-inline-end: 100%; }

  .bg-beangrower-ai-features__preview[data-position="left"]::before { inset-inline-start: 100%; }

  .bg-beangrower-ai-features__preview h3 { font-size: var(--text-l); line-height: 1.15; }

  .bg-beangrower-ai-features__preview p { margin-block-start: 0.3125rem; font-size: var(--text-s); line-height: 1.42; }

  .bg-beangrower-ai-features__preview p.bg-beangrower-ai-features__preview-highlight { color: var(--heading-color); font-size: var(--text-m); line-height: 1.3; }

  .bg-beangrower-ai-features__preview-open { display: inline-flex; align-items: center; gap: 0.375rem; margin-block-start: var(--space-s); padding: 0; border: 0; background: transparent; color: var(--relative-link-color, var(--link-color)); cursor: pointer; font: inherit; font-size: var(--text-s); font-weight: 800; line-height: 1.2; text-align: start; }

  .bg-beangrower-ai-features__preview-open:focus-visible { color: var(--primary-semi-dark); text-decoration: underline; outline: none; }

  .bg-beangrower-ai-features__preview-open:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 45%, transparent); outline-offset: 3px; }

  .bg-beangrower-ai-features__preview ul,
  .bg-beangrower-ai-features__detail-benefits { display: grid; gap: 0.3125rem; margin: var(--space-xs) 0 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-features__preview li,
  .bg-beangrower-ai-features__detail-benefits li { display: grid; grid-template-columns: 1.125rem 1fr; gap: 0.375rem; align-items: start; font-size: var(--text-s); line-height: 1.3; }

  .bg-beangrower-ai-features__preview li::before,
  .bg-beangrower-ai-features__detail-benefits li::before { display: grid; place-items: center; inline-size: 1.125rem; block-size: 1.125rem; border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--bg-soft-primary-text); content: '✓'; font-size: 0.6875rem; font-weight: 800; }

  .bg-beangrower-ai-features__detail { inline-size: min(29.6875rem, calc(100vw - 2rem)); max-block-size: min(38.75rem, calc(100vh - 2rem)); padding: var(--space-m); overflow: auto; }

  .bg-beangrower-ai-features__detail-top { display: flex; align-items: start; justify-content: space-between; gap: var(--space-s); }

  .bg-beangrower-ai-features__detail-label { margin: 0; }

  .bg-beangrower-ai-features__detail-close { display: grid; flex: 0 0 auto; place-items: center; inline-size: 2.125rem; block-size: 2.125rem; margin: calc(var(--space-xs) * -1); border: 0; border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--primary); cursor: pointer; font-size: 1.6875rem; line-height: 1; }

  .bg-beangrower-ai-features__detail-close:hover,
  .bg-beangrower-ai-features__detail-close:focus-visible { background: var(--primary); color: var(--white); outline: none; }

  .bg-beangrower-ai-features__detail-close:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 45%, transparent); outline-offset: 2px; }

  .bg-beangrower-ai-features__detail h3 { margin-block-start: var(--space-xs); color: var(--heading-color); font-size: var(--text-xl); line-height: 1.03; letter-spacing: -.04em; overflow-wrap: anywhere; white-space: normal; }

  .bg-beangrower-ai-features__detail-subheading { margin-block-start: 0.375rem; color: var(--primary); font-size: var(--text-m); font-weight: 700; line-height: 1.32; overflow-wrap: anywhere; white-space: normal; }

  .bg-beangrower-ai-features__detail-description { margin-block-start: var(--space-s); }

  .bg-beangrower-ai-features__detail-description p { font-size: var(--text-s); line-height: 1.52; overflow-wrap: anywhere; }

  .bg-beangrower-ai-features__detail-description p + p { margin-block-start: var(--space-s); }

  .bg-beangrower-ai-features__detail-benefits-heading { margin-block-start: var(--space-s); color: var(--heading-color); font-size: var(--text-s); font-weight: 700; line-height: 1.4; }

  .bg-beangrower-ai-features__detail-benefits { padding-block-start: var(--space-s); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-features__detail-benefits li > span { min-inline-size: 0; overflow-wrap: anywhere; }

  .bg-beangrower-ai-features__detail-note { margin-block-start: var(--space-m); font-size: var(--text-s); line-height: 1.52; }

  .bg-beangrower-ai-features__detail-outcome { margin-block-start: var(--space-s); padding: var(--space-xs) var(--space-s); border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.4; overflow-wrap: anywhere; }

  @media (hover: hover) and (pointer: fine) {
    .bg-beangrower-ai-features__tile:hover { border-color: var(--bg-feature-text); background: color-mix(in srgb, var(--body-bg-color) 80%, var(--bg-feature-surface)); box-shadow: 0 0.5rem 1.25rem color-mix(in srgb, var(--bg-feature-text) 16%, transparent); transform: translateY(-0.125rem); }
    .bg-beangrower-ai-features__preview-open:hover { color: var(--primary-semi-dark); text-decoration: underline; }
  }

  @container (inline-size < 90rem) {
    .bg-beangrower-ai-features__header { grid-template-columns: 1fr; align-items: start; }
    .bg-beangrower-ai-features__guide { max-inline-size: 35rem; }
    .bg-beangrower-ai-features__tiles--four { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bg-beangrower-ai-features__tile { padding-inline: 0.375rem; }
    .bg-beangrower-ai-features__tiles--three .bg-beangrower-ai-features__tile { padding-inline: 0.25rem; }
  }

  @container (inline-size < 70rem) {
    .bg-beangrower-ai-features__tiles--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size < 56rem) {
    .bg-beangrower-ai-features__categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-beangrower-ai-features__category--wide { grid-column: span 1; }
    .bg-beangrower-ai-features__category--full { grid-column: 1 / -1; }
    .bg-beangrower-ai-features__tiles--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size < 52rem) {
    .bg-beangrower-ai-features__category--full { grid-template-columns: 1fr; }
    .bg-beangrower-ai-features__tiles--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size < 39rem) {
    .bg-beangrower-ai-features__categories { grid-template-columns: 1fr; }
    .bg-beangrower-ai-features__category--full { grid-column: auto; }
    .bg-beangrower-ai-features__tiles--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @media (max-width: 63.99rem) {
    .bg-beangrower-ai-features__detail { inset: auto 0 0; inline-size: 100%; max-block-size: min(40.625rem, 78dvh); border-radius: var(--radius) var(--radius) 0 0; padding: var(--space-m) var(--space-m) calc(var(--space-m) + env(safe-area-inset-bottom)); }
    .bg-beangrower-ai-features__detail::before { display: block; inline-size: 2.625rem; block-size: 0.25rem; margin: calc(var(--space-xs) * -1) auto var(--space-xs); border-radius: var(--radius); background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); content: ''; }
  }

  @media (prefers-reduced-motion: reduce) { .bg-beangrower-ai-features__tile { transition: none; } }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  /* Let the existing heading use the full width of its grid track. */

  .bg-beangrower-ai-features__header > .bg-section-head.bg-beangrower-ai-features__section-header { inline-size: 100%; min-inline-size: 0; max-inline-size: none; }

  .bg-beangrower-ai-features__category-heading > span, .bg-beangrower-ai-features__guide-icon { background: var(--bg-primary-soft); color: var(--icon-color); color-scheme: var(--icon-scheme); box-shadow: none; }

  .bg-beangrower-ai-features__tile-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-features__tile:is(:hover, :focus-visible, .is-active) { background: var(--bg-primary-soft); border-color: var(--relative-link-color, var(--link-color)); }

  .bg-beangrower-ai-features__detail-benefits li::before, .bg-beangrower-ai-features__detail-close { background: var(--bg-primary-soft); color: var(--bg-soft-primary-text); }

  .bg-beangrower-ai-features__detail-close:is(:hover, :focus-visible) { background: var(--bg-primary-soft); color: var(--relative-heading-color, var(--heading-color)); }

  & :where(button, a):focus-visible { outline: var(--focus-width) solid var(--focus-color); outline-offset: var(--focus-offset); }
}
.bg-content-groups-02 {
  container-type: inline-size;
  & .bg-content-groups-02__container { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: var(--space-l); }
  & .bg-content-groups-02__header { display: grid; align-content: start; gap: var(--space-m); min-inline-size: 0; }
  & .bg-content-groups-02__body { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }
  & .bg-content-groups-02__heading { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.2; }
  & .bg-content-groups-02__panel { padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  & .bg-content-groups-02__list { display: grid; gap: var(--space-s); padding: 0; margin: 0; list-style: none; }
  & .bg-content-groups-02__item { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-xs); margin: 0; padding: 0; }
  & .bg-content-groups-02__copy { font-size: var(--text-m); color: var(--relative-text-color, var(--text-color)); line-height: 1.45; }
  & .bg-content-groups-02__tick { display: grid; place-items: center; inline-size: 1.25em; block-size: 1.25em; margin-block-start: 0.1em; border-radius: var(--radius-circle); background: var(--relative-link-color, var(--primary)); color: var(--bg-decoration-surface, var(--text-light)); font-weight: 700; line-height: 1; }
  & .bg-content-groups-02__insight { display: flex; align-items: start; gap: var(--space-s); padding: var(--space-s) var(--space-m); border: 1px solid color-mix(in oklch, var(--primary) 20%, transparent); border-radius: var(--radius); }
  & .bg-content-groups-02__insight-text { margin: 0; color: currentColor; font-size: var(--text-m); font-weight: 700; line-height: 1.45; }
  @container (inline-size < 64rem) { .bg-content-groups-02__container { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bg-content-groups-02__header { grid-column: 1 / -1; } }
  @container (inline-size < 48rem) { .bg-content-groups-02__container { grid-template-columns: minmax(0, 1fr); } }

  & .bg-content-groups-02__panel-header { display: flex; align-items: flex-start; gap: var(--space-s); min-inline-size: 0; }
  & .bg-content-groups-02__panel-header > .bg-icon { flex: 0 0 auto; }
  & .bg-content-groups-02__panel-header > .bg-content-groups-02__heading { min-inline-size: 0; }

  /* Optional panel-first content order; default overview layouts remain unchanged. */
  &[data-panel-position="middle"] .bg-content-groups-02__panel { order: 1; }
  &[data-panel-position="middle"] .bg-content-groups-02__content { order: 2; }

/* Optional checklist panel and callout treatments. */
&[data-left-list-treatment="panel"] .bg-content-groups-02__content > .bg-content-groups-02__list { gap: 0; padding: 0 var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: 0 .25rem .75rem color-mix(in oklch, var(--relative-text-color, var(--text-color)) 12%, transparent); }
&[data-left-list-treatment="panel"] .bg-content-groups-02__content .bg-content-groups-02__item { padding-block: var(--space-s); gap: var(--space-s); }
&[data-left-list-treatment="panel"] .bg-content-groups-02__content .bg-content-groups-02__item + .bg-content-groups-02__item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-s); }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel-header { display: contents; }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel .bg-icon { grid-column: 1; grid-row: 1; }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel .bg-content-groups-02__heading { grid-column: 2; font-size: var(--text-m); color: var(--bg-brand-accent, var(--primary)); font-weight: 700; line-height: 1.45; }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel > .bg-content-groups-02__body { grid-column: 2; line-height: 1.55; }
&[data-right-panel-treatment="callout"] .bg-content-groups-02__panel > .bg-content-groups-02__list:empty { display: none; }

/* Keep the supporting panel with the introduction when only one checklist is needed. */
&[data-panel-position="below-introduction"] .bg-content-groups-02__container {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: min-content 1fr;
  grid-template-areas: "intro content" "panel content";
}
&[data-panel-position="below-introduction"] .bg-content-groups-02__header { grid-area: intro; }
&[data-panel-position="below-introduction"] .bg-content-groups-02__content { grid-area: content; }
&[data-panel-position="below-introduction"] .bg-content-groups-02__panel { grid-area: panel; }
@container (inline-size < 48rem) {
  &[data-panel-position="below-introduction"] .bg-content-groups-02__container {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    grid-template-areas: "intro" "panel" "content";
  }
}

/* Optional additional group restores a third column beside the introduction/callout. */
&[data-panel-position="below-introduction"] .bg-content-groups-02__container:has(> [data-content-group="additional"]) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas: "intro content additional" "panel content additional";
}
&[data-panel-position="below-introduction"] .bg-content-groups-02__content[data-content-group="additional"] { grid-area: additional; }
@container (inline-size < 64rem) {
  &[data-panel-position="below-introduction"] .bg-content-groups-02__container:has(> [data-content-group="additional"]) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    grid-template-areas: "intro intro" "panel panel" "content additional";
  }
}
@container (inline-size < 48rem) {
  &[data-panel-position="below-introduction"] .bg-content-groups-02__container:has(> [data-content-group="additional"]) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "intro" "panel" "content" "additional";
  }
}

/* Optional introductory paragraphs retain normal prose spacing. */
& .bg-content-groups-02__paragraphs > p + p { margin-block-start: var(--paragraph-spacing); }
& .bg-content-groups-02__paragraphs > p[data-emphasis="true"] { font-weight: 700; color: var(--relative-heading-color, var(--heading-color)); }
  & .bg-content-groups-02__content, & .bg-content-groups-02__panel { display: grid; align-content: start; row-gap: 0; min-inline-size: 0; }
  & .bg-content-groups-02__content > * + *, & .bg-content-groups-02__panel > * + * { margin-block-start: var(--space-m); }
  & .bg-content-groups-02__heading + .bg-content-groups-02__body,
  & .bg-content-groups-02__panel-header + .bg-content-groups-02__body { margin-block-start: var(--paragraph-spacing); }
  &[data-right-panel-treatment="callout"] .bg-content-groups-02__panel { row-gap: 0; }
  &[data-right-panel-treatment="callout"] .bg-content-groups-02__panel > * + * { margin-block-start: var(--space-s); }
  &[data-right-panel-treatment="callout"] .bg-content-groups-02__panel-header + .bg-content-groups-02__body { margin-block-start: var(--paragraph-spacing); }
}
.bg-reviews {
  container-type: inline-size;

  --bg-reviews-avatar-size: 4rem;
  --bg-reviews-avatar-large-size: 5rem;
  --bg-reviews-avatar-position: 50% 45%;
  --bg-reviews-nav-size: 2.75rem;
  --bg-reviews-nav-icon-size: var(--icon-size-s);
  --bg-reviews-google-size: 1.25rem;
  --bg-reviews-star-size: 1rem;
  --bg-reviews-star-large-size: 1.25rem;
  /* Use imported ACSS blockquote controls instead of resetting paragraphs. */
  --blockquote-background: transparent;
  --blockquote-border-width: 0;
  --blockquote-padding: 0;
  --blockquote-text-font-size: inherit;
  --blockquote-text-line-height: inherit;
  --blockquote-text-font-weight: inherit;

  .bg-reviews__container {
    display: grid;
    gap: 0;
  }

  .bg-reviews__summary {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    justify-self: center;
    gap: calc(var(--space-xs) / 2);
    max-inline-size: 100%;
    margin-block-start: var(--space-s);
    padding: calc(var(--space-xs) / 2) var(--space-s);
    /* Stable badge: global heading ink with native light text; independent of brand accents. */
    background-color: var(--heading-color);
    color: var(--text-light);
    border: 1px solid var(--heading-color);
    border-radius: var(--radius);
    font-size: var(--text-m);
    font-weight: 600;
  }

  .bg-reviews__summary-muted {
    font-weight: 500;
  }

  .bg-reviews__rating {
    display: inline-flex;
    color: var(--bg-review-stars-color, var(--bg-brand-accent, var(--primary)));
  }

  .bg-reviews__rating--large {
    --bg-reviews-star-size: var(--bg-reviews-star-large-size);
  }

  .bg-reviews__stars {
    display: inline-flex;
    gap: calc(var(--space-xs) / 4);
  }

  .bg-reviews__star {
    position: relative;
    display: block;
    inline-size: var(--bg-reviews-star-size);
    block-size: var(--bg-reviews-star-size);
  }

  .bg-reviews__star > svg {
    opacity: 0.25;
  }

  .bg-reviews__star svg {
    display: block;
    inline-size: var(--bg-reviews-star-size);
    block-size: var(--bg-reviews-star-size);
    fill: currentColor;
  }

  /* Solid review stars must override outline rules on the asset's paths.
     Keep this exception inside the reviews stars; arrow icons stay outlined. */
  .bg-reviews__star svg path {
    fill: currentColor;
    stroke: none;
  }

  .bg-reviews__star-fill {
    position: absolute;
    inset: 0;
    clip-path: inset(0 100% 0 0);
  }

  /* Fractional stars use tenths; the accessible label keeps the exact rating. */
  .bg-reviews__star-fill--1 { clip-path: inset(0 90% 0 0); }
  .bg-reviews__star-fill--2 { clip-path: inset(0 80% 0 0); }
  .bg-reviews__star-fill--3 { clip-path: inset(0 70% 0 0); }
  .bg-reviews__star-fill--4 { clip-path: inset(0 60% 0 0); }
  .bg-reviews__star-fill--5 { clip-path: inset(0 50% 0 0); }
  .bg-reviews__star-fill--6 { clip-path: inset(0 40% 0 0); }
  .bg-reviews__star-fill--7 { clip-path: inset(0 30% 0 0); }
  .bg-reviews__star-fill--8 { clip-path: inset(0 20% 0 0); }
  .bg-reviews__star-fill--9 { clip-path: inset(0 10% 0 0); }
  .bg-reviews__star-fill--10 { clip-path: inset(0); }

  .bg-reviews__google-mark {
    flex: 0 0 auto;
    inline-size: var(--bg-reviews-google-size);
    block-size: var(--bg-reviews-google-size);
    object-fit: contain;
  }

  .bg-reviews__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    align-items: stretch;
    gap: var(--space-m);
    margin-block-start: var(--space-xl);
  }

  .bg-reviews__layout > :only-child {
    grid-column: 1 / -1;
  }

  .bg-reviews__layout:has(> .bg-reviews__card[hidden]) {
    grid-template-columns: minmax(0, 1fr);
  }

  .bg-reviews__featured,
  .bg-reviews__card {
    min-inline-size: 0;
    border-radius: var(--radius);
    padding: var(--space-l);
  }

  .bg-reviews__featured,
  .bg-reviews__review {
    display: grid;
    align-content: start;
    gap: 0;
  }

  .bg-reviews__featured-head,
  .bg-reviews__card-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-s);
  }

  .bg-reviews__featured-head {
    margin-block-end: var(--space-m);
  }

  .bg-reviews__card-head {
    margin-block-end: var(--space-s);
  }

  .bg-reviews__featured-tag,
  .bg-reviews__card-tag {
    font-size: var(--text-s);
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--bg-brand-accent, var(--primary));
  }

  .bg-reviews__featured-quote,
  .bg-reviews__quote {
    /* Remove blockquote margins: the card grid owns the surrounding space. */
    margin: 0;
    min-inline-size: 0;
    overflow-wrap: anywhere;
    line-height: 1.4;
  }

  .bg-reviews__featured-quote {
    font-size: var(--text-xl);
    font-weight: 500;
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-reviews__quote {
    font-size: var(--text-l);
  }

  .bg-reviews__quote-content {
    display: flow-root;
    /* Preserve Enter and blank lines in plain-text review fields. */
    white-space: pre-line;
  }

  .bg-reviews__quote-content :where(p) {
    font-size: inherit;
    line-height: inherit;
  }

  /* Deliberate rich-text paragraph spacing after the shared ACSS reset. */
  .bg-reviews__quote-content p + p {
    margin-block-start: var(--paragraph-spacing);
  }

  /* Keep summary first in HTML; place Show less below the expanded quotation. */
  .bg-reviews__disclosure[open] {
    display: flex;
    flex-direction: column-reverse;
  }

  .bg-reviews__disclosure-summary {
    display: block;
    list-style: none;
    cursor: pointer;
  }

  .bg-reviews__disclosure-summary::-webkit-details-marker {
    display: none;
  }

  .bg-reviews__quote-preview {
    display: block;
  }

  .bg-reviews__label--open,
  .bg-reviews__disclosure[open] .bg-reviews__label--closed,
  .bg-reviews__disclosure[open] .bg-reviews__quote-preview {
    display: none;
  }

  .bg-reviews__disclosure[open] .bg-reviews__label--open {
    display: inline;
  }

  .bg-reviews__card {
    display: flex;
    flex-direction: column;
    min-block-size: 20rem;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-reviews__slides {
    display: grid;
    gap: var(--space-l);
    flex: 1;
    min-inline-size: 0;
  }

  .bg-reviews__read-more {
    display: block;
    margin-block: calc(var(--space-xs) / 2) 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--bg-brand-accent, var(--primary));
    font: inherit;
    font-size: var(--text-s);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.2em;
    cursor: pointer;
  }

  .bg-reviews__read-more:hover {
    color: var(--relative-link-color-hover, var(--link-color-hover));
  }

  .bg-reviews__author {
    display: flex;
    align-items: center;
    gap: var(--space-s);
    margin-block-start: var(--space-s);
  }

  .bg-reviews__featured:not(:has(.bg-reviews__disclosure)) > .bg-reviews__author {
    margin-block-start: var(--space-m);
  }

  .bg-reviews__avatar {
    flex: 0 0 auto;
    inline-size: var(--bg-reviews-avatar-size);
    block-size: var(--bg-reviews-avatar-size);
    border-radius: var(--radius-circle);
    object-fit: cover;
    object-position: var(--bg-reviews-avatar-position);
  }

  .bg-reviews__avatar--large {
    inline-size: var(--bg-reviews-avatar-large-size);
    block-size: var(--bg-reviews-avatar-large-size);
  }

  .bg-reviews__author-meta {
    display: grid;
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-reviews__author-name {
    font-size: var(--text-m);
  }

  .bg-reviews__author-company,
  .bg-reviews__author-trade {
    font-size: var(--text-s);
  }

  .bg-reviews__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-s);
    margin-block-start: var(--space-m);
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }

  .bg-reviews__dots,
  .bg-reviews__nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--space-xs) / 2);
  }

  .bg-reviews__dot {
    display: inline-grid;
    place-items: center;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--bg-brand-accent, var(--primary));
    cursor: pointer;
  }

  .bg-reviews__dot::before {
    content: "";
    inline-size: 0.375rem;
    block-size: 0.375rem;
    border-radius: var(--radius-circle);
    background: color-mix(in oklch, var(--relative-text-color, var(--text-color)) 30%, transparent);
  }

  .bg-reviews__dot[aria-current="true"]::before {
    inline-size: 1.25rem;
    background: currentColor;
  }

  .bg-reviews__nav-button {
    display: inline-grid;
    place-items: center;
    inline-size: var(--bg-reviews-nav-size);
    block-size: var(--bg-reviews-nav-size);
    padding: 0;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius-circle);
    background: transparent;
    color: var(--relative-heading-color, var(--heading-color));
    cursor: pointer;
  }

  .bg-reviews__nav-button--active {
    border-color: var(--bg-ultra-light-link);
    background: var(--bg-ultra-light-link);
    color: var(--bg-ultra-light);
  }

  .bg-reviews__nav-icon,
  .bg-reviews__nav-icon svg {
    display: block;
    inline-size: var(--bg-reviews-nav-icon-size);
    block-size: var(--bg-reviews-nav-icon-size);
  }

  .bg-reviews__nav-button--previous .bg-reviews__nav-icon {
    rotate: 180deg;
  }

  .bg-reviews__disclosure-summary:focus-visible,
  .bg-reviews__nav-button:focus-visible,
  .bg-reviews__dot:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
  }

  .bg-reviews__status {
    position: absolute;
    overflow: hidden;
    inline-size: 1px;
    block-size: 1px;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  /* Preserve native hidden behaviour despite component display rules. */
  .bg-reviews__review[hidden],
  .bg-reviews__stars[hidden],
  .bg-reviews__rating-value[hidden],
  .bg-reviews__footer[hidden],
  .bg-reviews__card[hidden] {
    display: none;
  }

  @container (inline-size < 60rem) {
    .bg-reviews__layout {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  @container (inline-size < 38rem) {
    .bg-reviews__featured,
    .bg-reviews__card {
      padding: var(--space-m);
    }
  }

  /* Informational surfaces stay quiet; interactive focus rules remain distinct. */
}
.bg-mctb-how {
  
  min-inline-size: 0;
  scroll-margin-block-start: var(--space-xl);

  .bg-mctb-how__steps { display: grid; list-style: none; margin: 0; padding: 0; }
  .bg-mctb-how__step { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-s); }
  .bg-mctb-how__rail { display: flex; flex-direction: column; align-items: center; }
  .bg-mctb-how__step:not(:last-child) .bg-mctb-how__rail::after { content: ''; inline-size: 2px; flex: 1; min-block-size: var(--space-m); background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-mctb-how__number { display: grid; place-items: center; inline-size: calc(var(--text-l) * 2.5); aspect-ratio: 1; flex: none; border-radius: var(--radius); font-size: var(--text-l); font-weight: 700; line-height: 1; }
  .bg-mctb-how__step-copy { min-inline-size: 0; padding-block-start: var(--space-xs); }
  .bg-mctb-how__step:not(:last-child) .bg-mctb-how__step-copy { padding-block-end: var(--space-l); }
  .bg-mctb-how__step-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.3; }
  .bg-mctb-how__step-description, .bg-mctb-how__step-copy > p { margin-block-start: var(--space-xs); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }

  &.bg-mctb-how__conversation { display: grid; gap: var(--space-m); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-mctb-how__conversation-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-s); }
  .bg-mctb-how__conversation-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.35; }
  .bg-mctb-how__badge { padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; line-height: 1.4; }
  .bg-mctb-how__messages { display: flex; flex-direction: column; gap: var(--space-s); }
  .bg-mctb-how__message { display: grid; gap: var(--space-xs); inline-size: 90%; align-self: flex-start; }
  .bg-mctb-how__message--customer { align-self: flex-end; }
  .bg-mctb-how__message-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .04em; }
  .bg-mctb-how__message--customer .bg-mctb-how__message-label { text-align: end; }
  .bg-mctb-how__automatic { display: inline-flex; align-items: center; gap: calc(var(--space-xs) / 2); padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); }
  .bg-mctb-how__glyph { display: block; flex: none; inline-size: 1em; block-size: 1em; }
  .bg-mctb-how__bubble { padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  .bg-mctb-how__caption { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }

.bg-mctb-how__number, .bg-mctb-how__automatic { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-cta-specialist {
  container-type: inline-size;

  .bg-cta-specialist__panel {
    display: grid;
    grid-template-columns: minmax(0, 30rem) minmax(0, 1fr);
    gap: var(--space-xl);
    padding: clamp(var(--space-l), 5cqi, var(--space-xxl));
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
    box-shadow: 0 var(--space-xs) var(--space-l) color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent);
  }

  .bg-cta-specialist__content {
    display: grid;
    align-content: start;
    justify-items: start;
    gap: var(--space-m);
    padding-block: var(--space-s);
  }

  .bg-cta-specialist__head {
    max-inline-size: 43ch;
  }



  .bg-cta-specialist__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
    margin-block-start: var(--space-xs);
  }

  .bg-cta-specialist__reassurance {
    display: flex;
    align-items: flex-start;
    gap: var(--space-xs);
    max-inline-size: 43ch;
    margin: var(--space-xs) 0 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 600;
    line-height: 1.5;
  }

  .bg-cta-specialist__reassurance .bg-icon {
    flex: 0 0 auto;
  }

  .bg-cta-specialist__role {
    padding: var(--space-l);
    border-radius: var(--radius);
    box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

  .bg-cta-specialist__role-head {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-block-end: 0;
  }

  .bg-cta-specialist__role-mark {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: var(--icon-size-l);
    block-size: var(--icon-size-l);
    border-radius: var(--radius-circle);
    font-family: Georgia, serif;
    font-size: var(--text-l);
    font-weight: 700;
    font-style: italic;
  }

  .bg-cta-specialist__role-head h3,
  .bg-cta-specialist__notice h4 {
    margin: 0;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.3;
  }

  .bg-cta-specialist__role-list {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-cta-specialist__role-intro {
    margin: 0 0 var(--space-s);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.5;
  }

  .bg-cta-specialist__role-item,
  .bg-cta-specialist__notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-s);
    padding-block: var(--space-m);
    border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  }

  .bg-cta-specialist__role-item .bg-icon,
  .bg-cta-specialist__notice-icon .bg-icon {
    margin-block-start: 0.15em;
  }

  .bg-cta-specialist__role-content,
  .bg-cta-specialist__notice-content {
    margin: 0;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.5;
  }

  .bg-cta-specialist__role-content :where(p, ul, ol),
  .bg-cta-specialist__notice-content :where(p, ul, ol) {
    margin: 0;
  }

  .bg-cta-specialist__role-content :where(p, ul, ol) + :where(p, ul, ol),
  .bg-cta-specialist__notice-content :where(p, ul, ol) + :where(p, ul, ol) {
    margin-block-start: var(--paragraph-spacing);
  }

  .bg-cta-specialist__role-content :where(ul, ol),
  .bg-cta-specialist__notice-content :where(ul, ol) {
    padding-inline-start: var(--space-m);
  }

  .bg-cta-specialist__notice {
    padding-block-end: 0;
  }

  .bg-cta-specialist__notice-content {
    display: grid;
    gap: 0;
  }

  @container (inline-size < 68rem) {
    .bg-cta-specialist__panel {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }
  }

  @container (inline-size < 32rem) {
    .bg-cta-specialist__panel,
    .bg-cta-specialist__role {
      padding: var(--space-m);
    }

    .bg-cta-specialist__actions {
      display: grid;
      inline-size: 100%;
    }

    .bg-cta-specialist__actions .bg-button {
      inline-size: 100%;
      justify-content: center;
    }
  }.bg-cta-specialist__placeholder { border-radius: var(--radius); }
  .bg-cta-specialist__role-head + .bg-cta-specialist__role-intro,
  .bg-cta-specialist__notice-content > :is(h3, h4) + p { margin-block-start: var(--paragraph-spacing); }
}
.bg-charity {
  container-type: inline-size;

  .bg-charity__container {
    min-inline-size: 0;
  }

  .bg-charity__panel {
    display: grid;
    grid-template-columns: var(--grid-2);
    align-items: center;
    gap: var(--space-xl);
    padding: var(--space-xl);
    border-radius: var(--radius);
    min-inline-size: 0;
  }

  .bg-charity__copy {
    display: grid;
    gap: var(--space-s);
    justify-items: start;
    min-inline-size: 0;
  }

  .bg-charity__eyebrow {
    display: inline-flex;
    align-items: center;
    inline-size: max-content;
    max-inline-size: 100%;
    gap: calc(var(--space-xs) / 2);
    padding: 0.55em 1.15em;
    border-radius: var(--radius);
    font-size: var(--text-s);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .bg-charity__icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    inline-size: 1em;
    block-size: 1em;
    font-size: 1.4em;
    line-height: 1;
    transform: translateY(0.02em);
  }

  .bg-charity__title {
    max-inline-size: 22ch;
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.15;
    font-size: var(--h3);
    overflow-wrap: anywhere;
  }

  .bg-charity__text {
    max-inline-size: 48ch;
    font-size: var(--text-m);
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  .bg-charity__text strong {
    color: var(--relative-heading-color, var(--heading-color));
  }

  .bg-charity__stats {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-xs);
    /* Definition lists are outside the ACSS paragraph/heading margin reset. */
    margin-block: 0;
    min-inline-size: 0;
  }

  .bg-charity__stat {
    display: grid;
    gap: calc(var(--space-xs) / 3);
    padding: var(--space-s);
    border-radius: var(--radius);
    min-inline-size: 0;
  }

  .bg-charity__stat-value {
    grid-row: 1;
    font-size: var(--h4);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    overflow-wrap: anywhere;
  }

  .bg-charity__stat-label {
    grid-row: 2;
    font-size: var(--text-xs);
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .bg-charity__stat-label::first-letter {
    text-transform: uppercase;
  }

  @container (inline-size < 46rem) {
    .bg-charity__panel {
      grid-template-columns: var(--grid-1);
      gap: var(--space-m);
      padding: var(--space-l);
    }

    .bg-charity__title {
      max-inline-size: 20ch;
    }
  }

  @container (inline-size < 26rem) {
    .bg-charity__panel {
      padding: var(--space-m);
    }
  }
}
.bg-cis-explained {
  container-type: inline-size;
  & .bg-cis-explained__container {
    display: grid;
    gap: var(--space-l);
  }

  & .bg-cis-explained__head {
    display: grid;
    gap: var(--space-s);
    max-inline-size: 40.625rem;
  }

  & .bg-cis-explained__label {
    margin: 0;
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  & .bg-cis-explained__panel-title,
  & .bg-cis-explained__note p {
    margin: 0;
  }



  & .bg-cis-explained__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-m);
  }

  & .bg-cis-explained__panel {
    display: grid;
    align-content: start;
    gap: var(--space-m);
    min-inline-size: 0;
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    border-radius: var(--radius);
  }

  & .bg-cis-explained__panel--covered {
    border: 0;
  }

  & .bg-cis-explained__label {
    display: inline-flex;
    inline-size: fit-content;
    justify-self: start;
    padding: calc(var(--space-xs) / 2) var(--space-s);
    border-radius: var(--radius);
    font-size: var(--text-xs);
  }

  & .bg-cis-explained__panel-title {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h4);
    font-weight: 700;
    line-height: 1.3;
    text-wrap: balance;
  }

  & .bg-cis-explained__list {
    display: grid;
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  & .bg-cis-explained__list li {
    display: grid;
    grid-template-columns: 1.25em minmax(0, 1fr);
    align-items: start;
    gap: var(--space-xs);
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
  }

  & .bg-cis-explained__list li::before {
    content: '✓';
    display: grid;
    place-items: center;
    inline-size: calc(var(--text-m) * 1.25);
    block-size: calc(var(--text-m) * 1.25);
    margin-block-start: calc(var(--text-m) * .15);
    border-radius: var(--radius-circle);
    background: var(--bg-light);
    color: var(--bg-light-heading);
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
  }

  & .bg-cis-explained__note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-s);
    padding: var(--space-s) var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    border-inline-start: 3px solid var(--relative-link-color, var(--primary));
    border-radius: var(--radius);
  }

  & .bg-cis-explained__note-icon {
    display: grid;
    place-items: center;
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: var(--radius-circle);
    font-size: var(--text-m);
    font-weight: 700;
  }

  & .bg-cis-explained__note p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-m);
    line-height: 1.55;
  }

  & .bg-cis-explained__note strong {
    color: var(--relative-heading-color, var(--heading-color));
  }

  @container (inline-size < 48rem) {
    .bg-cis-explained__grid {
      grid-template-columns: 1fr;
    }
  }

  @container (inline-size < 30rem) {
    .bg-cis-explained__panel {
      padding: var(--space-m);
    }

    .bg-cis-explained__note {
      align-items: start;
      padding: var(--space-s);
    }
  }
}
.bg-beangrower-ai-software-stack {
  min-inline-size: 0;

  .bg-beangrower-ai-software-stack__highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .bg-beangrower-ai-software-stack__highlight {
    display: grid;
    grid-template-columns: 4.25rem minmax(0, 1fr);
    align-items: center;
    gap: var(--space-s);
    padding: var(--space-s);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-software-stack__highlight-icon,
  .bg-beangrower-ai-software-stack__new-icon {
    display: inline-grid;
    place-items: center;
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
    background-color: var(--bg-primary-soft);
    color: var(--icon-color);
  }

  .bg-beangrower-ai-software-stack__highlight-icon { inline-size: 4.25rem; block-size: 4.25rem; }

  .bg-beangrower-ai-software-stack__highlight-icon svg,
  .bg-beangrower-ai-software-stack__row-icon svg,
  .bg-beangrower-ai-software-stack__new-icon svg,
  .bg-beangrower-ai-software-stack__footer svg {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .bg-beangrower-ai-software-stack__highlight-icon svg { inline-size: 2rem; block-size: 2rem; }

  .bg-beangrower-ai-software-stack__highlight p { display: grid; gap: 0.1875rem; margin: 0; font-size: var(--text-m); line-height: 1.35; }

  .bg-beangrower-ai-software-stack__highlight strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); }

  .bg-beangrower-ai-software-stack__comparison {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(16.875rem, .9fr);
    gap: var(--space-m);
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-software-stack__table-wrap { min-inline-size: 0; overflow-x: auto; }

  .bg-beangrower-ai-software-stack__table {
    inline-size: 100%;
    min-inline-size: 35.625rem;
    border: 1px solid var(--border-color-dark, color-mix(in oklch, var(--neutral-light) 50%, transparent));
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--radius);
    overflow: hidden;
    font-size: var(--text-m);
  }

  .bg-beangrower-ai-software-stack__table th,
  .bg-beangrower-ai-software-stack__table td { padding: 0.5625rem 0.75rem; border-block-end: 1px solid var(--border-color-dark, color-mix(in oklch, var(--neutral-light) 50%, transparent)); text-align: start; vertical-align: middle; }

  .bg-beangrower-ai-software-stack__table thead th { background-color: var(--bg-primary-soft); color: var(--primary); font-size: var(--text-m); font-weight: 800; }

  .bg-beangrower-ai-software-stack__table tr > :first-child { inline-size: 46%; border-inline-end: 1px solid var(--border-color-dark, color-mix(in oklch, var(--neutral-light) 50%, transparent)); }

  .bg-beangrower-ai-software-stack__table tbody tr:last-child > * { border-block-end: 0; }

  .bg-beangrower-ai-software-stack__table tbody th { color: var(--heading-color); font-weight: 700; white-space: nowrap; }

  .bg-beangrower-ai-software-stack__table td { display: flex; flex-wrap: wrap; gap: 0.375rem; }

  .bg-beangrower-ai-software-stack__table td span { padding: 0.1875rem 0.75rem; border: 1px solid var(--border-color-dark, color-mix(in oklch, var(--neutral-light) 50%, transparent)); border-radius: var(--radius); background-color: var(--surface-1-background-color); font-size: var(--text-m); line-height: 1.15; white-space: nowrap; }

  .bg-beangrower-ai-software-stack__row-icon { display: inline-grid; place-items: center; inline-size: 1.75rem; block-size: 1.75rem; margin-inline-end: 0.5625rem; color: var(--primary); vertical-align: middle; }

  .bg-beangrower-ai-software-stack__row-icon svg { inline-size: 1.375rem; block-size: 1.375rem; }

  .bg-beangrower-ai-software-stack__benefit {
    display: grid;
    align-content: start;
    gap: var(--space-s);
    padding: var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }

  .bg-beangrower-ai-software-stack__benefit h3 { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: 1.2; letter-spacing: -0.03em; }

  .bg-beangrower-ai-software-stack__diagram { inline-size: min(100%, 18.75rem); justify-self: center; margin-block: var(--space-xs); }

  .bg-beangrower-ai-software-stack__diagram svg { display: block; inline-size: 100%; block-size: auto; }

  .bg-beangrower-ai-software-stack__diagram-colour { fill: var(--icon-color); }

  .bg-beangrower-ai-software-stack__benefit-list { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; font-size: var(--text-m); }

  .bg-beangrower-ai-software-stack__benefit-list li { position: relative; min-block-size: 1.375rem; padding-inline-start: 1.75rem; }

  .bg-beangrower-ai-software-stack__benefit-list li::before { position: absolute; inset-block-start: 50%; inset-inline-start: 0; inline-size: 1.125rem; block-size: 1.125rem; border-radius: var(--radius); background: var(--primary); content: ''; transform: translateY(-50%); }

  .bg-beangrower-ai-software-stack__benefit-list li::after { position: absolute; inset-block-start: calc(50% - 0.125rem); inset-inline-start: 0.3125rem; inline-size: 0.5rem; block-size: 0.25rem; border-block-end: 2px solid var(--white); border-inline-start: 2px solid var(--white); content: ''; transform: translateY(-50%) rotate(-45deg); }

  .bg-beangrower-ai-software-stack__new { padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-software-stack__new h3 { margin: 0 0 var(--space-s); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: 1.2; letter-spacing: -0.03em; }

  .bg-beangrower-ai-software-stack__new ul { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-s); margin: 0; padding: 0; list-style: none; }

  .bg-beangrower-ai-software-stack__new li { display: grid; justify-items: center; align-content: start; gap: 0.4375rem; min-block-size: 11.125rem; padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); background: var(--surface-1-background-color); text-align: center; }

  .bg-beangrower-ai-software-stack__new-icon { inline-size: 3.75rem; block-size: 3.75rem; border-color: var(--stack-icon-border, color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent)); color: var(--stack-icon-colour, var(--icon-color)); }

  .bg-beangrower-ai-software-stack__new-icon::before {
    display: block;
    inline-size: 62%;
    block-size: 62%;
    background-color: var(--stack-icon-colour, var(--icon-color));
    content: '';
    mask: var(--bg-stack-mask) center / contain no-repeat;
    -webkit-mask: var(--bg-stack-mask) center / contain no-repeat;
  }

  .bg-beangrower-ai-software-stack__new-icon svg { inline-size: 2.25rem; block-size: 2.25rem; }

  .bg-beangrower-ai-software-stack__new-icon--inbox { --bg-stack-mask: url("../assets/use-cases-multi-channel-inbox-mask-vector.svg"); }

  .bg-beangrower-ai-software-stack__new-icon--automation::before { content: none; }

  .bg-beangrower-ai-software-stack__new-icon--receptionist { --bg-stack-mask: url("../assets/use-cases-ai-receptionist-mask-vector.svg"); }

  .bg-beangrower-ai-software-stack__new-icon--chat { --bg-stack-mask: url("../assets/use-cases-website-chat-mask-vector.svg"); }

  .bg-beangrower-ai-software-stack__new-icon--automation { }

  .bg-beangrower-ai-software-stack__new-icon--missed-call { --bg-stack-mask: url("../assets/use-cases-missed-call-text-back-mask-vector.svg"); }

  .bg-beangrower-ai-software-stack__new strong { color: var(--heading-color); font-size: var(--text-m); line-height: 1.2; }

  .bg-beangrower-ai-software-stack__new p { margin: 0; font-size: var(--text-m); line-height: 1.35; }

  .bg-beangrower-ai-software-stack__footer { display: grid; grid-template-columns: 5.25rem minmax(0, 1fr); align-items: center; gap: var(--space-m); padding: var(--space-m) var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }

  .bg-beangrower-ai-software-stack__footer > span { display: grid; place-items: center; inline-size: 4.5rem; block-size: 4.5rem; border-radius: var(--radius); }

  .bg-beangrower-ai-software-stack__footer svg { inline-size: 2.5rem; block-size: 2.5rem; stroke-width: 1.85; }

  .bg-beangrower-ai-software-stack__footer p { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-xl); font-weight: 800; line-height: 1.2; letter-spacing: -0.035em; }

  .bg-beangrower-ai-software-stack__footer small { display: block; margin-block-start: 0.25rem; font-size: var(--text-m); }

  @container (inline-size < 76rem) {
    .bg-beangrower-ai-software-stack__comparison { grid-template-columns: 1fr; }
    .bg-beangrower-ai-software-stack__benefit { grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); align-items: center; }
    .bg-beangrower-ai-software-stack__benefit h3 { grid-column: 1 / -1; }
    .bg-beangrower-ai-software-stack__benefit-list { align-self: center; }
  }

  @container (inline-size < 58rem) {
    .bg-beangrower-ai-software-stack__highlights { grid-template-columns: 1fr; }
    .bg-beangrower-ai-software-stack__new ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .bg-beangrower-ai-software-stack__table {
      min-inline-size: 0;
      table-layout: fixed;
    }

    .bg-beangrower-ai-software-stack__table tr > :first-child {
      inline-size: 44%;
    }

    .bg-beangrower-ai-software-stack__table th,
    .bg-beangrower-ai-software-stack__table td {
      padding: 0.5rem;
      vertical-align: top;
    }

    .bg-beangrower-ai-software-stack__table td {
      display: table-cell;
    }

    .bg-beangrower-ai-software-stack__table td span {
      display: inline-flex;
      margin: 0.125rem;
    }

    .bg-beangrower-ai-software-stack__table tbody th {
      white-space: normal;
    }

    .bg-beangrower-ai-software-stack__row-icon {
      display: none;
    }
  }

  @container (inline-size < 42rem) {
    .bg-beangrower-ai-software-stack__comparison, .bg-beangrower-ai-software-stack__new { padding: var(--space-s); }
    .bg-beangrower-ai-software-stack__benefit { grid-template-columns: 1fr; }
    .bg-beangrower-ai-software-stack__benefit h3 { grid-column: auto; }
    .bg-beangrower-ai-software-stack__table { min-inline-size: 0; }
    .bg-beangrower-ai-software-stack__new ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bg-beangrower-ai-software-stack__footer { grid-template-columns: 3.625rem minmax(0, 1fr); gap: var(--space-s); padding: var(--space-s); }
    .bg-beangrower-ai-software-stack__footer > span { inline-size: 3.5rem; block-size: 3.5rem; }
    .bg-beangrower-ai-software-stack__footer svg { inline-size: 1.9375rem; block-size: 1.9375rem; }
    .bg-beangrower-ai-software-stack__footer p { font-size: var(--text-l); }
    .bg-beangrower-ai-software-stack__footer small { font-size: var(--text-m); }
  }

  @container (inline-size < 28rem) {
    .bg-beangrower-ai-software-stack__highlight { grid-template-columns: 3.5rem minmax(0, 1fr); }
    .bg-beangrower-ai-software-stack__highlight-icon { inline-size: 3.5rem; block-size: 3.5rem; }
    .bg-beangrower-ai-software-stack__new ul { grid-template-columns: 1fr; }
  }
  /* Slot content only: General Section / ACSS own outer width, columns and section spacing. */

  &.bg-beangrower-ai-software-stack__body { display: grid; row-gap: var(--space-m); }

  .bg-beangrower-ai-software-stack__table-note { margin-block: var(--space-s) 0; font-size: var(--text-s); line-height: 1.5; }

  .bg-beangrower-ai-software-stack__highlight-icon, .bg-beangrower-ai-software-stack__new-icon, .bg-beangrower-ai-software-stack__row-icon { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-software-stack__new-icon::before { background-color: currentColor; }

  .bg-beangrower-ai-software-stack__table thead th { background: var(--bg-primary-soft); color: var(--bg-soft-primary-text); }

  .bg-beangrower-ai-software-stack__benefit-list li::before { background: var(--bg-primary-soft); }

  .bg-beangrower-ai-software-stack__benefit-list li::after { border-color: var(--bg-soft-primary-text); }

  .bg-beangrower-ai-software-stack__footer > span.surface-secondary { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }
  /* Five capability cards: retain the central stagger, allow the fifth
     its own start (0/300/600/900/1200ms at the current shared setting). */
  .bg-beangrower-ai-software-stack__new > .u-motion-stagger { --bg-motion-stagger-limit: 4; }

}
.bg-hero--visual-none {
  &:is(.bg--dark,.bg--light,.surface-primary,.surface-secondary,.surface-tertiary,.bg-soft-primary,.bg-soft-secondary,.bg-soft-tertiary) {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
  --bg-hero-title-measure: min(100%, 28ch);

  & .bg-hero__lede {
    max-inline-size: 42rem;
  }

  &:not(.bg-hero--eyebrow-plain) .bg-hero__eyebrow:not(:is(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary, .bg-hero__eyebrow--accent, .bg--light, .bg--ultra-light, .bg--dark, .bg--ultra-dark)) {
    background: var(--bg-decoration-surface, var(--bg-light));
    color: var(--relative-link-color, var(--primary));
    border-color: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
  }

  & .bg-hero__trustline {
    border-block-start-color: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
    gap: var(--space-s) var(--space-m);
  }

  & .bg-hero__trustline-item--google {
    flex-wrap: wrap;
    row-gap: calc(var(--space-xs) / 2);
    color: var(--relative-heading-color, var(--heading-color));
  }

  & .bg-hero__credential-badge {
    border-color: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 20%, transparent);
    letter-spacing: .08em;
  }

  @container (inline-size < 52rem) {
    & .bg-hero__trustline-item--google { flex-basis: 100%; }
    & .bg-hero__trustline-item + .bg-hero__trustline-item { padding-inline-start: 0; }
    & .bg-hero__trustline-item + .bg-hero__trustline-item::before { content: none; }
    & .bg-hero__credential { flex-basis: 100%; margin-inline-start: 0; }
  }

  @container (inline-size < 37.5rem) {
    & .bg-hero__trust-label { flex-basis: 100%; }
  }
}

}
.bg-reviews-pricing {
  /* General Section owns the two columns, proportions and stacking. SectionHeader owns the heading. */
  min-inline-size: 0;
  &.bg-reviews-pricing__price-card { --bg-reviews-pricing-card-padding: var(--space-l); position: relative; display: grid; gap: var(--space-s); min-inline-size: 0; padding: var(--space-l); border: 2px solid var(--secondary-light); border-radius: var(--radius); container-type: inline-size; }
  .bg-reviews-pricing__offer { position: absolute; inset-block-start: 0; inset-inline-start: var(--bg-reviews-pricing-card-padding); transform: translateY(-50%); max-inline-size: calc(100% - var(--bg-reviews-pricing-card-padding) * 2); padding: .5em .75em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; }
  .bg-reviews-pricing__product { display: grid; gap: .4em; }
  .bg-reviews-pricing__brand { color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  .bg-reviews-pricing__product-title { font-size: var(--h3); line-height: 1.2; }
  .bg-reviews-pricing__price-row { display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: center; gap: var(--space-s) var(--space-m); }
  .bg-reviews-pricing__price { inline-size: max-content; max-inline-size: 100%; display: flex; align-items: baseline; gap: .3em; }
  .bg-reviews-pricing__amount { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: 800; line-height: 1; letter-spacing: -.04em; }
  .bg-reviews-pricing__period, .bg-reviews-pricing__fee { font-size: var(--text-s); line-height: 1.5; }
  .bg-reviews-pricing__features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-s) var(--space-m); list-style: none; margin: 0; padding: var(--space-m) 0 0; border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-reviews-pricing__feature { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-xs); font-size: var(--text-m); line-height: 1.5; }
  .bg-reviews-pricing__tick { display: grid; place-items: center; inline-size: 1.2em; aspect-ratio: 1; margin-block-start: .15em; border-radius: var(--radius-circle); }
  .bg-reviews-pricing__tick-glyph { inline-size: 70%; block-size: 70%; }
  .bg-reviews-pricing__actions { display: grid; gap: var(--space-s); }
  .bg-reviews-pricing__actions .bg-button-wrap, .bg-reviews-pricing__actions .bg-button { inline-size: 100%; }
  .bg-reviews-pricing__actions .bg-button { justify-content: center; }
  .bg-reviews-pricing__terms { color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); line-height: 1.5; font-weight: 600; text-align: center; }
  &.bg-reviews-pricing__details { display: grid; gap: var(--space-m); min-inline-size: 0; }
  /* Raised panels remain within the dark background; the mix follows its surface and heading tokens. */
  .bg-reviews-pricing__info-card { display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 14%, transparent); border-radius: var(--radius); background: color-mix(in oklch, var(--bg-dark) 92%, var(--relative-heading-color, var(--heading-color))); }
  .bg-reviews-pricing__info-head { display: flex; align-items: center; gap: var(--space-s); }
  .bg-reviews-pricing__chip { display: grid; place-items: center; flex-shrink: 0; inline-size: 2.5em; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-m); font-weight: 800; }
  .bg-reviews-pricing__whatsapp { inline-size: 1.4em; block-size: 1.4em; fill: currentColor; }
  .bg-reviews-pricing__info-title { font-size: var(--text-m); line-height: 1.3; }
  .bg-reviews-pricing__text, .bg-reviews-pricing__info-card > p { font-size: calc(var(--text-m) * .8); line-height: 1.6; }
  .bg-reviews-pricing__usage-link { justify-self: start; font-size: calc(var(--text-m) * .8); font-weight: 700; }
  .bg-reviews-pricing__guarantee { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); }
  .bg-reviews-pricing__seal { border: .3rem solid var(--primary-semi-light); display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 0 auto; inline-size: 6rem; aspect-ratio: 1; border-radius: var(--radius-circle); text-align: center; line-height: 1.1; }
  .bg-reviews-pricing__seal-number { font-size: var(--h4); }
  .bg-reviews-pricing__seal-label { max-inline-size: 5em; font-size: var(--text-s); font-weight: 700; }
  .bg-reviews-pricing__guarantee-copy { display: grid; flex: 1 1 13rem; gap: var(--space-xs); }
  /* Internal feature and price rows respond to the pricing card width. */
  @container (inline-size < 30rem) { .bg-reviews-pricing__features { grid-template-columns: minmax(0, 1fr); } }
  @container (inline-size < 36rem) {
    &.bg-reviews-pricing__price-card { --bg-reviews-pricing-card-padding: var(--space-m); padding: var(--space-l) var(--space-m) var(--space-m); }
  }
  @container (inline-size < 25rem) { .bg-reviews-pricing__price-row { grid-template-columns: minmax(0, 1fr); } }

  /* Store badge copy in sentence case; visual capitals belong to CSS. */
  .bg-reviews-pricing__offer { text-transform: uppercase; }
  .bg-reviews-pricing__usage-glyph { display: block; inline-size: 55%; block-size: 55%; }

/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-reviews-pricing__tick:not(.surface-primary, .surface-secondary), .bg-reviews-pricing__chip:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-reviews-pricing__tick:is(.surface-primary, .surface-secondary), .bg-reviews-pricing__chip:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

/* These headings sit on the native Dark relationship. */
.bg-reviews-pricing__info-title { color: var(--relative-heading-color, var(--heading-color)); }

}
.bg-button-wrap {
  display: inline-flex;

  & .bg-button {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    --icon-color-hover: currentColor;
  }

  & .bg-button__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: var(--icon-size, calc(var(--icon-size-s) * 1.2));
    block-size: var(--icon-size, calc(var(--icon-size-s) * 1.2));
    flex-shrink: 0;
    color: inherit;
  }

  & .bg-button__icon > svg[data-icon] {
    fill: currentColor;
  }

  /* Keep the resting icon unchanged for reduced-motion visitors. */
  @media (prefers-reduced-motion: no-preference) {
    & .btn-icon-slide [data-icon] {
      transition: transform var(--btn-icon-speed, var(--bg-motion-quick, 220ms)) var(--bg-motion-ease, ease);
      transform-origin: 50% 50%;
    }
    & .btn-icon-slide:is(:hover, :focus-visible) [data-icon] {
      transform: translateX(var(--btn-icon-shift, 0.25em)) rotate(var(--btn-icon-rotate, 0deg));
    }
  }

  /* Size is selected per Button instance; Normal inherits the ACSS default. */
  & .bg-button[data-button-size="large"] {
    --btn-padding-block: 1em;
    font-size: calc(var(--btn-font-size, var(--text-m)) * 1.05);
  }
  & .bg-button[data-button-size="extra-large"] {
    --btn-padding-block: 1.3em;
    font-size: calc(var(--btn-font-size, var(--text-m)) * 1.1);
  }

}
.bg-content-list-06 {
  --bg-content-list-06-card-surface: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 8%, transparent);
  --bg-content-list-06-panel-surface: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent);
  --bg-content-list-06-panel-border: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 20%, transparent);

  container-type: inline-size;

  & .bg-content-list-06__container {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    align-items: start;
    gap: var(--space-xl);
  }

  & .bg-content-list-06__intro {
    display: grid;
    align-content: start;
    gap: var(--space-m);
    max-inline-size: 35rem;
  }




  & .bg-content-list-06__reassurance {
    padding: var(--space-m);
    border: 1px solid var(--bg-content-list-06-panel-border);
    border-radius:var(--radius);
    background: var(--bg-content-list-06-panel-surface);
  }

  & .bg-content-list-06__reassurance p,
  & .bg-content-list-06__list-label,
  & .bg-content-list-06__tick .bg-icon {
    color: var(--bg-brand-accent, var(--primary));
  }

  & .bg-content-list-06__item p {
    margin: 0;
  }

  & .bg-content-list-06__reassurance p {
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-l);
    line-height: 1.6;
    text-wrap: pretty;
  }

  & .bg-content-list-06__reassurance strong {
    color: var(--relative-heading-color, var(--heading-color));
    font-weight: 700;
  }

  & .bg-content-list-06__list-wrap {
    display: grid;
    gap: var(--space-s);
  }

  & .bg-content-list-06__list-label {
    color: var(--bg-brand-accent, var(--primary));
    font-size: var(--text-m);
    font-weight: 800;
    line-height: 1.4;
  }

  & .bg-content-list-06__list {
    display: grid;
    grid-template-columns: var(--grid-2);
    gap: var(--space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  & .bg-content-list-06__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: var(--space-s);
    min-block-size: 3.5rem;
    padding: var(--space-s) var(--space-m);
    border: 1px solid var(--bg-content-list-06-panel-border);
    border-radius: var(--radius);
    background: var(--bg-content-list-06-card-surface);
  }

  & .bg-content-list-06__tick {

    align-self: start;
    display: inline-flex;
    margin-block-start: 0.15em;
    color: var(--bg-brand-accent, var(--primary));
  }

  & .bg-content-list-06__item p {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--text-m);
    font-weight: 700;
    line-height: 1.4;
    text-wrap: pretty;
  }

  @container (inline-size < 60rem) {
    .bg-content-list-06__container {
      grid-template-columns: 1fr;
      gap: var(--space-l);
    }

    .bg-content-list-06__intro {
      max-inline-size: 42.5rem;
    }
  }

  @container (inline-size < 42rem) {
    .bg-content-list-06__list {
      grid-template-columns: 1fr;
    }

    .bg-content-list-06__item {
      padding: var(--space-s);
    }
  }
}
.bg-content-list-01 {
  container-type: inline-size;

  & .bg-content-list-01__container {
    display: grid;
    grid-template-columns: var(--bg-content-list-01-columns, minmax(0, 1fr) minmax(0, 2fr));
    align-items: start;
    gap: var(--space-xl) var(--space-xxl);
  }
  & .bg-content-list-01__header { display: grid; row-gap: 0; min-inline-size: 0; }
  & .bg-content-list-01__insight {
    display: flex; align-items: flex-start; gap: var(--space-s);
    padding: var(--space-s) var(--space-m);
    border: 1px solid color-mix(in oklch, var(--primary) 20%, transparent);
    border-radius: var(--radius);
  }
  & .bg-content-list-01__insight-text { margin: 0; color: currentColor; font-size: var(--text-m); font-weight: 700; line-height: 1.45; }
  & .bg-content-list-01__list { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; min-inline-size: 0; }
  & .bg-content-list-01__item {
    display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s);
    margin: 0; padding: var(--space-s) var(--space-m);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
    border-radius: var(--radius);
  }
  & .bg-content-list-01__item:not(:has(.bg-icon)) { grid-template-columns: minmax(0, 1fr); }
  & .bg-content-list-01__copy { display: grid; gap: 0; min-inline-size: 0; }
  & .bg-content-list-01__title { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.25; }
  & .bg-content-list-01__text { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; }
  @container (inline-size < 48rem) {
    .bg-content-list-01__container { grid-template-columns: minmax(0, 1fr); gap: var(--space-l); }
  }

  /* Optional content used by address, dividend and other service details. */
  &[data-columns="40-60"] { --bg-content-list-01-columns: minmax(0, 2fr) minmax(0, 3fr); }
  & .bg-content-list-01__content { display: grid; align-content: start; min-inline-size: 0; gap: 0; }
  & .bg-content-list-01__content-heading { margin: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); }
  & .bg-content-list-01__body, & .bg-content-list-01__closing { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }
  & .bg-content-list-01__body strong, & .bg-content-list-01__closing strong { color: var(--relative-heading-color, var(--heading-color)); }
  & .bg-content-list-01__compact {
    display: grid; margin: 0; padding: var(--space-m); list-style: none; border-radius: var(--radius);
    border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent);
  }
  & .bg-content-list-01__compact-item { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); margin: 0; padding-block: var(--space-s); }
  & .bg-content-list-01__compact-item + .bg-content-list-01__compact-item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  & .bg-content-list-01__compact-item:first-child { padding-block-start: 0; }
  & .bg-content-list-01__compact-item:last-child { padding-block-end: 0; }
  & .bg-content-list-01__compact-copy { margin: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; }
  & .bg-content-list-01__tick { display: grid; place-items: center; inline-size: 1.25em; block-size: 1.25em; margin-block-start: 0.1em; border-radius: var(--radius-circle); background: var(--relative-link-color, var(--primary)); color: var(--bg-decoration-surface, var(--text-light)); font-weight: 700; line-height: 1; }

  & .bg-content-list-01__sublist { display: grid; gap: calc(var(--space-xs) / 2); margin: var(--space-xs) 0 0; padding-inline-start: var(--space-m); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.45; list-style: circle; }
  & .bg-content-list-01__sublist > li { margin: 0; padding: 0; }

  @container (inline-size >= 48rem) {
    &[data-compact-columns="2"] .bg-content-list-01__compact { position: relative; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-m); }
    &[data-compact-columns="2"] .bg-content-list-01__compact::before { content: ""; position: absolute; inset-block: var(--space-m); inset-inline-start: 50%; border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); pointer-events: none; }
    &[data-compact-columns="2"] .bg-content-list-01__compact-item { padding-block: 0; border-block-start: 0; }
  }

  /* Optional coloured checklist panel; existing cards and compact lists retain their defaults. */
  & .bg-content-list-01__panel { display: grid; align-content: start; gap: 0; min-inline-size: 0; padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  & .bg-content-list-01__panel-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
  & .bg-content-list-01__panel-list > .bg-content-list-01__compact-item { padding-block: var(--space-s); border-block-start: 0; }
  & .bg-content-list-01__panel-list > .bg-content-list-01__compact-item + .bg-content-list-01__compact-item { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  & .bg-content-list-01__panel-list > .bg-content-list-01__compact-item:first-child { padding-block-start: 0; }
  & .bg-content-list-01__panel-list > .bg-content-list-01__compact-item:last-child { padding-block-end: 0; }

  & .bg-content-list-01__panel-header { display: flex; align-items: flex-start; gap: var(--space-s); min-inline-size: 0; }
  & .bg-content-list-01__panel-header > .bg-icon { flex: 0 0 auto; }
  & .bg-content-list-01__panel-header > .bg-content-list-01__content-heading { min-inline-size: 0; }

/* Optional plain content variants; existing service defaults are unchanged. */
&[data-columns="45-55"] { --bg-content-list-01-columns: minmax(0, 9fr) minmax(0, 11fr); }
&[data-columns="50-50"] { --bg-content-list-01-columns: minmax(0, 1fr) minmax(0, 1fr); }
& .bg-content-list-01__text[data-emphasis="true"] { font-weight: 700; color: var(--relative-heading-color, var(--heading-color)); }
& .bg-content-list-01__plain-wrap { container-type: inline-size; }
& .bg-content-list-01__plain { column-count: 2; column-gap: calc(var(--space-l) * 2); column-rule: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); list-style: none; margin: 0; padding: 0; }
& .bg-content-list-01__plain > .bg-content-list-01__compact-item { break-inside: avoid; padding-block: 0 var(--space-xs); border: 0; }
& .bg-content-list-01__plain .bg-content-list-01__tick { color: var(--bg-brand-accent, var(--primary)); background: transparent; border: 1px solid currentColor; }
@container (inline-size < 32rem) { .bg-content-list-01__plain { column-count: 1; column-rule: 0; } }

& .bg-content-list-01__body[data-emphasis="true"] { font-weight: 700; color: var(--relative-heading-color, var(--heading-color)); }


  /* Keep layout-group spacing, but use normal spacing between consecutive prose paragraphs. */
  & .bg-content-list-01__header > * + * { margin-block-start: var(--space-l); }
  & .bg-content-list-01__header > .bg-content-list-01__body + .bg-content-list-01__body { margin-block-start: var(--paragraph-spacing); }
/* Title-only icon cards align their heading with the centre of the icon. */
& .bg-content-list-01__item:has(> .bg-icon):not(:has(.bg-content-list-01__text, .bg-content-list-01__sublist)) { align-items: center; }

/* Text-only content uses ordinary paragraph spacing without an empty list. */
&[data-list-style="text"] .bg-content-list-01__content { row-gap: 0; }
&[data-list-style="text"] .bg-content-list-01__content > * + * { margin-block-start: var(--space-l); }
&[data-list-style="text"] .bg-content-list-01__content > :is(h1, h2, h3, h4, h5, h6, p) + p { margin-block-start: var(--paragraph-spacing); }

/* Optional heading-above layout and two-column icon cards. */
&[data-heading-position="above"] .bg-content-list-01__container { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-l); }
@container (inline-size >= 48rem) {
  &[data-card-columns="2"] .bg-content-list-01__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-l); }
}
  /* Use normal prose spacing after content headings; card copy remains compact. */
  & .bg-content-list-01__content > * + *, & .bg-content-list-01__panel > * + * { margin-block-start: var(--space-m); }
  & .bg-content-list-01__content-heading + .bg-content-list-01__text,
  & .bg-content-list-01__panel-header + .bg-content-list-01__text { margin-block-start: var(--paragraph-spacing); }
  & .bg-content-list-01__copy > * + .bg-content-list-01__sublist { margin-block-start: calc(var(--space-xs) + var(--space-xs) / 4); }
}
.bg-db-reactivation-hero {
    /* Hero01 owns the outer layout, typography and shared CTA controls. */
  .bg-db-reactivation-hero__marker { min-inline-size: 0; min-block-size: 0; }
  .bg-db-reactivation-hero__lead { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-db-reactivation-hero__benefits {
    display: grid;
    gap: var(--space-xs);
    list-style: none;
    padding: 0;
    margin-block: 0 var(--space-m);
    font-size: var(--text-m);
    font-weight: 500;
  }
  .bg-db-reactivation-hero__benefit { display: flex; align-items: flex-start; gap: var(--space-xs); }
  .bg-db-reactivation-hero__benefit > .bg-db-reactivation-hero__glyph { color: var(--relative-link-color, var(--primary)); margin-block-start: .1em; }
  .bg-db-reactivation-hero__glyph { flex: none; inline-size: 1.4em; block-size: 1.4em; }
  .bg-db-reactivation-hero__offer {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--space-s) var(--space-m);
    margin-block-end: var(--space-m);
  }
  .bg-db-reactivation-hero__client-price { display: flex; flex: 1.65; inline-size: auto; min-inline-size: 0; align-items: center; gap: var(--space-xs); }
  .bg-db-reactivation-hero__amount {
    flex: none;
    color: var(--relative-heading-color, var(--heading-color));
    font-size: var(--h1);
    font-weight: var(--heading-font-weight);
    line-height: 1;
    letter-spacing: var(--heading-letter-spacing);
  }
  .bg-db-reactivation-hero__price-label, .bg-db-reactivation-hero__standard-price { font-size: var(--text-s); line-height: 1.4; }
  .bg-db-reactivation-hero__price-label { min-inline-size: 0; max-inline-size: 22ch; }
  .bg-db-reactivation-hero__standard-price {
    flex: 1;
    inline-size: auto;
    min-inline-size: 0;
    padding-inline-start: var(--space-m);
    border-inline-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
    color: var(--relative-text-color, var(--text-color));
  }
  .bg-db-reactivation-hero__terms { max-inline-size: 65ch; margin-block-start: var(--space-s); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-db-reactivation-hero__visual {
    container: db-reactivation-visual / inline-size;
    inline-size: min(100%, 36rem);
    min-inline-size: 0;
    justify-self: center;
    /* Remove default figure indentation; layout spacing belongs to Hero01. */
    margin: 0;
  }
  .bg-db-reactivation-hero__scene {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: start;
    justify-items: center;
    gap: var(--space-s);
    padding-block: var(--space-xxl) 0;
  }
  .bg-db-reactivation-hero__scene::before, .bg-db-reactivation-hero__scene::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    translate: -50% -50%;
    inline-size: 100%;
    aspect-ratio: 1;
    border-radius: var(--radius-circle);
    background: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 6%, transparent);
  }
  .bg-db-reactivation-hero__scene::after { inline-size: 76%; }
  .bg-db-reactivation-hero__panel { grid-column: 1 / -1; inline-size: 90%; border-radius: var(--radius); box-shadow: var(--box-shadow-2); overflow: hidden; }
  .bg-db-reactivation-hero__panel-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-db-reactivation-hero__panel-title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); }
  .bg-db-reactivation-hero__panel-title > .bg-db-reactivation-hero__glyph { color: var(--relative-link-color, var(--primary)); }
  .bg-db-reactivation-hero__contacts { list-style: none; padding: 0; }
  .bg-db-reactivation-hero__contact { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-xs); padding: var(--space-s); }
  .bg-db-reactivation-hero__contact + .bg-db-reactivation-hero__contact { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-db-reactivation-hero__avatar { display: grid; place-items: center; inline-size: 2.6em; aspect-ratio: 1; border-radius: var(--radius-circle); font-size: var(--text-s); font-weight: 700; }
  .bg-db-reactivation-hero__contact-copy { display: grid; gap: .2em; min-inline-size: 0; line-height: 1.35; }
  .bg-db-reactivation-hero__contact-name { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); }
  .bg-db-reactivation-hero__contact-detail { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  .bg-db-reactivation-hero__status { padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); font-size: var(--text-xs); font-weight: 600; line-height: 1.35; text-align: center; }
  .bg-db-reactivation-hero__card { position: absolute; padding: var(--space-s); border-radius: var(--radius); box-shadow: var(--box-shadow-1); }
  .bg-db-reactivation-hero__reply { position: static; inline-size: 100%; display: grid; gap: var(--space-xs); }
  .bg-db-reactivation-hero__reply-title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-link-color, var(--primary)); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
  .bg-db-reactivation-hero__reply-dot { flex: none; inline-size: .6em; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-db-reactivation-hero__reply-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.45; }
  .bg-db-reactivation-hero__booking { position: static; inline-size: 100%; display: flex; align-items: center; gap: var(--space-xs); }
  .bg-db-reactivation-hero__booking-icon { display: grid; place-items: center; flex: none; inline-size: 2.2em; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-db-reactivation-hero__booking-copy { display: grid; gap: .2em; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.35; }
  .bg-db-reactivation-hero__booking-detail { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  .bg-db-reactivation-hero__note { inset-inline-end: var(--space-xs); inset-block-start: var(--space-xs); font-family: var(--font-handwritten); font-size: calc(var(--text-l) * 1.1); font-weight: 600; line-height: 1.1; rotate: 4deg; }
  .bg-db-reactivation-hero__caption { padding-block-start: var(--space-s); color: var(--relative-text-color, var(--text-color)); text-align: center; font-size: var(--text-xs); }

  /* Hero01 controls section stacking. Narrow artwork uses normal flow. */
  @container db-reactivation-visual (inline-size < 26rem) {
    .bg-db-reactivation-hero__scene { grid-template-columns: minmax(0, 1fr); gap: var(--space-s); padding-block: var(--space-s); }
    .bg-db-reactivation-hero__panel { order: 1; inline-size: 100%; }
    .bg-db-reactivation-hero__card { position: static; inline-size: 100%; }
    .bg-db-reactivation-hero__note { order: 0; inline-size: fit-content; justify-self: end; margin-inline-end: var(--space-xs); }
    .bg-db-reactivation-hero__reply { order: 2; }
    .bg-db-reactivation-hero__booking { order: 3; }
  }
  @container db-reactivation-visual (inline-size < 20rem) {
    .bg-db-reactivation-hero__contact { grid-template-columns: auto minmax(0, 1fr); }
    .bg-db-reactivation-hero__contact > .bg-db-reactivation-hero__status { grid-column: 2; justify-self: start; }
  }
  /* Keep both prices beside one another except on narrow mobile layouts. */
  @container (inline-size < 24rem) {
    .bg-db-reactivation-hero__offer { flex-wrap: wrap; }
    .bg-db-reactivation-hero__client-price { flex-basis: 100%; }
    .bg-db-reactivation-hero__standard-price { flex: 0 1 auto; }
  }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-reactivation-hero__avatar:not(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-reactivation-hero__booking-icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-reactivation-hero__avatar:is(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-reactivation-hero__booking-icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

/* The shared custom-hero motion layer supplies the grid and glow. */
.bg-db-reactivation-hero__scene::before, .bg-db-reactivation-hero__scene::after { content: none; }
.bg-db-reactivation-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }
.bg-db-reactivation-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }

}
.bg-db-enquiry {
  min-inline-size: 0;
  &.bg-db-enquiry__copy { display: grid; gap: var(--space-m); }
  .bg-db-enquiry__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-db-enquiry__emphasis { color: var(--relative-heading-color, var(--heading-color)); }
  &.bg-db-enquiry__panel { container: db-enquiry-panel / inline-size; align-self: center; display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-enquiry__label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; }
  .bg-db-enquiry__sources { display: flex; flex-wrap: wrap; gap: var(--space-xs); list-style: none; padding: 0; }
  .bg-db-enquiry__source { padding: calc(var(--space-xs) / 2) var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); font-weight: 500; line-height: 1.4; }
  .bg-db-enquiry__connector { display: flex; justify-content: center; color: var(--relative-text-color, var(--text-color)); }
  .bg-db-enquiry__arrow { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); rotate: 90deg; }
  .bg-db-enquiry__outcomes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs); }
  .bg-db-enquiry__outcome { min-inline-size: 0; display: grid; align-content: start; gap: var(--space-xs); padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-enquiry__outcome-title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.35; }
  .bg-db-enquiry__icon { flex: none; inline-size: var(--icon-size-s); block-size: var(--icon-size-s); color: var(--relative-link-color, var(--primary)); }
  .bg-db-enquiry__outcome-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  @container db-enquiry-panel (inline-size < 24rem) {
    .bg-db-enquiry__outcomes { grid-template-columns: minmax(0, 1fr); }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-enquiry__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-enquiry__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-opportunities {
  min-inline-size: 0;
  /* General Section and ACSS own the section layout and outer spacing. */
  .bg-db-opportunities__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-s); margin: 0; padding: 0; list-style: none; }
  .bg-db-opportunities__card {  display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m); min-inline-size: 0; padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-opportunities__icon { display: grid; place-items: center; flex: none; inline-size: calc(var(--text-m) * 2.5); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-opportunities__glyph { display: block; inline-size: var(--text-l); block-size: var(--text-l); }
  .bg-db-opportunities__copy { display: grid; gap: var(--space-xs); }
  .bg-db-opportunities__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.3; }
  .bg-db-opportunities__description, .bg-db-opportunities__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  &.bg-db-opportunities__note { inline-size: min(100%, 85ch); margin-inline: auto; text-align: center; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  /* This is one four-item card list inside the section's content slot. */
  @container (inline-size >= 36rem) { .bg-db-opportunities__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @container (inline-size >= 64rem) { .bg-db-opportunities__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-opportunities__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-opportunities__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-process {
  min-inline-size: 0;
  /* General Section owns columns, stacking and ACSS section padding. */
  &.bg-db-process__card {  display: flex; flex-direction: column; align-self: stretch; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-process__step-head { display: flex; align-items: center; gap: var(--space-s); }
  .bg-db-process__number { display: grid; place-items: center; flex: none; inline-size: calc(var(--text-m) * 3); aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-xl); font-weight: 700; line-height: 1; }
  .bg-db-process__line { flex: 1; block-size: 2px; background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-db-process__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.3; }
  .bg-db-process__copy, &.bg-db-process__card > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-db-process__inbox { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s) var(--space-m); padding: var(--space-m); border-radius: var(--radius); }
  .bg-db-process__icon { display: grid; place-items: center; flex: none; inline-size: calc(var(--text-m) * 2.75); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-process__glyph { display: block; inline-size: var(--text-xl); block-size: var(--text-xl); }
  .bg-db-process__inbox-copy { flex: 1 1 30rem; min-inline-size: 0; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-db-process__inbox-heading { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-process__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-process__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

.bg-db-process__number { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-margins {
  min-inline-size: 0;
  /* General Section owns the two columns, stacking and ACSS outer padding. */
  &.bg-db-margins__copy { display: grid; gap: var(--space-s); align-self: center; }
  .bg-db-margins__paragraph, .bg-db-margins__text > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-db-margins__example {  display: grid; align-self: center; gap: var(--space-m); margin: 0; padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-margins__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.3; }
  .bg-db-margins__messages { display: grid; gap: var(--space-s); min-inline-size: 0; }
  .bg-db-margins__label { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
  .bg-db-margins__glyph { display: block; flex: none; inline-size: 1.25em; block-size: 1.25em; }
  .bg-db-margins__bubble { min-inline-size: 0; padding: var(--space-s); border-radius: var(--radius); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  .bg-db-margins__bubble--reply { justify-self: end; max-inline-size: 85%; }
  .bg-db-margins__caption { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  @container (inline-size < 36rem) { &.bg-db-margins__example { padding: var(--space-m); } }

}
.bg-db-marketing {
  min-inline-size: 0;
  /* General Section owns columns, responsive stacking and ACSS outer padding. */
  &.bg-db-marketing__intro { display: grid; gap: var(--space-l); }
  .bg-db-marketing__dashboard { margin: 0; padding: calc(var(--space-xs) / 2); border-radius: var(--radius); box-shadow: var(--box-shadow-2); transform: rotate(-1deg); }
  .bg-db-marketing__screen {  overflow: hidden; border-radius: var(--radius); }
  .bg-db-marketing__topbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-s); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-db-marketing__brand { display: inline-flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; }
  .bg-db-marketing__brand-icon { display: grid; place-items: center; flex: none; inline-size: 1.8em; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-marketing__campaign-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-db-marketing__screen-body { display: grid; gap: var(--space-s); padding: var(--space-s); }
  .bg-db-marketing__campaign-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.4; }
  .bg-db-marketing__stages, .bg-db-marketing__replies { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
  .bg-db-marketing__stage { display: flex; align-items: center; gap: var(--space-xs); }
  .bg-db-marketing__status { display: grid; place-items: center; flex: none; inline-size: 1.65em; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-db-marketing__status--pending { border: 2px dashed color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 40%, transparent); }
  .bg-db-marketing__stage-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-db-marketing__replies-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; letter-spacing: .05em; text-transform: uppercase; }
  .bg-db-marketing__reply { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); padding: var(--space-xs); border-radius: var(--radius); }
  .bg-db-marketing__badge { flex: none; padding: .3em .65em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.3; }
  .bg-db-marketing__reply-text { flex: 1 1 12rem; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-db-marketing__caption { padding: 0 var(--space-s) var(--space-s); text-align: center; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.4; }
  &.bg-db-marketing__benefits { display: grid; gap: var(--space-s); margin: 0; padding: 0; list-style: none; }
  .bg-db-marketing__benefit { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }
  .bg-db-marketing__icon { display: grid; place-items: center; inline-size: calc(var(--text-m) * 2.5); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-marketing__glyph { display: block; inline-size: 55%; block-size: 55%; }
  .bg-db-marketing__benefit-copy { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-db-marketing__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.35; }
  .bg-db-marketing__copy, .bg-db-marketing__benefit-copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  @container (inline-size < 36rem) { .bg-db-marketing__dashboard { transform: none; } }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-marketing__brand-icon:not(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-marketing__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-marketing__brand-icon:is(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-marketing__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-calculator {
  min-inline-size: 0;
  &.bg-db-calculator__form, &.bg-db-calculator__results { align-self: stretch; padding: var(--space-l);  border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-calculator__fields { display: flex; flex-direction: column; gap: var(--space-m); min-inline-size: 0; margin: 0; padding: 0; border: 0; }
  .bg-db-calculator__form-title { inline-size: 100%; padding: 0 0 var(--space-m); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.35; }
  .bg-db-calculator__field { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-db-calculator__label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 600; line-height: 1.4; }
  .bg-db-calculator__input-wrap { display: flex; align-items: center; gap: var(--space-xs); min-inline-size: 0; padding-inline: var(--space-s); border: 2px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 20%, transparent); border-radius: var(--radius);  }
  .bg-db-calculator__input-wrap:focus-within { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: 3px; }
  .bg-db-calculator__input { inline-size: 100%; min-inline-size: 0; min-block-size: 3rem; padding-block: var(--space-xs); padding-inline: 0; border: 0; border-radius: 0; background: transparent; color: var(--relative-heading-color, var(--heading-color)); font: inherit; font-size: var(--text-l); font-weight: 700; }
  .bg-db-calculator__input:focus { outline: none; }
  .bg-db-calculator__affix { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-l); font-weight: 700; }
  .bg-db-calculator__hint { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-db-calculator__error { padding: var(--space-s); border-radius: var(--radius); font-size: var(--text-m); }
  .bg-db-calculator__fields .bg-button-wrap, .bg-db-calculator__fields .bg-button { inline-size: 100%; }
  .bg-db-calculator__fields .bg-button { justify-content: center; }
  &.bg-db-calculator__results { display: flex; flex-direction: column; justify-content: center; gap: var(--space-m); }
  .bg-db-calculator__results-title { color: var(--relative-link-color, var(--primary)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; }
  .bg-db-calculator__metric { display: grid; gap: var(--space-xs); min-inline-size: 0; padding: var(--space-m); border-radius: var(--radius); }
  .bg-db-calculator__number { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: 700; line-height: 1.1; overflow-wrap: anywhere; }
  .bg-db-calculator__metric-label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.4; }
  .bg-db-calculator__explanation { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.55; }
  .bg-db-calculator__disclaimer { max-inline-size: var(--width-l); margin-inline: auto; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; text-align: center; }
  @container (inline-size < 36rem) {
    &.bg-db-calculator__form, &.bg-db-calculator__results { padding: var(--space-m); }
  }
}
.bg-db-value {
  min-inline-size: 0;
  /* ACSS and General Section own outer spacing, columns and stacking. */
  &.bg-db-value__copy { display: grid; align-self: center; gap: var(--space-s); }
  .bg-db-value__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-db-value__diagram { --bg-db-value-line: var(--primary-semi-light); container: db-value / inline-size; align-self: center; }
  .bg-db-value__customer { display: flex; align-items: center; gap: var(--space-s); inline-size: fit-content; max-inline-size: 100%; margin-inline: auto; padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-link-color, var(--primary)) 20%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-1); }
  .bg-db-value__icon { display: grid; place-items: center; flex: none; inline-size: calc(var(--text-m) * 2.5); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-value__glyph { display: block; inline-size: 55%; block-size: 55%; }
  .bg-db-value__label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.4; }
  .bg-db-value__stem { inline-size: 2px; block-size: var(--space-m); margin-inline: auto; background: var(--bg-db-value-line); }
  .bg-db-value__outcomes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
  .bg-db-value__outcome { position: relative; display: flex; min-inline-size: 0; padding: var(--space-m) calc(var(--space-xs) / 2) 0; }
  .bg-db-value__outcome::before { content: ''; position: absolute; inset-block-start: 0; inset-inline: 0; block-size: 2px; background: var(--bg-db-value-line); }
  .bg-db-value__outcome:first-child::before { inset-inline-start: 50%; }
  .bg-db-value__outcome:last-child::before { inset-inline-end: 50%; }
  .bg-db-value__outcome::after { content: ''; position: absolute; inset-block-start: 0; inset-inline-start: calc(50% - 1px); inline-size: 2px; block-size: var(--space-m); background: var(--bg-db-value-line); }
  .bg-db-value__outcome-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-xs); inline-size: 100%; min-inline-size: 0; padding: var(--space-s) var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-link-color, var(--primary)) 12%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-1); text-align: center; }
  /* Narrow illustrations keep three branches on a vertical rail for readable labels. */
  @container db-value (inline-size < 30rem) {
    .bg-db-value__customer { margin-inline-start: 0; }
    .bg-db-value__stem { margin-inline-start: var(--space-m); }
    .bg-db-value__outcomes { grid-template-columns: minmax(0, 1fr); }
    .bg-db-value__outcome { padding: var(--space-xs) 0 var(--space-xs) calc(var(--space-m) + var(--space-l)); }
    .bg-db-value__outcome::before, .bg-db-value__outcome:first-child::before, .bg-db-value__outcome:last-child::before { inset-inline-start: var(--space-m); inset-inline-end: auto; inset-block-start: 50%; inline-size: var(--space-l); block-size: 2px; }
    .bg-db-value__outcome::after { inset-inline-start: var(--space-m); inset-block: 0; block-size: auto; }
    .bg-db-value__outcome:last-child::after { inset-block-end: 50%; }
    .bg-db-value__outcome-card { flex-direction: row; justify-content: flex-start; gap: var(--space-s); padding: var(--space-s); text-align: start; }
  }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-value__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-value__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-prepared {
  min-inline-size: 0;
  /* General Section owns columns, stacking and ACSS section padding. */
  &.bg-db-prepared__copy { display: grid; align-self: center; gap: var(--space-m); container: db-prepared-copy / inline-size; }
  .bg-db-prepared__description { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-db-prepared__scope { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-db-prepared__inputs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
  .bg-db-prepared__input { display: grid; justify-items: center; align-content: start; gap: var(--space-xs); min-inline-size: 0; padding: var(--space-s) var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 12%, transparent); border-radius: var(--radius); text-align: center; }
  .bg-db-prepared__input-icon { display: grid; place-items: center; inline-size: calc(var(--text-m) * 2.25); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-db-prepared__input-label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; line-height: 1.4; }
  &.bg-db-prepared__panel {  display: grid; align-self: center; gap: var(--space-m); padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-db-prepared__panel-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-s); }
  .bg-db-prepared__panel-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h4); line-height: 1.3; }
  .bg-db-prepared__badge { display: inline-flex; padding: .5em .75em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .05em; }
  .bg-db-prepared__list { display: grid; list-style: none; margin: 0; padding: 0; }
  .bg-db-prepared__item { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-s); padding-block-end: var(--space-s); }
  .bg-db-prepared__item:last-child { padding-block-end: 0; }
  .bg-db-prepared__item:not(:last-child)::before { content: ''; position: absolute; inset-inline-start: calc(1rem - 1px); inset-block-start: 2rem; inset-block-end: 0; inline-size: 2px; background: var(--primary-semi-light); }
  .bg-db-prepared__tick { position: relative; display: grid; place-items: center; inline-size: 2rem; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-db-prepared__glyph { display: block; inline-size: 55%; block-size: 55%; }
  .bg-db-prepared__item-text, .bg-db-prepared__item > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }
  @container db-prepared-copy (inline-size < 22rem) {
    .bg-db-prepared__inputs { grid-template-columns: minmax(0, 1fr); }
    .bg-db-prepared__input { grid-template-columns: auto minmax(0, 1fr); align-items: center; justify-items: start; gap: var(--space-s); padding: var(--space-s); text-align: start; }
  }
  @container (inline-size < 36rem) { &.bg-db-prepared__panel { padding: var(--space-m); } }

/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-db-prepared__input-icon:not(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-prepared__tick:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-db-prepared__input-icon:is(.surface-primary, .surface-secondary, .surface-tertiary), .bg-db-prepared__tick:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-db-pricing {
  /* Existing pricing-card styling is shared with Reviews and MCTB. General Section owns columns and outer ACSS spacing. */
  min-inline-size: 0;
  .bg-db-pricing__usage { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  &.bg-db-pricing__details { align-content: start; }
  .bg-db-pricing__control-card { display: grid; gap: var(--space-s); padding: var(--space-m); border-radius: var(--radius); }
  .bg-db-pricing__glyph { display: block; inline-size: 55%; block-size: 55%; }

}
.bg-db-cta {
  display: grid;
  justify-items: center;
  gap: var(--space-s);
  text-align: center;
  .bg-db-cta__actions { display: flex; justify-content: center; inline-size: 100%; }
  .bg-db-cta__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs) var(--space-m); list-style: none; padding-inline-start: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; }
  .bg-db-cta__terms { max-inline-size: 75ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-db-cta__terms a { color: var(--relative-link-color, var(--link-color)); text-decoration: underline; text-underline-offset: .16em; }
  .bg-db-cta__terms a:focus-visible { outline: 2px solid var(--relative-link-color, var(--primary)); outline-offset: .2em; }
  @container (inline-size < 36rem) {
    .bg-db-cta__actions .bg-button-wrap, .bg-db-cta__actions .bg-button { inline-size: 100%; }
    .bg-db-cta__actions .bg-button { justify-content: center; }
  }
}
.bg-service-notice {
  text-align: center;
inline-size: 100%;
}
.bg-receptionist-hero {
  /* Hero01 owns the outer section, heading, copy scale and buttons. */
  .bg-receptionist-hero__marker { min-inline-size: 0; min-block-size: 0; }
  .bg-receptionist-hero__lead { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-receptionist-hero__details { display: grid; gap: var(--space-s); margin-block-start: var(--space-s); inline-size: 100%; }
  .bg-receptionist-hero__demo-note { max-inline-size: 65ch; font-size: var(--text-s); color: var(--relative-text-color, var(--text-color)); }
  .bg-receptionist-hero__demo-note strong { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-receptionist-hero__features { display: flex; flex-wrap: wrap; gap: var(--space-xs); list-style: none; padding: 0; }
  .bg-receptionist-hero__chip { padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); line-height: 1.35; }
  .bg-receptionist-hero__offer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s) var(--space-m); }
  .bg-receptionist-hero__client-price { display: flex; align-items: center; gap: var(--space-xs); inline-size: auto; }
  .bg-receptionist-hero__amount { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: var(--heading-font-weight); line-height: 1; letter-spacing: var(--heading-letter-spacing); }
  .bg-receptionist-hero__price-label, .bg-receptionist-hero__standard-price { font-size: var(--text-s); line-height: 1.4; }
  .bg-receptionist-hero__standard-price { inline-size: auto; padding-inline-start: var(--space-m); border-inline-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent); color: var(--relative-text-color, var(--text-color)); }
  .bg-receptionist-hero__terms { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-receptionist-hero__terms a { text-decoration: underline; text-underline-offset: .16em; }
  .bg-receptionist-hero__visual { container: receptionist-visual / inline-size; inline-size: min(100%, 36rem); min-inline-size: 0; justify-self: center; /* Remove the browser's default figure indentation. */ margin: 0; }
  .bg-receptionist-hero__scene { position: relative; isolation: isolate; display: grid; justify-items: center; padding-block: var(--space-l) calc(var(--space-xl) + var(--space-m)); }
  .bg-receptionist-hero__scene::before, .bg-receptionist-hero__scene::after { content: ''; position: absolute; z-index: -1; inset-inline-start: 50%; inset-block-start: 50%; translate: -50% -50%; inline-size: 100%; aspect-ratio: 1; border-radius: var(--radius-circle); background: color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 6%, transparent); }
  .bg-receptionist-hero__scene::after { inline-size: 76%; }
  .bg-receptionist-hero__phone { justify-self: start; margin-inline-start: 8%; inline-size: 60%; padding: calc(var(--space-xs) / 2); border-radius: var(--radius); overflow: hidden; box-shadow: 0 var(--space-s) var(--space-xl) color-mix(in srgb, var(--base) 30%, transparent); }
  .bg-receptionist-hero__phone-header { display: grid; justify-items: center; gap: calc(var(--space-xs) / 2); padding: var(--space-m) var(--space-xs) var(--space-s); text-align: center; }
  .bg-receptionist-hero__name { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); }
  .bg-receptionist-hero__phone-subtitle { font-size: var(--text-xs); color: var(--relative-text-color, var(--text-color)); }
  .bg-receptionist-hero__icon { display: inline-grid; place-items: center; flex: none; inline-size: 2.5em; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-hero__avatar { inline-size: 3.5rem; border-radius: var(--radius-circle); }
  .bg-receptionist-hero__glyph { inline-size: 1.4em; block-size: 1.4em; flex: none; }
  .bg-receptionist-hero__avatar .bg-receptionist-hero__glyph { inline-size: 1.8rem; block-size: 1.8rem; }
  .bg-receptionist-hero__wave { display: flex; align-items: center; gap: .2rem; block-size: 1.25rem; margin-block-start: calc(var(--space-xs) / 2); }
  .bg-receptionist-hero__wave-bar { inline-size: .2rem; min-inline-size: 0; min-block-size: 0; block-size: 45%; border-radius: var(--radius); }
  .bg-receptionist-hero__wave-bar:nth-child(2n) { block-size: 85%; }
  .bg-receptionist-hero__wave-bar:nth-child(3n) { block-size: 65%; }
  .bg-receptionist-hero__wave-bar:nth-child(4) { block-size: 100%; }
  .bg-receptionist-hero__conversation { display: grid; gap: var(--space-xs); padding: var(--space-s) var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); line-height: 1.4; }
  .bg-receptionist-hero__call-label { text-align: center; text-transform: uppercase; font-size: var(--text-xs); letter-spacing: .06em; color: var(--relative-text-color, var(--text-color)); }
  .bg-receptionist-hero__message { max-inline-size: 94%; padding: var(--space-xs); border-radius: var(--radius); }
  .bg-receptionist-hero__customer { justify-self: end; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-receptionist-hero__card { position: absolute; border-radius: var(--radius); box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in srgb, var(--base) 20%, transparent); font-size: var(--text-s); line-height: 1.4; }
  .bg-receptionist-hero__booked { inset-inline-start: 0; inset-block-start: 0; inline-size: 49%; padding: var(--space-xs); display: flex; align-items: center; gap: var(--space-xs); }
  .bg-receptionist-hero__card-copy { display: grid; gap: .2em; }
  .bg-receptionist-hero__card-copy strong { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-receptionist-hero__muted { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  .bg-receptionist-hero__chat { inset-inline-end: -4%; inset-block-start: 13rem; inline-size: 34%; overflow: hidden; }
  .bg-receptionist-hero__chat-header { display: flex; align-items: center; gap: calc(var(--space-xs) / 2); padding: var(--space-xs); font-size: var(--text-xs); }
  .bg-receptionist-hero__online { flex: none; inline-size: .5rem; block-size: .5rem; min-inline-size: 0; min-block-size: 0; border-radius: var(--radius-circle); }
  .bg-receptionist-hero__chat-messages { display: grid; gap: var(--space-xs); padding: var(--space-xs); }
  .bg-receptionist-hero__chat-messages .bg-receptionist-hero__message { font-size: var(--text-xs); }
  .bg-receptionist-hero__summary { inset-inline-end: 0; inset-block-end: 0; inline-size: 54%; padding: var(--space-s); display: grid; gap: var(--space-xs); }
  .bg-receptionist-hero__summary-heading { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-xs); text-transform: uppercase; letter-spacing: .04em; }
  .bg-receptionist-hero__summary-heading .bg-receptionist-hero__icon { inline-size: 2em; }
  .bg-receptionist-hero__note { position: absolute; inset-inline-start: 0; inset-block-end: var(--space-s); inline-size: max-content; max-inline-size: 43%; padding: var(--space-xs) var(--space-s); border-radius: var(--radius); rotate: -5deg; font-family: var(--font-handwritten); font-size: calc(var(--text-l) * 1.1); font-weight: 600; line-height: 1.1; box-shadow: 0 var(--space-xs) var(--space-m) color-mix(in srgb, var(--base) 16%, transparent); }
  .bg-receptionist-hero__caption { text-align: center; padding-block-start: var(--space-s); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  /* Hero01 stacks its columns below 62rem. The artwork then uses its own width. */
  @container receptionist-visual (inline-size < 26rem) {
    .bg-receptionist-hero__scene { gap: var(--space-s); padding-block: var(--space-s); }
    .bg-receptionist-hero__phone { inline-size: min(100%, 22rem); justify-self: center; margin-inline-start: 0; }
    .bg-receptionist-hero__card { position: static; inline-size: min(100%, 22rem); }
    .bg-receptionist-hero__booked { order: -1; }
    .bg-receptionist-hero__chat { order: 1; }
    .bg-receptionist-hero__summary { order: 2; }
    .bg-receptionist-hero__note { position: static; order: 3; justify-self: center; max-inline-size: 100%; }
  }
  @container (inline-size < 24rem) {
    .bg-receptionist-hero__offer { gap: var(--space-s); }
    .bg-receptionist-hero__standard-price { padding-inline-start: var(--space-s); }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-hero__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-hero__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

/* The shared custom-hero motion layer supplies the grid and glow. */
.bg-receptionist-hero__scene::before, .bg-receptionist-hero__scene::after { content: none; }
.bg-receptionist-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }
.bg-receptionist-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }

}
.bg-receptionist-cost {
  min-inline-size: 0;
  &.bg-receptionist-cost__copy { display: grid; gap: var(--space-m); }
  .bg-receptionist-cost__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-cost__emphasis { color: var(--relative-heading-color, var(--heading-color)); }
  &.bg-receptionist-cost__comparison { display: grid; gap: var(--space-s); align-self: center; }
  .bg-receptionist-cost__panel { container: receptionist-call-journey / inline-size; display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-receptionist-cost__label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; }
  .bg-receptionist-cost__journey { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); padding: 0; list-style: none; }
  .bg-receptionist-cost__step { display: flex; align-items: center; gap: var(--space-xs); min-inline-size: 0; }
  .bg-receptionist-cost__chip { display: inline-block; padding: var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; line-height: 1.4; }
  .bg-receptionist-cost__arrow { flex: none; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-l); line-height: 1; }
  /* Keep each journey in reading order on narrow cards. General Section owns the outer columns. */
  @container receptionist-call-journey (inline-size < 24rem) {
    .bg-receptionist-cost__journey { display: grid; grid-template-columns: minmax(0, 1fr); }
    .bg-receptionist-cost__step { flex-direction: column; align-items: stretch; }
    .bg-receptionist-cost__chip { text-align: center; }
    .bg-receptionist-cost__arrow { align-self: center; rotate: 90deg; }
  }
}
.bg-receptionist-demo {
  min-inline-size: 0;
  &.bg-receptionist-demo__intro { display: grid; justify-items: center; gap: var(--space-m); text-align: center; }
  .bg-receptionist-demo__demo-badge { inline-size: fit-content; display: inline-flex; align-items: center; gap: var(--space-xs); padding: calc(var(--space-xs) / 2) var(--space-s) calc(var(--space-xs) / 2) calc(var(--space-xs) / 2); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; line-height: 1.4; max-inline-size: 100%; }
  &.bg-receptionist-demo__card { display: flex; flex-direction: column; align-self: stretch; gap: var(--space-s); padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-receptionist-demo__label-row { display: flex; align-items: center; gap: var(--space-s); }
  .bg-receptionist-demo__label { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; }
  .bg-receptionist-demo__icon { display: inline-grid; place-items: center; flex: none; inline-size: var(--space-l); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-demo__demo-badge .bg-receptionist-demo__icon { inline-size: 3rem; border-radius: var(--radius-circle); }
  .bg-receptionist-demo__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-demo__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: var(--heading-line-height); }
  .bg-receptionist-demo__copy, &.bg-receptionist-demo__card > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-demo__wave { display: flex; align-items: center; gap: clamp(.16rem, .6cqi, .45rem); block-size: 3.5rem; max-inline-size: 100%; }
  .bg-receptionist-demo__wave-bar { flex: 0 1 .2rem; inline-size: .2rem; min-inline-size: 0; min-block-size: 0; block-size: 25%; border-radius: var(--radius); }
  .bg-receptionist-demo__wave-bar:nth-child(3n + 2) { block-size: 55%; }
  .bg-receptionist-demo__wave-bar:nth-child(4n) { block-size: 75%; }
  .bg-receptionist-demo__wave-bar:nth-child(5n) { block-size: 100%; }
  .bg-receptionist-demo__wave-bar:nth-child(7n) { block-size: 40%; }
  .bg-receptionist-demo__chat-illustration { display: flex; align-items: end; gap: var(--space-xs); min-block-size: 3.5rem; }
  .bg-receptionist-demo__typing { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs); inline-size: 7rem; block-size: 3.5rem; border-radius: var(--radius); }
  .bg-receptionist-demo__typing-dot { inline-size: .4rem; block-size: .4rem; min-inline-size: 0; min-block-size: 0; border-radius: var(--radius-circle); }
  .bg-receptionist-demo__sparkle { display: inline-grid; place-items: center; inline-size: 3rem; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-xl); }
  .bg-receptionist-demo__action { display: flex; padding-block-start: var(--space-s); margin-block-start: auto; }
  &.bg-receptionist-demo__disclaimer { inline-size: 100%; max-inline-size: none; color: var(--relative-text-color, var(--text-color)); text-align: center; font-size: var(--text-s); line-height: 1.5; }
  /* General Section owns the two-column layout; keep the cards comfortable on phones. */
  @container (inline-size < 36rem) {
    &.bg-receptionist-demo__card { padding: var(--space-m); }
    .bg-receptionist-demo__action .bg-button-wrap, .bg-receptionist-demo__action .bg-button { inline-size: 100%; }
    .bg-receptionist-demo__action .bg-button { justify-content: center; }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-demo__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-demo__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-booking {
  min-inline-size: 0;
  &.bg-receptionist-booking__copy { display: grid; gap: var(--space-m); align-self: center; }
  .bg-receptionist-booking__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-booking__detail { display: grid; gap: var(--space-s); }
  .bg-receptionist-booking__subheading { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: var(--heading-line-height); }
  &.bg-receptionist-booking__visual { container: receptionist-booking / inline-size; align-self: center; }
  .bg-receptionist-booking__transcript { display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-1); rotate: -2deg; /* Remove the browser's default figure indentation. */ margin: 0; }
  .bg-receptionist-booking__header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs); padding-block-end: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-receptionist-booking__transcript-title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.4; }
  .bg-receptionist-booking__badge { padding: calc(var(--space-xs) / 2) var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-xs); font-weight: 600; }
  .bg-receptionist-booking__icon { display: inline-grid; place-items: center; flex: none; inline-size: 2.5rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-booking__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-booking__messages { display: flex; flex-direction: column; gap: var(--space-xs); list-style: none; padding: 0; }
  .bg-receptionist-booking__message { display: grid; gap: calc(var(--space-xs) / 3); max-inline-size: 88%; }
  .bg-receptionist-booking__message--caller { align-self: end; }
  .bg-receptionist-booking__message--ai { align-self: start; }
  .bg-receptionist-booking__speaker { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
  .bg-receptionist-booking__message--caller .bg-receptionist-booking__speaker { text-align: end; }
  .bg-receptionist-booking__bubble { padding: var(--space-xs) var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); line-height: 1.5; }
  .bg-receptionist-booking__confirmation { display: flex; align-items: center; gap: var(--space-s); padding: var(--space-s); border: 2px solid var(--relative-link-color, var(--primary)); border-radius: var(--radius); }
  .bg-receptionist-booking__confirmation-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-receptionist-booking__confirmation-text strong { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-receptionist-booking__caption { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); line-height: 1.5; }
  /* General Section handles column stacking. Straighten and simplify the artwork on narrow screens. */
  @container receptionist-booking (inline-size < 30rem) {
    .bg-receptionist-booking__transcript { rotate: none; padding: var(--space-s); }
    .bg-receptionist-booking__message { max-inline-size: 94%; }
    .bg-receptionist-booking__confirmation { align-items: start; gap: var(--space-xs); padding: var(--space-xs); }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-booking__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-booking__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-cover {
  min-inline-size: 0;
  &.bg-receptionist-cover__card { display: grid; align-content: start; gap: var(--space-m); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-receptionist-cover__icon { display: inline-grid; place-items: center; inline-size: var(--space-l); aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-cover__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-cover__card-copy { display: grid; gap: var(--space-xs); }
  .bg-receptionist-cover__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: var(--heading-line-height); }
  .bg-receptionist-cover__text, .bg-receptionist-cover__card-copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-receptionist-cover__footer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-m); inline-size: 100%; padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-receptionist-cover__footer-text { flex: 1 1 38rem; max-inline-size: none; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-cover__note { color: var(--relative-text-color, var(--text-color)); }
  .bg-receptionist-cover__action { flex: 0 1 auto; max-inline-size: 100%; }
  /* General Section stacks the cards on smaller screens; let the closing button fill narrow screens. */
  @container (inline-size < 36rem) {
    .bg-receptionist-cover__action, .bg-receptionist-cover__action .bg-button-wrap, .bg-receptionist-cover__action .bg-button { inline-size: 100%; }
    .bg-receptionist-cover__action .bg-button { justify-content: center; }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-cover__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-cover__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-chat {
  min-inline-size: 0;
  &.bg-receptionist-chat__copy { display: grid; gap: var(--space-m); align-self: center; }
  .bg-receptionist-chat__text-group { display: grid; gap: var(--space-s); }
  .bg-receptionist-chat__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-chat__note { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  &.bg-receptionist-chat__visual { container: receptionist-chat / inline-size; display: grid; gap: var(--space-s); align-self: center; }
  .bg-receptionist-chat__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-s); }
  .bg-receptionist-chat__card { display: grid; align-content: start; gap: var(--space-s); padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-1); min-inline-size: 0; }
  .bg-receptionist-chat__card-title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.3; }
  .bg-receptionist-chat__icon { display: inline-grid; place-items: center; flex: none; inline-size: 2.5rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-chat__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-chat__message { padding: var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); line-height: 1.5; }
  .bg-receptionist-chat__summary { display: flex; align-items: center; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }
  .bg-receptionist-chat__summary-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  .bg-receptionist-chat__summary-text strong { color: var(--relative-heading-color, var(--heading-color)); }
  /* General Section controls the outer columns; single-column message cards stay legible on phones. */
  @container receptionist-chat (inline-size < 26rem) {
    .bg-receptionist-chat__grid { grid-template-columns: minmax(0, 1fr); }
    .bg-receptionist-chat__summary { align-items: start; }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-chat__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-chat__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-tailored {
  min-inline-size: 0;
  &.bg-receptionist-tailored__copy { display: grid; gap: var(--space-m); }
  .bg-receptionist-tailored__text-group { display: grid; gap: var(--space-s); }
  .bg-receptionist-tailored__text, .bg-receptionist-tailored__text-group > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  &.bg-receptionist-tailored__knowledge { container: receptionist-knowledge / inline-size; display: grid; gap: var(--space-s); padding: var(--space-l); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-receptionist-tailored__label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-transform: uppercase; letter-spacing: .08em; }
  .bg-receptionist-tailored__topics { display: flex; flex-wrap: wrap; gap: var(--space-xs); padding: 0; list-style: none; }
  .bg-receptionist-tailored__topic { padding: var(--space-xs) var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); font-weight: 500; line-height: 1.4; }
  .bg-receptionist-tailored__arrow { justify-self: center; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xxl); line-height: 1; }
  .bg-receptionist-tailored__assistant { display: flex; align-items: center; gap: var(--space-s); padding: var(--space-m); border-radius: var(--radius); }
  .bg-receptionist-tailored__icon { display: inline-grid; place-items: center; flex: none; inline-size: 3rem; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-receptionist-tailored__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-tailored__assistant-copy { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-receptionist-tailored__assistant-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.3; }
  .bg-receptionist-tailored__assistant-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.5; }
  /* General Section moves the heading and copy above the visual below 64rem. */
  @container receptionist-knowledge (inline-size < 26rem) {
    .bg-receptionist-tailored__assistant { flex-direction: column; align-items: start; padding: var(--space-s); }
    .bg-receptionist-tailored__topic { padding: var(--space-xs); }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-tailored__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-tailored__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-followup {
  min-inline-size: 0;
  &.bg-receptionist-followup__copy { display: grid; gap: var(--space-m); align-self: center; }
  .bg-receptionist-followup__benefits { display: grid; gap: var(--space-s); padding: 0; list-style: none; }
  .bg-receptionist-followup__benefit { display: flex; align-items: start; gap: var(--space-xs); }
  .bg-receptionist-followup__tick { display: inline-grid; place-items: center; flex: none; inline-size: 1.5rem; aspect-ratio: 1; border-radius: var(--radius-circle); margin-block-start: .15em; }
  .bg-receptionist-followup__tick-glyph { inline-size: var(--icon-size-s); block-size: var(--icon-size-s); }
  .bg-receptionist-followup__benefit-text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-followup__note { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-followup__takeaway { color: var(--relative-link-color, var(--primary)); font-size: var(--text-m); font-weight: 700; line-height: 1.5; }
  &.bg-receptionist-followup__visual { container: receptionist-followup / inline-size; align-self: center; }
  .bg-receptionist-followup__frame { padding: calc(var(--space-xs) / 2); border-radius: var(--radius); box-shadow: var(--box-shadow-2); rotate: 1.2deg; /* Remove the browser's default figure indentation. */ margin: 0; }
  .bg-receptionist-followup__notification { overflow: hidden; border-radius: var(--radius); }
  .bg-receptionist-followup__header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-receptionist-followup__title { display: flex; align-items: center; gap: var(--space-xs); color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.3; }
  .bg-receptionist-followup__icon { display: inline-grid; place-items: center; flex: none; inline-size: 2.5rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-followup__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-followup__time { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-receptionist-followup__body { display: grid; gap: var(--space-s); padding: var(--space-s); }
  .bg-receptionist-followup__details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs); }
  .bg-receptionist-followup__detail { display: grid; gap: calc(var(--space-xs) / 3); padding: var(--space-xs); border-radius: var(--radius); }
  .bg-receptionist-followup__label { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.4; }
  .bg-receptionist-followup__value { color: var(--relative-heading-color, var(--heading-color)); font-size: calc(var(--text-m) * .9); font-weight: 600; line-height: 1.5; /* Definition values align with their labels rather than the browser's default indent. */ margin-inline-start: 0; }
  .bg-receptionist-followup__summary { display: grid; gap: var(--space-xs); }
  .bg-receptionist-followup__summary-text { color: var(--relative-text-color, var(--text-color)); font-size: calc(var(--text-m) * .9); line-height: 1.5; }
  .bg-receptionist-followup__next { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); padding: var(--space-xs); border-radius: var(--radius); }
  .bg-receptionist-followup__badge { flex: none; padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; }
  .bg-receptionist-followup__next-text { flex: 1 1 12rem; color: var(--relative-text-color, var(--text-color)); font-size: calc(var(--text-m) * .9); line-height: 1.5; }
  .bg-receptionist-followup__illustrated-actions { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
  .bg-receptionist-followup__action-label { padding: var(--space-xs); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; line-height: 1.4; }
  .bg-receptionist-followup__caption { text-align: center; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.4; }
  /* General Section controls stacking; straighten the notification and stack its facts on phones. */
  @container receptionist-followup (inline-size < 26rem) {
    .bg-receptionist-followup__frame { rotate: none; }
    .bg-receptionist-followup__details { grid-template-columns: minmax(0, 1fr); }
  }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-followup__tick:not(.surface-primary, .surface-secondary, .surface-tertiary), .bg-receptionist-followup__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-followup__tick:is(.surface-primary, .surface-secondary, .surface-tertiary), .bg-receptionist-followup__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-examples {
  min-inline-size: 0;
  &.bg-receptionist-examples__card { display: grid; align-content: start; align-self: stretch; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); }
  .bg-receptionist-examples__header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-xs); }
  .bg-receptionist-examples__icon { display: inline-grid; place-items: center; flex: none; inline-size: 3rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-receptionist-examples__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-receptionist-examples__badge { inline-size: fit-content; max-inline-size: 100%; padding: calc(var(--space-xs) / 2) var(--space-xs); border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; letter-spacing: .04em; text-transform: uppercase; }
  .bg-receptionist-examples__copy { display: grid; gap: var(--space-xs); }
  .bg-receptionist-examples__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: var(--heading-line-height); }
  .bg-receptionist-examples__text, .bg-receptionist-examples__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  /* General Section owns the three/two/one-column responsive card layout. */
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-examples__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-examples__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-comparison {
  /* Reuse the existing BeanGrower comparison design. This section has eight
     comparison pairs instead of five, so extend only its subgrid tracks. */
  @container (inline-size >= 36rem) {
    &.bg-reviews-comparison.bg-section-general-01__panel { grid-row: span 9; }
    .bg-receptionist-comparison__list.bg-reviews-comparison__list { grid-row: span 8; }
  }
/* Labels keep their natural height within unequal heading tracks. */
& .bg-reviews-comparison__badge { align-self: start; }

}
.bg-receptionist-onboarding {
  min-inline-size: 0;
  &.bg-receptionist-onboarding__header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-m) var(--space-l); }
  .bg-receptionist-onboarding__heading { flex: 1 1 42rem; min-inline-size: 0; }
  .bg-receptionist-onboarding__badge { flex: none; inline-size: fit-content; padding: calc(var(--space-xs) / 2) var(--space-s); border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; }
  &.bg-receptionist-onboarding__steps { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-m); padding: 0; margin: 0; list-style: none; }
  .bg-receptionist-onboarding__card { display: grid; align-content: start; gap: var(--space-s); min-inline-size: 0; padding: var(--space-m); border-radius: var(--radius); }
  .bg-receptionist-onboarding__step { display: flex; align-items: center; gap: var(--space-s); }
  .bg-receptionist-onboarding__number { display: inline-grid; place-items: center; flex: none; inline-size: 3rem; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-l); font-weight: 700; }
  .bg-receptionist-onboarding__step::after { content: ''; flex: 1; block-size: 2px; background: color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-receptionist-onboarding__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: var(--heading-line-height); }
  .bg-receptionist-onboarding__text, .bg-receptionist-onboarding__card > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  /* Four setup steps become two columns, then one, as available space narrows. */
  @container (inline-size >= 36rem) { &.bg-receptionist-onboarding__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @container (inline-size >= 64rem) { &.bg-receptionist-onboarding__steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
}
.bg-receptionist-always-on {
  min-inline-size: 0;
  &.bg-receptionist-always-on__copy { display: grid; gap: var(--space-m); }
  &.bg-receptionist-always-on__panel { container-type: inline-size; display: grid; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); box-shadow: var(--box-shadow-1); }
  .bg-receptionist-always-on__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); list-style: none; margin: 0; padding: 0; }
  .bg-receptionist-always-on__item { display: flex; align-items: center; gap: var(--space-xs); min-inline-size: 0; padding: var(--space-s); border-radius: var(--radius); }
  .bg-receptionist-always-on__icon { display: inline-grid; place-items: center; flex: none; inline-size: 1.75rem; aspect-ratio: 1; border-radius: var(--radius-circle); }
  .bg-receptionist-always-on__glyph { inline-size: var(--icon-size-s); block-size: var(--icon-size-s); }
  .bg-receptionist-always-on__label { font-size: var(--text-m); font-weight: 700; line-height: 1.4; }
  .bg-receptionist-always-on__footer { display: grid; gap: var(--space-s); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); padding-block-start: var(--space-m); }
  .bg-receptionist-always-on__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); line-height: var(--heading-line-height); }
  .bg-receptionist-always-on__text, .bg-receptionist-always-on__footer > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-always-on__reassurance { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.6; }
  /* General Section stacks copy above the panel below 64rem.
     The panel's benefit tiles use two columns only when they have enough room. */
  @container (inline-size >= 26rem) { .bg-receptionist-always-on__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Native icon roles; solid fills use their configured contrasting heading. */
.bg-receptionist-always-on__icon:not(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-receptionist-always-on__icon:is(.surface-primary, .surface-secondary, .surface-tertiary) { color: var(--relative-heading-color, var(--heading-color)); color-scheme: inherit; }

}
.bg-receptionist-answering-service {
  min-inline-size: 0;
  &.bg-receptionist-answering-service__copy { display: grid; gap: var(--space-m); }
  &.bg-receptionist-answering-service__comparison { container-type: inline-size; display: grid; gap: var(--space-s); }
  .bg-receptionist-answering-service__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-receptionist-answering-service__emphasis { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.6; }
  .bg-receptionist-answering-service__table-shell { overflow: hidden; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); box-shadow: var(--box-shadow-1); }
  .bg-receptionist-answering-service__table { inline-size: 100%; table-layout: fixed; border-collapse: collapse; font-size: calc(var(--text-m) * .9); line-height: 1.5; }
  .bg-receptionist-answering-service__table th, .bg-receptionist-answering-service__table td { padding: var(--space-s); vertical-align: middle; }
  .bg-receptionist-answering-service__table thead th { font-size: var(--text-s); font-weight: 700; line-height: 1.4; text-align: center; }
  .bg-receptionist-answering-service__table tbody tr { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-receptionist-answering-service__capability { inline-size: 40%; }
  .bg-receptionist-answering-service__column { inline-size: 30%; }
  .bg-receptionist-answering-service__table th.bg-receptionist-answering-service__capability, .bg-receptionist-answering-service__row-label { text-align: start; }
  .bg-receptionist-answering-service__row-label { color: var(--relative-heading-color, var(--heading-color)); font-weight: 600; }
  .bg-receptionist-answering-service__standard { color: var(--relative-text-color, var(--text-color)); text-align: center; }
  .bg-receptionist-answering-service__included { color: var(--relative-link-color, var(--primary)); text-align: center; font-weight: 700; }
  .bg-receptionist-answering-service__note { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  /* General Section stacks the two main columns below 64rem.
     Reduce cell padding on narrow tables while preserving row/column headers. */
  @container (inline-size < 28rem) {
    .bg-receptionist-answering-service__table thead th { font-size: calc(var(--text-s) * .9); }
    .bg-receptionist-answering-service__capability { inline-size: 34%; }
    .bg-receptionist-answering-service__column { inline-size: 33%; }
    .bg-receptionist-answering-service__table th, .bg-receptionist-answering-service__table td { padding: var(--space-xs) calc(var(--space-xs) / 2); overflow-wrap: anywhere; }
  }
}
.bg-ai-system {
  min-inline-size: 0;
  &.bg-ai-system__intro { display: grid; gap: var(--space-m); }
  .bg-ai-system__lead { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.5; }
  .bg-ai-system__description { line-height: 1.65; }
  .bg-ai-system__brand { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); }
  .bg-ai-system__brand-icon { display: grid; place-items: center; inline-size: 2.5rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-ai-system__brand-name { color: var(--relative-link-color, var(--primary)); }
  .bg-ai-system__strapline { padding-inline-start: var(--space-xs); border-inline-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); font-size: var(--text-s); }
  &.bg-ai-system__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: var(--space-s); }
  .bg-ai-system__card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 15%, transparent); border-radius: var(--radius); }
  .bg-ai-system__icon { display: grid; place-items: center; inline-size: 3rem; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-ai-system__glyph { inline-size: var(--icon-size-m); block-size: var(--icon-size-m); }
  .bg-ai-system__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.25; }
  .bg-ai-system__text { font-size: var(--text-s); line-height: 1.65; }
  &.bg-ai-system__offer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--space-l) var(--space-xxl); padding: var(--space-l); border-radius: var(--radius); }
  .bg-ai-system__price-copy, .bg-ai-system__offer-actions { display: grid; gap: var(--space-s); min-inline-size: 0; }
  .bg-ai-system__offer-intro, .bg-ai-system__offer-copy { font-size: var(--text-s); line-height: 1.65; }
  .bg-ai-system__price-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s); }
  .bg-ai-system__price { inline-size: max-content; display: flex; align-items: baseline; gap: .15em; }
  .bg-ai-system__amount { color: var(--relative-link-color, var(--primary)); font-size: var(--h1); font-weight: 800; line-height: 1; letter-spacing: -.05em; }
  .bg-ai-system__period { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }
  .bg-ai-system__eligibility { max-inline-size: 12ch; font-size: var(--text-s); line-height: 1.4; }
  .bg-ai-system__standard { max-inline-size: 42ch; font-size: var(--text-s); line-height: 1.65; }
  .bg-ai-system__offer-actions .bg-button-wrap, .bg-ai-system__offer-actions .bg-button { inline-size: 100%; }
  .bg-ai-system__offer-actions .bg-button { justify-content: space-between; }
  .bg-ai-system__terms { font-size: var(--text-s); line-height: 1.5; text-align: center; }
  /* ACSS and General Section own outer spacing. Only the offer grid changes here. */
  @container (inline-size < 54rem) { &.bg-ai-system__offer { grid-template-columns: minmax(0, 1fr); } }
  @container (inline-size < 36rem) { &.bg-ai-system__offer { padding: var(--space-m); } }
/* Native icon foregrounds; solid surfaces use their configured contrasting heading. */
.bg-ai-system__icon:not(.surface-primary, .surface-secondary), .bg-ai-system__brand-icon:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }
.bg-ai-system__icon:is(.surface-primary, .surface-secondary), .bg-ai-system__brand-icon:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

}
.bg-managed-hero {
  /* Hero01 owns section spacing, heading typography, buttons and stacking. */
  .bg-managed-hero__marker { min-inline-size: 0; min-block-size: 0; }
  .bg-managed-hero__lead { color: var(--relative-heading-color, var(--heading-color)); }
  .bg-managed-hero__tagline { color: var(--bg-brand-accent, var(--primary)); }
  .bg-managed-hero__offer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s) var(--space-m); margin-block-end: var(--space-m); }
  .bg-managed-hero__client-price { display: flex; align-items: center; gap: var(--space-xs); inline-size: auto; }
  .bg-managed-hero__from, .bg-managed-hero__price-label, .bg-managed-hero__standard-price { font-size: var(--text-s); line-height: 1.4; }
  .bg-managed-hero__amount { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: var(--heading-font-weight); line-height: 1; letter-spacing: var(--heading-letter-spacing); }
  .bg-managed-hero__price-label { max-inline-size: 17ch; }
  .bg-managed-hero__standard-price { inline-size: auto; padding-inline-start: var(--space-m); border-inline-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent); color: var(--relative-text-color, var(--text-color)); }
  .bg-managed-hero__terms { margin-block-start: var(--space-s); font-size: var(--text-s); }
  .bg-managed-hero__visual { container: managed-visual / inline-size; inline-size: min(100%, 38rem); min-inline-size: 0; justify-self: center; margin: 0; }
  .bg-managed-hero__scene { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: var(--space-m) var(--space-s); padding-block: var(--space-l); }
  .bg-managed-hero__scene::before, .bg-managed-hero__scene::after { content: ''; position: absolute; z-index: -1; inset-inline-start: 50%; inset-block-start: 50%; translate: -50% -50%; inline-size: 116%; aspect-ratio: 1; border-radius: var(--radius-circle); background: color-mix(in srgb,var(--relative-heading-color, var(--heading-color)) 6%,transparent); }
  .bg-managed-hero__scene::after { inline-size: 92%; }
  .bg-managed-hero__note { grid-column: 1 / -1; justify-self: end; margin-inline-end: var(--space-s); margin-block-end: calc(var(--space-s) * -1); padding: var(--space-xs) var(--space-s); border-radius: var(--radius); font-family: var(--font-handwritten); font-size: var(--text-xl); line-height: 1; rotate: 4deg; }
  .bg-managed-hero__tablet { grid-column: 1 / -1; inline-size: 90%; justify-self: center; border: .45rem solid var(--base); border-radius: var(--radius); box-shadow: var(--box-shadow-2); rotate: 4deg; overflow: hidden; }
  .bg-managed-hero__panel-header { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-block-end: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-managed-hero__icon { display: grid; place-items: center; flex: none; inline-size: 2.3em; aspect-ratio: 1; border-radius: var(--radius-circle); font-size: var(--text-xs); font-weight: 700; }
  .bg-managed-hero__avatar { inline-size: 3em; font-size: var(--text-s); }
  .bg-managed-hero__in-progress, .bg-managed-hero__pending { min-inline-size: 0; min-block-size: 0; background: transparent; border: 2px solid currentColor; }
  .bg-managed-hero__in-progress::before { content: ''; inline-size: .65em; aspect-ratio: 1; border-radius: var(--radius-circle); background: currentColor; }
  .bg-managed-hero__pending { border-style: dashed; }
  .bg-managed-hero__glyph { inline-size: 1.3em; block-size: 1.3em; }
  .bg-managed-hero__copy { display: grid; gap: .25em; min-inline-size: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.35; }
  .bg-managed-hero__panel-title { font-size: var(--text-m); }
  .bg-managed-hero__detail { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  .bg-managed-hero__tasks { list-style: none; padding: 0; }
  .bg-managed-hero__task { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-s); font-size: var(--text-s); }
  .bg-managed-hero__task + .bg-managed-hero__task { border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-managed-hero__status { padding: .3em .6em; border-radius: var(--radius); font-size: var(--text-xs); font-weight: 600; text-align: center; }
  .bg-managed-hero__allowance { display: grid; gap: var(--space-xs); padding: var(--space-s); border-block-start: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }
  .bg-managed-hero__allowance-labels { display: flex; justify-content: space-between; gap: var(--space-xs); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-xs); }
  .bg-managed-hero__track { block-size: .4rem; border-radius: var(--radius); overflow: hidden; }
  .bg-managed-hero__progress { display: block; inline-size: 64%; block-size: 100%; }
  .bg-managed-hero__mini-card { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); box-shadow: var(--box-shadow-1); }
  .bg-managed-hero__journey { margin-block-start: var(--space-m); }
  @container managed-visual (inline-size < 26rem) {
    .bg-managed-hero__scene { grid-template-columns: minmax(0,1fr); }
    .bg-managed-hero__scene::before { inline-size: 100%; }
    .bg-managed-hero__scene::after { inline-size: 80%; }
    .bg-managed-hero__tablet { inline-size: 100%; rotate: 0deg; }
    .bg-managed-hero__journey { margin-block-start: 0; }
  }
  @container managed-visual (inline-size < 20rem) {
    .bg-managed-hero__task { grid-template-columns: auto minmax(0,1fr); }
    .bg-managed-hero__status { grid-column: 2; justify-self: start; }
  }
}
.bg-managed-support {
  min-inline-size: 0;
  /* General Section and ACSS own the outer spacing and column breakpoints. */
  &.bg-managed-support__copy { display: grid; gap: var(--space-m); }
  .bg-managed-support__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); }
  .bg-managed-support__emphasis { color: var(--relative-heading-color, var(--heading-color)); }
  &.bg-managed-support__panel { align-self: center; display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); border-radius: var(--radius); }
  .bg-managed-support__panel-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-xs); }
  .bg-managed-support__panel-title { font-size: var(--text-l); line-height: 1.3; }
  .bg-managed-support__badge { padding: .5em .8em; border-radius: var(--radius); font-size: var(--text-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
  .bg-managed-support__tasks { display: grid; gap: var(--space-xs); list-style: none; padding: 0; }
  .bg-managed-support__task { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-s); border-radius: var(--radius); font-size: var(--text-m); }
  .bg-managed-support__icon { display: grid; place-items: center; flex: none; inline-size: 1.7em; aspect-ratio: 1; border-radius: var(--radius); }
  .bg-managed-support__glyph { inline-size: 1em; block-size: 1em; }
  &.bg-managed-support__closing { padding: var(--space-s) var(--space-m); border-radius: var(--radius); text-align: center; font-size: var(--text-l); font-weight: 700; }
  .bg-managed-support__closing-accent { color: var(--bg-brand-accent, var(--primary)); }
}
.bg-managed-platform {
  container: managed-platform / inline-size;
  min-inline-size: 0;
  /* General Section and ACSS own outer spacing; this grid owns its cards. */
  .bg-managed-platform__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-s); list-style: none; padding: 0; }
  .bg-managed-platform__card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-s); min-inline-size: 0; padding: var(--space-m); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent); border-radius: var(--radius); }
  .bg-managed-platform__icon { display: grid; place-items: center; inline-size: 2.6em; aspect-ratio: 1; flex: none; border-radius: var(--radius); font-size: var(--text-s); }
  .bg-managed-platform__glyph { inline-size: 1.45em; block-size: 1.45em; }
  .bg-managed-platform__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.3; font-weight: 700; }
  .bg-managed-platform__text, .bg-managed-platform__card > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  &.bg-managed-platform__note { inline-size: 100%; max-inline-size: none; text-align: center; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); font-style: italic; }
  @container managed-platform (inline-size < 68rem) {
    .bg-managed-platform__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  }
  @container managed-platform (inline-size < 36rem) {
    .bg-managed-platform__grid { grid-template-columns: minmax(0,1fr); }
  }
}
.bg-managed-comparison {
  /* Reuse the shared BeanGrower comparison design with eight paired rows. */
  @container (inline-size >= 36rem) {
    &.bg-reviews-comparison.bg-section-general-01__panel { grid-row: span 9; }
    .bg-managed-comparison__list.bg-reviews-comparison__list { grid-row: span 8; }
  }
}
.bg-managed-process {
  container: managed-process / inline-size;
  min-inline-size: 0;
  display: grid;
  gap: var(--space-s);
  /* General Section and ACSS own outer section spacing. */
  .bg-managed-process__steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-s); list-style: none; padding: 0; }
  .bg-managed-process__step { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-s); min-inline-size: 0; padding: var(--space-m); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent); border-block-start: 3px solid var(--bg-brand-accent, var(--primary)); border-radius: var(--radius); }
  .bg-managed-process__number { display: block; font-size: var(--h3); font-weight: 700; line-height: 1; }
  .bg-managed-process__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.3; }
  .bg-managed-process__copy { display: grid; gap: var(--space-xs); }
  .bg-managed-process__text, .bg-managed-process__copy > p { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-managed-process__note { padding: var(--space-s) var(--space-m); border-radius: var(--radius); text-align: center; }
  .bg-managed-process__note-text { max-inline-size: none; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; line-height: 1.5; }
  .bg-managed-process__accent { color: var(--bg-brand-accent, var(--primary)); }
  @container managed-process (inline-size < 68rem) {
    .bg-managed-process__steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  }
  @container managed-process (inline-size < 36rem) {
    .bg-managed-process__steps { grid-template-columns: minmax(0,1fr); }
  }
}
.bg-managed-allowance {
  min-inline-size: 0;
  /* General Section owns the outer spacing, column proportions and stacking. */
  &.bg-managed-allowance__copy { align-self: center; display: grid; gap: var(--space-m); }
  .bg-managed-allowance__text { display: grid; gap: var(--space-s); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); }
  .bg-managed-allowance__emphasis { color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; }
  &.bg-managed-allowance__panel { container: managed-allowance-list / inline-size; align-self: center; display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid var(--primary-light); border-radius: var(--radius); box-shadow: var(--box-shadow-2); rotate: 1deg; }
  .bg-managed-allowance__header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-xs); padding-block-end: var(--space-s); border-block-end: 2px dashed var(--primary-light); }
  .bg-managed-allowance__title { font-family: var(--font-handwritten); font-size: var(--h3); font-weight: 500; line-height: 1.2; color: var(--relative-heading-color, var(--heading-color)); }
  .bg-managed-allowance__badge { padding: .5em .8em; border-radius: var(--radius); font-size: var(--text-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
  .bg-managed-allowance__tasks { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-s); list-style: none; padding: 0; }
  .bg-managed-allowance__task { display: flex; align-items: flex-start; gap: var(--space-xs); min-inline-size: 0; font-size: var(--text-s); line-height: 1.5; }
  /* This design uses bare ticks: retain the native foreground colour but omit its surface. */
  .bg-managed-allowance__icon { flex: none; display: grid; place-items: center; inline-size: 1.25em; block-size: 1.5em; color: currentColor; }
  .bg-managed-allowance__icon { background-color: transparent; }
  .bg-managed-allowance__glyph { inline-size: 1.2em; block-size: 1.2em; }
  @container managed-allowance-list (inline-size < 30rem) {
    .bg-managed-allowance__tasks { grid-template-columns: minmax(0,1fr); }
  }
  @container (inline-size < 48rem) {
    &.bg-managed-allowance__panel { rotate: 0deg; }
  }
}
.bg-managed-pricing {
  container: managed-pricing / inline-size;
  display: grid;
  gap: var(--space-m);
  min-inline-size: 0;
  /* General Section and SectionHeader own outer spacing and heading typography. */
  .bg-managed-pricing__included { display: flex; align-items: flex-start; gap: var(--space-s); padding: var(--space-m); border-radius: var(--radius); }
  .bg-managed-pricing__included-copy { display: grid; gap: var(--space-xs); min-inline-size: 0; }
  .bg-managed-pricing__included-title { color: var(--bg-brand-accent, var(--primary)); font-size: var(--text-l); line-height: 1.3; }
  .bg-managed-pricing__text { font-size: var(--text-m); line-height: 1.6; }
  .bg-managed-pricing__icon { display: inline-grid; place-items: center; inline-size: 2.8em; aspect-ratio: 1; border-radius: var(--radius); flex: none; }
  .bg-managed-pricing__glyph { display: block; inline-size: 2em; block-size: 1.2em; }
  .bg-managed-pricing__offer { justify-self: center; inline-size: fit-content; max-inline-size: 100%; padding: var(--space-xs) var(--space-s); border-radius: var(--radius); font-size: var(--text-s); font-weight: 700; text-transform: uppercase; text-align: center; }
  .bg-managed-pricing__cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-m); align-items: stretch; }
  .bg-managed-pricing__card { display: flex; flex-direction: column; min-inline-size: 0; border: 2px solid var(--primary-light); border-radius: var(--radius); overflow: hidden; }
  .bg-managed-pricing__card--growth { border-color: var(--secondary); }
  .bg-managed-pricing__ribbon { inline-size: 100%; max-inline-size: none; padding: var(--space-xs) var(--space-m); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
  .bg-managed-pricing__body { display: flex; flex-direction: column; gap: var(--space-s); padding: var(--space-m); flex: 1; }
  .bg-managed-pricing__product { display: grid; gap: var(--space-xs); }
  .bg-managed-pricing__brand { color: var(--bg-brand-accent, var(--primary)); font-size: var(--text-s); font-weight: 700; }
  .bg-managed-pricing__name { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h3); line-height: 1.15; }
  .bg-managed-pricing__description { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-managed-pricing__pricing { display: grid; gap: var(--space-xs); }
  .bg-managed-pricing__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25em; }
  .bg-managed-pricing__amount { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--h1); font-weight: 700; line-height: 1; letter-spacing: var(--heading-letter-spacing); }
  .bg-managed-pricing__period, .bg-managed-pricing__fee { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.5; }
  .bg-managed-pricing__setup { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); font-weight: 700; }
  .bg-managed-pricing__hours { display: flex; align-items: center; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }
  .bg-managed-pricing__hours-number { color: var(--bg-brand-accent, var(--primary)); font-size: var(--h2); font-weight: 700; line-height: 1; }
  .bg-managed-pricing__hours-label { font-size: var(--text-m); line-height: 1.4; }
  .bg-managed-pricing__features { display: grid; gap: var(--space-xs); list-style: none; padding: 0; }
  .bg-managed-pricing__feature { display: flex; align-items: flex-start; gap: var(--space-xs); font-size: var(--text-m); line-height: 1.5; }
  .bg-managed-pricing__tick { display: inline-grid; place-items: center; flex: none; inline-size: 1.3em; block-size: 1.5em; color: currentColor; }
  .bg-managed-pricing__tick { background-color: transparent; }
  .bg-managed-pricing__tick-glyph { inline-size: 1.2em; block-size: 1.2em; }
  .bg-managed-pricing__feature-intro { color: var(--bg-brand-accent, var(--primary)); font-size: var(--text-m); font-weight: 700; }
  .bg-managed-pricing__actions { margin-block-start: auto; padding-block-start: var(--space-s); }
  .bg-managed-pricing__actions .bg-button-wrap, .bg-managed-pricing__actions .bg-button { inline-size: 100%; }
  .bg-managed-pricing__actions .bg-button { justify-content: center; }
  .bg-managed-pricing__bespoke { background-color: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 94%, var(--relative-heading-color, var(--heading-color))); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-s) var(--space-m); padding: var(--space-m); border: 1px solid color-mix(in srgb,var(--relative-heading-color, var(--heading-color)) 22%,transparent); border-radius: var(--radius); }
  .bg-managed-pricing__bespoke-copy { display: grid; gap: var(--space-xs); flex: 1 1 28rem; }
  .bg-managed-pricing__bespoke-title { font-size: var(--text-l); color: var(--relative-heading-color, var(--heading-color)); line-height: 1.3; }
  .bg-managed-pricing__terms { justify-self: center; max-inline-size: 95ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; text-align: center; }
  @container managed-pricing (inline-size < 48rem) {
    .bg-managed-pricing__cards { grid-template-columns: minmax(0,1fr); }
  }
  @container managed-pricing (inline-size < 30rem) {
    .bg-managed-pricing__included { flex-direction: column; }
    .bg-managed-pricing__bespoke .bg-button-wrap, .bg-managed-pricing__bespoke .bg-button { inline-size: 100%; }
  }
}
.bg-managed-scope {
  min-inline-size: 0;
  /* General Section and SectionHeader own the outer spacing and typography. */
  &.bg-managed-scope__copy { display: grid; gap: var(--space-m); }
  .bg-managed-scope__text { display: grid; gap: var(--space-s); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }
  .bg-managed-scope__extra { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s); padding: var(--space-s); border: 1px solid color-mix(in srgb,var(--relative-heading-color, var(--heading-color)) 12%,transparent); border-radius: var(--radius); }
  .bg-managed-scope__rate { display: flex; align-items: baseline; gap: .15em; inline-size: auto; flex: none; }
  .bg-managed-scope__amount { color: var(--bg-brand-accent, var(--primary)); font-size: var(--h2); font-weight: 700; letter-spacing: var(--heading-letter-spacing); line-height: 1; }
  .bg-managed-scope__period { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); }
  .bg-managed-scope__extra-copy { flex: 1 1 24rem; font-size: var(--text-m); line-height: 1.6; }
  &.bg-managed-scope__usage { display: grid; gap: var(--space-s); align-self: start; padding: var(--space-m); border: 1px solid var(--primary-light); border-radius: var(--radius); }
  .bg-managed-scope__header { display: flex; align-items: center; gap: var(--space-s); }
  .bg-managed-scope__badge { display: grid; place-items: center; flex: none; inline-size: 3em; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-m); font-weight: 700; }
  .bg-managed-scope__title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.3; }
  .bg-managed-scope__note { font-size: var(--text-s); color: var(--relative-text-color, var(--text-color)); font-style: italic; line-height: 1.5; }
  .bg-managed-scope__actions { display: flex; }
  @container (inline-size < 30rem) {
    .bg-managed-scope__actions .bg-button-wrap, .bg-managed-scope__actions .bg-button { inline-size: 100%; }
    .bg-managed-scope__actions .bg-button { justify-content: center; }
  }
  .bg-managed-scope__usage-icon { display: grid; place-items: center; flex: none; inline-size: 2.5em; aspect-ratio: 1; border-radius: var(--radius); font-size: var(--text-m); }
  .bg-managed-scope__usage-glyph { display: block; inline-size: 55%; block-size: 55%; }

}
.bg-beangrower-ai-pricing {
  /* General Section and ACSS own section spacing. This class owns only the new pricing content. */
  display: grid;
  gap: var(--space-m);
  min-inline-size: 0;
  inline-size: 100%;
  container: ai-pricing / inline-size;
  /* The badge belongs to the introduction, so its gap is independent of the section content gap. */

  &.bg-beangrower-ai-pricing__intro { gap: var(--space-s); }

  .bg-beangrower-ai-pricing__stack { display: grid; align-content: start; gap: var(--space-xs); }

  .bg-beangrower-ai-pricing__stack-tight { display: grid; align-content: start; gap: .3em; }
  /* Repeated explanatory paragraphs are styled by their existing content group. */

  .bg-beangrower-ai-pricing__note, .bg-beangrower-ai-pricing__setup-item p, .bg-beangrower-ai-pricing__reassurance-item p, .bg-beangrower-ai-pricing__usage-copy p { font-size: var(--text-s); line-height: 1.5; }

  .bg-beangrower-ai-pricing__subheading { font-size: var(--h4); line-height: 1.2; }

  .bg-beangrower-ai-pricing__item-title { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-m); line-height: 1.25; }

  .bg-beangrower-ai-pricing__accent { color: var(--bg-brand-accent, var(--primary)); }

  .bg-beangrower-ai-pricing__icon { display: grid; place-items: center; flex: none; inline-size: 3rem; block-size: 3rem; border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__glyph { display: block; inline-size: 1.8rem; block-size: 1.8rem; }

  .bg-beangrower-ai-pricing__tick { display: inline-grid; place-items: center; flex: none; inline-size: 1.4em; block-size: 1.4em; border-radius: var(--radius-circle); }

  .bg-beangrower-ai-pricing__tick .bg-beangrower-ai-pricing__glyph { inline-size: .9em; block-size: .9em; }

  .bg-beangrower-ai-pricing__badge { display: flex; align-items: center; justify-content: center; justify-self: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-m); border-radius: var(--radius); font-size: var(--text-s); text-align: center; }

  .bg-beangrower-ai-pricing__badge .bg-beangrower-ai-pricing__icon { inline-size: 1.4em; block-size: 1.4em; border-radius: var(--radius-circle); }

  .bg-beangrower-ai-pricing__badge .bg-beangrower-ai-pricing__glyph { inline-size: .9em; block-size: .9em; }

  .bg-beangrower-ai-pricing__main-card { display: grid; gap: var(--space-m); padding: var(--space-s); border: 2px solid var(--primary-light); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__main-top { display: grid; grid-template-columns: minmax(0, .36fr) minmax(0, .64fr); gap: var(--space-m); align-items: stretch; }

  .bg-beangrower-ai-pricing__price-panel { display: grid; align-content: start; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__plan-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-s); align-items: start; }

  .bg-beangrower-ai-pricing__plan-icon { inline-size: 3.7rem; block-size: 3.7rem; }

  .bg-beangrower-ai-pricing__plan-icon .bg-beangrower-ai-pricing__glyph { inline-size: 2.8rem; block-size: 2.8rem; }

  .bg-beangrower-ai-pricing__plan-name { font-size: var(--h4); line-height: 1.12; }

  .bg-beangrower-ai-pricing__plan-head p { font-size: var(--text-s); line-height: 1.4; }

  .bg-beangrower-ai-pricing__rate { color: var(--bg-brand-accent, var(--primary)); }

  .bg-beangrower-ai-pricing__rate-line { display: flex; flex-wrap: wrap; gap: .15em; align-items: baseline; font-size: var(--h4); font-weight: 700; line-height: 1; }

  .bg-beangrower-ai-pricing__rate-line strong { font-size: clamp(4rem, 7cqi, 6rem); letter-spacing: -.06em; }

  .bg-beangrower-ai-pricing__rate-label { font-size: var(--text-l); font-weight: 700; }

  .bg-beangrower-ai-pricing__comparison strong { font-size: var(--h3); }

  .bg-beangrower-ai-pricing__comparison span { font-size: var(--text-m); font-weight: 600; }

  .bg-beangrower-ai-pricing__comparison p { line-height: 1.3; }

  .bg-beangrower-ai-pricing__signup { display: grid; gap: var(--space-s); padding-block-start: var(--space-s); border-block-start: 1px solid var(--primary-light); }

  .bg-beangrower-ai-pricing__setup-price { color: var(--relative-heading-color, var(--heading-color)); font-weight: 600; }

  .bg-beangrower-ai-pricing__setup-price strong { font-size: var(--h4); }

  .bg-beangrower-ai-pricing__signup .bg-button-wrap, .bg-beangrower-ai-pricing__signup .bg-button { inline-size: 100%; }

  .bg-beangrower-ai-pricing__signup .bg-button { justify-content: center; }

  .bg-beangrower-ai-pricing__support-line { display: flex; gap: var(--space-xs); align-items: center; }

  .bg-beangrower-ai-pricing__feature-panel { display: grid; align-content: start; gap: var(--space-s); padding-block: var(--space-xs); }

  .bg-beangrower-ai-pricing__feature-grid, .bg-beangrower-ai-pricing__included-grid, .bg-beangrower-ai-pricing__benefit-list, .bg-beangrower-ai-pricing__setup-grid, .bg-beangrower-ai-pricing__reassurance { list-style: none; padding: 0; }

  .bg-beangrower-ai-pricing__feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-xs); }

  .bg-beangrower-ai-pricing__feature { display: flex; gap: var(--space-xs); align-items: center; padding: var(--space-xs); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__feature strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); line-height: 1.25; }

  .bg-beangrower-ai-pricing__feature .bg-beangrower-ai-pricing__icon { inline-size: 2.6rem; block-size: 2.6rem; border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-pricing__more { text-align: center; color: var(--relative-heading-color, var(--heading-color)); font-weight: 700; font-size: var(--text-s); }

  .bg-beangrower-ai-pricing__included-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-xs); }

  .bg-beangrower-ai-pricing__included { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__included strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); }

  .bg-beangrower-ai-pricing__clarification { display: grid; gap: .25em; }

  .bg-beangrower-ai-pricing__benefits { display: grid; gap: var(--space-s); padding: var(--space-s) var(--space-xs) 0; border-block-start: 1px solid var(--neutral-light); }

  .bg-beangrower-ai-pricing__benefit-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-m); }

  .bg-beangrower-ai-pricing__benefit-list { display: grid; align-content: start; gap: var(--space-xs); }

  .bg-beangrower-ai-pricing__benefit { display: flex; align-items: start; gap: var(--space-xs); font-size: var(--text-m); line-height: 1.4; }

  .bg-beangrower-ai-pricing__benefit strong { color: var(--relative-heading-color, var(--heading-color)); }

  .bg-beangrower-ai-pricing__setup-panel { display: grid; gap: var(--space-s); padding: var(--space-m); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__setup-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-m) var(--space-s); }

  .bg-beangrower-ai-pricing__setup-item { display: grid; grid-template-columns: auto minmax(0,1fr); gap: var(--space-xs); align-items: start; padding-block-start: var(--space-s); border-block-start: 1px solid var(--secondary-light); }

  .bg-beangrower-ai-pricing__scope-note { font-size: var(--text-s); line-height: 1.5; text-align: center; max-inline-size: none; }

  .bg-beangrower-ai-pricing__usage { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: var(--space-m); padding: var(--space-s); border: 1px solid var(--secondary-light); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__usage-copy { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: var(--space-s); }

  .bg-beangrower-ai-pricing__usage-example { display: grid; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__example-heading { display: flex; align-items: start; gap: var(--space-xs); }

  .bg-beangrower-ai-pricing__usage-example .bg-beangrower-ai-pricing__link { justify-self: end; }

  .bg-beangrower-ai-pricing__link { font-size: var(--text-s); font-weight: 700; text-underline-offset: .18em; }

  .bg-beangrower-ai-pricing__link:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: .2em; }

  .bg-beangrower-ai-pricing__optional { display: grid; gap: var(--space-s); }

  .bg-beangrower-ai-pricing__tag { display: inline-flex; align-self: start; justify-self: start; padding: .2em .5em; border-radius: var(--radius); font-size: var(--text-s); font-weight: 600; }

  .bg-beangrower-ai-pricing__managed { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; align-items: center; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__managed-price { padding-inline-start: var(--space-m); border-inline-start: 1px solid var(--primary-light); text-align: center; }

  .bg-beangrower-ai-pricing__managed-price p:first-child { color: var(--bg-brand-accent, var(--primary)); font-weight: 700; }

  .bg-beangrower-ai-pricing__managed-price strong { font-size: var(--h3); }

  .bg-beangrower-ai-pricing__reassurance { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--space-s); padding: var(--space-s); border: 1px solid var(--neutral); border-radius: var(--radius); background: color-mix(in srgb, var(--bg-decoration-surface, var(--body-bg-color)) 90%, var(--black)); }

  .bg-beangrower-ai-pricing__reassurance-item { display: grid; grid-template-columns: auto minmax(0,1fr); gap: var(--space-xs); align-items: start; }

  .bg-beangrower-ai-pricing__reassurance-item strong { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); }

  .bg-beangrower-ai-pricing__managed-prompt { font-size: var(--text-s); color: var(--relative-text-color, var(--text-color)); }

  .bg-beangrower-ai-pricing__coffee { display: flex; align-items: center; justify-content: center; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__coffee-text { font-size: var(--text-m); color: var(--relative-heading-color, var(--heading-color)); }
  @container ai-pricing (inline-size < 66rem) {
    .bg-beangrower-ai-pricing__main-top { grid-template-columns: minmax(0,.4fr) minmax(0,.6fr); gap: var(--space-s); }
    .bg-beangrower-ai-pricing__price-panel { padding: var(--space-s); }
    .bg-beangrower-ai-pricing__feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .bg-beangrower-ai-pricing__included-grid { grid-template-columns: minmax(0,1fr); }
    .bg-beangrower-ai-pricing__setup-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }


    .bg-beangrower-ai-pricing__managed { grid-template-columns: auto minmax(0,1fr) auto; }
    .bg-beangrower-ai-pricing__managed-price { grid-column: 2; padding-inline-start: 0; border-inline-start: 0; text-align: start; }
    .bg-beangrower-ai-pricing__reassurance { grid-template-columns: repeat(2,minmax(0,1fr)); }
  }
  @container ai-pricing (inline-size < 48rem) {
    .bg-beangrower-ai-pricing__main-top, .bg-beangrower-ai-pricing__usage { grid-template-columns: minmax(0,1fr); }
    .bg-beangrower-ai-pricing__feature-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .bg-beangrower-ai-pricing__included-grid, .bg-beangrower-ai-pricing__setup-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }

    .bg-beangrower-ai-pricing__managed { grid-template-columns: auto minmax(0,1fr); }
    .bg-beangrower-ai-pricing__managed > .bg-button-wrap { grid-column: 1 / -1; }
  }
  @container ai-pricing (inline-size < 34rem) {
    .bg-beangrower-ai-pricing__feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .bg-beangrower-ai-pricing__feature { flex-direction: column; align-items: start; }
    .bg-beangrower-ai-pricing__included-grid, .bg-beangrower-ai-pricing__benefit-columns, .bg-beangrower-ai-pricing__setup-grid, .bg-beangrower-ai-pricing__reassurance { grid-template-columns: minmax(0,1fr); }
    .bg-beangrower-ai-pricing__plan-head { gap: var(--space-xs); }
    .bg-beangrower-ai-pricing__plan-icon { inline-size: 3rem; block-size: 3rem; }
    .bg-beangrower-ai-pricing__setup-panel { padding: var(--space-s); }
    .bg-beangrower-ai-pricing__usage-copy { grid-template-columns: minmax(0,1fr); }
    .bg-beangrower-ai-pricing__managed-price { grid-column: 1 / -1; }
    .bg-beangrower-ai-pricing__managed > .bg-button-wrap, .bg-beangrower-ai-pricing__managed .bg-button { inline-size: 100%; }

  }
  /* Platform services and standalone offers share the same readable card layout. */

  .bg-beangrower-ai-pricing__standalone { display: grid; gap: var(--space-s); }

  .bg-beangrower-ai-pricing__offers-heading { display: grid; justify-items: center; gap: var(--space-xs); text-align: center; }

  .bg-beangrower-ai-pricing__offers-title { font-size: var(--h3); line-height: 1.2; }

  .bg-beangrower-ai-pricing__offers-note { font-size: var(--text-s); line-height: 1.4; text-align: center; max-inline-size: none; }

  .bg-beangrower-ai-pricing__service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-s); }

  .bg-beangrower-ai-pricing__service-card { display: flex; flex-direction: column; gap: var(--space-s); min-inline-size: 0; padding: var(--space-m); border: 1px solid var(--neutral-light); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__service-head { display: grid; grid-template-columns: auto minmax(0,1fr); gap: var(--space-s); align-items: start; }

  .bg-beangrower-ai-pricing__service-title { font-size: var(--h4); line-height: 1.15; }

  .bg-beangrower-ai-pricing__service-copy { font-size: var(--text-m); line-height: 1.4; }

  .bg-beangrower-ai-pricing__service-offer { display: grid; gap: .35em; }

  .bg-beangrower-ai-pricing__service-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15em; background: transparent; font-size: var(--h3); font-weight: 700; line-height: 1.15; letter-spacing: -.03em; }

  .bg-beangrower-ai-pricing__service-price strong { font-size: inherit; }

  .bg-beangrower-ai-pricing__client-label { font-size: var(--text-s); line-height: 1.3; }

  .bg-beangrower-ai-pricing__service-setup { color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-l); font-weight: 700; line-height: 1.25; }

  .bg-beangrower-ai-pricing__service-note, .bg-beangrower-ai-pricing__service-direct { font-size: var(--text-s); line-height: 1.4; }

  .bg-beangrower-ai-pricing__service-direct { padding-block-start: var(--space-xs); border-block-start: 1px solid var(--neutral-light); }

  .bg-beangrower-ai-pricing__self-manage { display: grid; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__self-manage-title { font-size: var(--text-m); line-height: 1.3; }

  .bg-beangrower-ai-pricing__service-link { margin-block-start: auto; padding-block-start: var(--space-xs); font-size: var(--text-m); font-weight: 700; text-underline-offset: .18em; }

  .bg-beangrower-ai-pricing__service-link:focus-visible { outline: 2px solid var(--bg-brand-accent, var(--primary)); outline-offset: .2em; }

  .bg-beangrower-ai-pricing__included-notice { display: flex; justify-content: center; align-items: center; gap: var(--space-s); padding: var(--space-xs) var(--space-s); border-radius: var(--radius); }

  .bg-beangrower-ai-pricing__included-notice .bg-beangrower-ai-pricing__icon { inline-size: 1.6em; block-size: 1.6em; border-radius: var(--radius-circle); }

  .bg-beangrower-ai-pricing__included-notice .bg-beangrower-ai-pricing__glyph { inline-size: 1em; block-size: 1em; }

  .bg-beangrower-ai-pricing__included-notice-text { font-size: var(--text-m); font-weight: 600; line-height: 1.4; }
  @container ai-pricing (inline-size < 66rem) {
    .bg-beangrower-ai-pricing__service-card { padding: var(--space-s); }
    .bg-beangrower-ai-pricing__service-head { grid-template-columns: minmax(0,1fr); }
  }
  @container ai-pricing (inline-size < 48rem) {
    .bg-beangrower-ai-pricing__service-grid { grid-template-columns: minmax(0,1fr); }
    .bg-beangrower-ai-pricing__service-head { grid-template-columns: auto minmax(0,1fr); }
    .bg-beangrower-ai-pricing__service-price { font-size: var(--h3); }
  }

  /* One-off projects reuse the Managed card layout and responsive behaviour. */

  .bg-beangrower-ai-pricing__managed--project { border: 1px solid var(--primary-light); }

  .bg-beangrower-ai-pricing__managed-price--project { max-inline-size: 17rem; text-align: start; }

  .bg-beangrower-ai-pricing__project-price { font-size: var(--text-l); line-height: 1.25; }

  /* Included-service reassurance belongs inside its standalone offer. */

  .bg-beangrower-ai-pricing__included-notice--card { justify-content: start; align-items: start; gap: var(--space-xs); padding: var(--space-s); border: 1px solid color-mix(in oklch, var(--relative-heading-color, var(--heading-color)) 16%, transparent); }

  .bg-beangrower-ai-pricing__included-notice--card .bg-beangrower-ai-pricing__included-notice-text { color: var(--relative-text-color, var(--text-color)); }

  /* Show both monthly rates before the setup fee shared by both client groups. */

  .bg-beangrower-ai-pricing__service-direct--monthly { display: grid; gap: .25em; padding-block-start: 0; border-block-start: 0; }

  .bg-beangrower-ai-pricing__service-direct-rate { font-size: var(--text-l); font-weight: 600; line-height: 1.2; }

  .bg-beangrower-ai-pricing__service-direct-rate strong { font-size: var(--h4); }

  .bg-beangrower-ai-pricing__shared-setup { display: grid; gap: .35em; padding-block-start: var(--space-s); border-block-start: 1px solid var(--neutral-light); }

  .bg-beangrower-ai-pricing__icon:not(.surface-primary, .surface-secondary), .bg-beangrower-ai-pricing__tick:not(.surface-primary, .surface-secondary), .bg-beangrower-ai-pricing__footer-icon:not(.surface-primary, .surface-secondary) { color: var(--icon-color); color-scheme: var(--icon-scheme); }

  .bg-beangrower-ai-pricing__service-price, .bg-beangrower-ai-pricing__rate { color: var(--relative-heading-color, var(--heading-color)); }

  .bg-beangrower-ai-pricing__tag { color: var(--bg-soft-primary-text); }

  .bg-beangrower-ai-pricing__icon:is(.surface-primary, .surface-secondary) { color: var(--relative-heading-color, var(--heading-color)); }

  .bg-beangrower-ai-pricing__badge { color: var(--primary); }

  .bg-beangrower-ai-pricing__offers-title { color: var(--relative-heading-color, var(--heading-color)); }
}
.bg-ai-guarantee {
  /* General Section owns the original 35/65 columns and responsive stacking. */
  min-inline-size: 0;

  &.bg-ai-guarantee__artwork { display: grid; place-items: center; align-self: center; padding: var(--space-m); }

  .bg-ai-guarantee__seal { container-type: inline-size; display: grid; place-items: center; inline-size: min(100%, 15rem); aspect-ratio: 1; padding: var(--space-s); border: 0; border-radius: var(--radius-circle); filter: var(--drop-shadow-2); }

  .bg-ai-guarantee__seal-inner { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--space-3xs); inline-size: 100%; aspect-ratio: 1; padding: var(--space-xs); border: 2px dashed currentColor; border-radius: var(--radius-circle); text-align: center; line-height: 1.1; transform: rotate(-10deg); }

  .bg-ai-guarantee__seal-label { font-size: min(var(--text-s), 7cqi); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }

  .bg-ai-guarantee__seal-number { font-size: min(var(--h1), 28cqi); font-weight: 800; letter-spacing: -.04em; line-height: 1; }

  &.bg-ai-guarantee__copy { display: grid; gap: var(--space-m); }

  .bg-ai-guarantee__text { color: var(--relative-text-color, var(--text-color)); font-size: var(--text-m); line-height: 1.6; }

  .bg-ai-guarantee__actions { display: flex; flex-wrap: wrap; }
  /* Reduce only the button-to-terms gap from space-m to space-xs. */

  .bg-ai-guarantee__terms { margin-block-start: calc(var(--space-xs) - var(--space-m)); color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  @container (inline-size < 36rem) {
    .bg-ai-guarantee__actions .bg-button-wrap, .bg-ai-guarantee__actions .bg-button { inline-size: 100%; }
    .bg-ai-guarantee__actions .bg-button { justify-content: center; }
  }

  .bg-ai-guarantee__setup-title { font-size: var(--text-m); --h3-spacing: var(--space-s); }

  .bg-ai-guarantee__setup-title + p { --paragraph-spacing: var(--space-xs); }

  .bg-ai-guarantee__text > p, .bg-ai-guarantee__terms { max-inline-size: none; text-wrap: wrap; }
}
.bg-beangrower-ai-hero__demo-note {
  margin-block-start: var(--space-xs);
}
.bg-hero__stat--refined {
  .bg-hero--stat-layout-cards & .bg-hero__stat-value {
    color: var(--relative-heading-color, var(--heading-color));
    font-size: calc(var(--text-xl) * 1.36);
  }
  & .bg-hero__stat-label {
    color: var(--relative-text-color, var(--text-color));
    font-weight: 500;
    line-height: 1.4;
  }
}
.bg-hero-visual__item--soft {
  .bg-hero--visual-dashboard &.bg-hero-visual__item {
    background: color-mix(in srgb, var(--bg-primary-soft) 50%, var(--body-bg-color));
    border-color: transparent;
  }
  .bg-hero--visual-dashboard & .bg-hero-visual__title {
    font-weight: 600;
  }
  .bg-hero--visual-dashboard & .bg-hero-visual__headline {
    font-weight: 500;
  }

  .bg-hero--editable-visual.bg-hero--visual-dashboard .bg-hero__visual-shell--compact &.bg-hero-visual__item {
    padding: var(--space-xs);
  }
  .bg-hero--editable-visual.bg-hero--visual-dashboard .bg-hero__visual-shell--compact &.bg-hero-visual__item:has(.bg-hero-visual__decoration--icon) {
    padding-block-end: var(--space-xs);
    & .bg-hero-visual__headline,
    & .bg-hero-visual__note {
      margin-block-start: calc(var(--space-xs) / 3);
    }
  }
  .bg-hero--editable-visual.bg-hero--visual-dashboard .bg-hero__visual-shell--compact & .bg-hero-visual__title {
    line-height: 1.2;
  }
  .bg-hero--editable-visual.bg-hero--visual-dashboard .bg-hero__visual-shell--compact & .bg-hero-visual__headline {
    margin-block-start: calc(var(--space-xs) / 3);
    line-height: 1.25;
  }
  .bg-hero--editable-visual.bg-hero--visual-dashboard .bg-hero__visual-shell--compact & .bg-hero-visual__note {
    margin-block-start: calc(var(--space-xs) / 3);
    color: var(--relative-text-color, var(--text-color));
    line-height: 1.3;
  }
  .bg-hero--visual-dashboard & .bg-hero__dashboard-chart--bars > span:nth-child(1) {
    background: color-mix(in srgb, var(--bg-hero-visual-accent) 24%, var(--bg-hero-visual-surface));
  }
  .bg-hero--visual-dashboard & .bg-hero__dashboard-chart--bars > span:nth-child(2) {
    background: color-mix(in srgb, var(--bg-hero-visual-accent) 38%, var(--bg-hero-visual-surface));
  }
  .bg-hero--visual-dashboard & .bg-hero__dashboard-chart--bars > span:nth-child(3) {
    background: var(--tertiary);
  }
/* The third decorative bar uses Tertiary; the final bar uses Secondary. */
.bg-hero--visual-dashboard & .bg-hero__dashboard-chart--bars > span:last-child {
  background: var(--secondary);
}

}
.bg-hero__lede--balanced {
  &.bg-hero__lede {
    max-inline-size: 56ch;
    line-height: 1.55;
  }
}
.bg-brand-logo {
  display: inline-flex;
  vertical-align: middle;
  max-inline-size: 100%;
  line-height: 1;
  .bg-brand-logo__variant { max-inline-size: 100%; }
  .bg-brand-logo__variant--light { display: var(--bg-logo-light, inline-flex); }
  .bg-brand-logo__variant--dark { display: var(--bg-logo-dark, none); }
  .bg-brand-logo--light { --bg-logo-light: inline-flex; --bg-logo-dark: none; }
  .bg-brand-logo--dark { --bg-logo-light: none; --bg-logo-dark: inline-flex; }
  .bg-brand-logo__image { display: block; inline-size: auto; block-size: auto; max-inline-size: min(100%, var(--bg-logo-max-width, 11.25rem)); max-block-size: var(--bg-logo-max-height, 3rem); object-fit: contain; }
  .bg-brand-logo__backing { display: inline-flex; padding: calc(var(--space-xs) / 2); border-radius: var(--radius); background: var(--white); }

}
.bg-beangrower-ai-hero {
  /* Product identity stays fixed; surrounding hero uses native ACSS. */

  .bg-beangrower-ai-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }

  .bg-beangrower-ai-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }

  /* A native solid badge separates the eyebrow from its pale Primary hero. */

  & .bg-hero__eyebrow.surface-primary { background: var(--surface-3-background-color); color: var(--relative-heading-color, var(--heading-color)); }

/* Transparent conceptual artwork keeps its complete natural proportions. */
&.bg-hero.bg-hero--visual-image .bg-hero__visual-shell--image {
  aspect-ratio: auto;
  overflow: visible;
  border-radius: 0;
  box-shadow: none;
}
&.bg-hero--visual-image .bg-hero__visual-panel--image {
  aspect-ratio: auto;
  overflow: visible;
}
& .bg-hero__visual-image {
  display: block;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 1449 / 1160;
}

}
.bg-receptionist-cta {
  display: grid;
  justify-items: center;
  gap: var(--space-s);
  text-align: center;
  .bg-receptionist-cta__actions { display: flex; justify-content: center; inline-size: 100%; }
  .bg-receptionist-cta__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs) var(--space-m); list-style: none; padding-inline-start: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; }
  .bg-receptionist-cta__terms { max-inline-size: 75ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-receptionist-cta__terms a { color: var(--relative-link-color, var(--link-color)); text-decoration: underline; text-underline-offset: .16em; }
  .bg-receptionist-cta__terms a:focus-visible { outline: 2px solid var(--relative-link-color, var(--primary)); outline-offset: .2em; }
  @container (inline-size < 36rem) {
    .bg-receptionist-cta__actions .bg-button-wrap, .bg-receptionist-cta__actions .bg-button { inline-size: 100%; }
    .bg-receptionist-cta__actions .bg-button { justify-content: center; }
  }
}
.bg-mctb-closing {
  display: grid;
  justify-items: center;
  gap: var(--space-s);
  text-align: center;
  .bg-mctb-closing__actions { display: flex; justify-content: center; inline-size: 100%; }
  .bg-mctb-closing__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs) var(--space-m); list-style: none; padding-inline-start: 0; color: var(--relative-heading-color, var(--heading-color)); font-size: var(--text-s); font-weight: 600; }
  .bg-mctb-closing__terms { max-inline-size: 75ch; color: var(--relative-text-color, var(--text-color)); font-size: var(--text-s); line-height: 1.6; }
  .bg-mctb-closing__terms a { color: var(--relative-link-color, var(--link-color)); text-decoration: underline; text-underline-offset: .16em; }
  .bg-mctb-closing__terms a:focus-visible { outline: 2px solid var(--relative-link-color, var(--primary)); outline-offset: .2em; }
  @container (inline-size < 36rem) {
    .bg-mctb-closing__actions .bg-button-wrap, .bg-mctb-closing__actions .bg-button { inline-size: 100%; }
    .bg-mctb-closing__actions .bg-button { justify-content: center; }
  }
}
.bg-usage-hero {
  .bg-usage-hero__brand { display: block; inline-size: min(100%, 18rem); padding: var(--space-xs); margin-block-end: var(--space-s); border-radius: var(--radius); background: #121512; }
.bg-usage-hero__brand-logo { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 2387 / 305; }
}
.bg-about-picture {
  rotate: 1deg;
display: grid; gap: var(--space-m); inline-size: 100%; max-inline-size: 34rem; padding: var(--space-l); border: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); border-radius: var(--radius); box-shadow: 0 1rem 3rem color-mix(in srgb, var(--text-dark) 9%, transparent);
.bg-about-picture__head { display: flex; gap: var(--space-s); align-items: center; }
.bg-about-picture__heading { display: grid; gap: var(--space-xs); min-inline-size: 0; }
.bg-about-picture__eyebrow { color: var(--relative-link-color); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.bg-about-picture__title { font-size: var(--h3); line-height: 1.15; text-wrap: balance; }
.bg-about-picture__rows { counter-reset: about-picture; list-style: none; padding: 0; display: grid; gap: var(--space-xs); }
.bg-about-picture__row { counter-increment: about-picture; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--space-s); padding: var(--space-s); border-radius: var(--radius); }
.bg-about-picture__number { display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 1px solid color-mix(in srgb, var(--relative-link-color) 35%, transparent); border-radius: var(--radius-circle); color: var(--relative-link-color); font-size: var(--text-xs); }
.bg-about-picture__copy { display: grid; gap: .25em; }
.bg-about-picture__copy > p { font-size: var(--text-s); line-height: 1.4; }
.bg-about-picture__label { font-weight: 700; color: var(--relative-heading-color); }
.bg-about-picture__number::before { content: counter(about-picture, decimal-leading-zero); }
.bg-about-picture__footer { font-size: var(--text-s); line-height: 1.5; text-align: center; }
@container (inline-size < 37.5rem) { rotate: .6deg; padding: var(--space-m); .bg-about-picture__row { gap: var(--space-xs); } }
}
.bg-about-copy {
  display: grid; gap: var(--space-m); min-inline-size: 0;
& > p { line-height: 1.65; }
.bg-about-copy__statement { padding-inline-start: var(--space-m); border-inline-start: 3px solid var(--relative-link-color, var(--primary)); font-size: var(--text-l); font-weight: 600; color: var(--relative-heading-color, var(--heading-color)); }
.bg-section-head + & { margin-block-start: var(--space-m); }
}
.bg-about-priorities {
  container-type: inline-size;
.bg-about-priorities__conversation { display: grid; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); border-radius: var(--radius); box-shadow: 0 .75rem 2rem color-mix(in srgb, var(--text-dark) 5%, transparent); }
.bg-about-priorities__head { display: flex; align-items: center; gap: var(--space-s); }
.bg-about-priorities__heading { display: grid; gap: .25em; min-inline-size: 0; }
.bg-about-priorities__heading > h3 { font-size: var(--text-l); line-height: 1.25; text-wrap: pretty; }
.bg-about-priorities__kicker { color: var(--relative-link-color); font-size: var(--text-s); font-weight: 600; }
.bg-about-priorities__choices { display: flex; flex-wrap: wrap; gap: var(--space-xs); padding: 0; margin: 0; border: 0; min-inline-size: 0; }
.bg-about-priorities__legend { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bg-about-priorities__choice { display: inline-flex; align-items: center; gap: .5em; padding: .65em .9em; border: 1px solid color-mix(in srgb, var(--relative-heading-color) 20%, transparent); border-radius: var(--radius); cursor: pointer; font-size: var(--text-s); }
.bg-about-priorities__choice > input { inline-size: 1.1em; block-size: 1.1em; margin: 0; accent-color: var(--relative-link-color); cursor: pointer; }
/* Existing soft-fill classes own the selected colour. Only the unchecked state clears it. */
.bg-about-priorities__choice:not(:has(input:checked)) { background-color: transparent; }
.bg-about-priorities__choice:has(input:checked) { border-color: var(--relative-link-color); }
.bg-about-priorities__choice:has(input:focus-visible) { outline: 2px solid var(--relative-link-color); outline-offset: 3px; }
.bg-about-priorities__note { padding-block-start: var(--space-s); border-block-start: 1px dashed color-mix(in srgb, var(--relative-heading-color) 20%, transparent); color: var(--relative-link-color); font-family: Caveat, cursive; font-size: var(--text-xl); }
&.bg-about-priorities--process { display: grid; gap: var(--space-l); }
&.bg-about-priorities--process > p { max-inline-size: 80ch; }
.bg-about-priorities__steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-s); }
.bg-about-priorities__step { display: grid; align-content: start; gap: var(--space-s); padding: var(--space-m); border: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); border-radius: var(--radius); }
.bg-about-priorities__step-number { display: grid; place-items: center; inline-size: 2.5rem; block-size: 2.5rem; border-radius: var(--radius); font-weight: 700; }
.bg-about-priorities__step > h3 { font-size: var(--text-m); line-height: 1.4; color: var(--relative-heading-color); }
.bg-about-priorities__expect { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-s) var(--space-m); padding: var(--space-m); border-radius: var(--radius); font-size: var(--text-s); }
.bg-about-priorities__expect > p { inline-size: auto; flex: 0 0 auto; font-weight: 700; }
.bg-about-priorities__expect > ul { list-style: none; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--space-s) var(--space-m); }
.bg-about-priorities__expect li { display: flex; gap: .65em; }
.bg-about-priorities__expect li > span { color: var(--relative-link-color); }
@container (inline-size < 60rem) { .bg-about-priorities__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (inline-size < 30rem) { .bg-about-priorities__steps { grid-template-columns: minmax(0, 1fr); } .bg-about-priorities__conversation { padding: var(--space-m); } }
.bg-about-priorities__step-marker { display: flex; align-items: center; gap: var(--space-s); }
.bg-about-priorities__step-marker::after { content: ''; flex: 1; block-size: 1px; background: linear-gradient(to right, color-mix(in srgb, var(--relative-link-color) 35%, transparent), transparent); }
.bg-about-priorities__step:last-child .bg-about-priorities__step-marker::after { display: none; }

}
.bg-about-support {
  display: grid; align-content: start; gap: var(--space-m); border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 18%, transparent); padding-block-start: var(--space-l);
.bg-about-support__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-xs) var(--space-m); }
.bg-about-support__eyebrow { grid-column: 1; color: var(--relative-link-color, var(--link-color)); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.bg-about-support__head > h3 { grid-column: 1; font-size: var(--h3); }
.bg-about-support__head > .bg-icon { grid-column: 2; grid-row: 1 / 3; --bg-icon-glyph-size: 55%; }
& > p { line-height: 1.65; }
}
.bg-about-network {
  display: grid; gap: var(--space-m); padding: var(--space-l); border: 1px solid color-mix(in srgb, var(--relative-heading-color) 25%, transparent); border-radius: var(--radius);
.bg-about-network__label { font-size: var(--text-xs); font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.bg-about-network__links { list-style: none; padding: 0; }
.bg-about-network__links > li { border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color) 20%, transparent); }
.bg-about-network__links a { display: flex; align-items: center; justify-content: space-between; gap: var(--space-s); padding-block: var(--space-m); font-weight: 600; text-decoration: none; }
.bg-about-network__links a:hover { text-decoration: underline; text-underline-offset: .2em; }
.bg-about-network__note { font-size: var(--text-s); line-height: 1.5; }
@container (inline-size < 37.5rem) { padding: var(--space-m); }
}
.bg-about-activity {
  display: grid; gap: var(--space-l); min-inline-size: 0; padding: var(--space-s);
/* Supplied product logo: retain its agreed fixed charcoal plate. */
.bg-about-activity__brand { background: #121512; justify-self: center; inline-size: min(100%, 18rem); padding: var(--space-xs) var(--space-s); border-radius: var(--radius); }
.bg-about-activity__brand > svg { display: block; inline-size: 100%; block-size: auto; }
.bg-about-activity__scene { position: relative; isolation: isolate; }
.bg-about-activity__backing { position: absolute; z-index: -1; inset: .75rem -.5rem -.75rem .5rem; border-radius: var(--radius); rotate: 2deg; pointer-events: none; }
.bg-about-activity__panel { display: grid; gap: var(--space-m); padding: var(--space-m); border-radius: var(--radius); box-shadow: 0 .75rem 2rem color-mix(in srgb, var(--text-dark) 7%, transparent); }
.bg-about-activity__header { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s); padding-block-end: var(--space-s); border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); }
.bg-about-activity__header > h3 { font-size: var(--h4); }
.bg-about-activity__tag { inline-size: auto; flex: 0 0 auto; margin-inline-start: auto; padding: .3em .55em; font-size: var(--text-xs); border-radius: var(--radius); }
.bg-about-activity__rows { list-style: none; padding: 0; display: grid; gap: var(--space-xs); }
.bg-about-activity__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }
.bg-about-activity__symbol { display: grid; place-items: center; inline-size: 2.2rem; block-size: 2.2rem; border-radius: var(--radius-circle); font-weight: 700; }
.bg-about-activity__copy { display: grid; gap: .25em; }
.bg-about-activity__copy > p { font-size: var(--text-s); line-height: 1.4; }
.bg-about-activity__copy > p:first-child { font-weight: 700; color: var(--relative-heading-color); }
.bg-about-activity__category { font-size: var(--text-xs); font-weight: 600; }
.bg-about-activity__note { font-size: var(--text-s); line-height: 1.5; }
@container (inline-size < 30rem) { .bg-about-activity__row { grid-template-columns: auto minmax(0, 1fr); } .bg-about-activity__category { grid-column: 2; } }
}
.bg-about-closing {
  display: grid; gap: var(--space-m); justify-items: center; max-inline-size: 76ch; margin-inline: auto; text-align: center;
& > p { line-height: 1.65; }
.bg-about-closing__actions { display: flex; justify-content: center; margin-block-start: var(--space-s); }
}
.bg-about-cta {
  position: relative; isolation: isolate; container-type: inline-size; overflow: clip;
& .bg-section-general-01__container { position: relative; z-index: 1; }
.bg-about-cta__watermark { position: absolute; z-index: 0; inset-inline: 0; inset-block-end: -.14em; display: block; inline-size: 100%; font-size: 24cqi; font-weight: 800; line-height: .82; letter-spacing: -.065em; text-align: center; color: color-mix(in srgb, var(--primary) 8%, transparent); pointer-events: none; user-select: none; }

}
.bg-team-profile__back {
  & { display: inline-block; font-size: var(--text-s); margin-block-end: var(--space-s); }
}
.bg-team-profile__letters {
  & { display: inline; color: var(--primary); font-size: var(--text-l); font-weight: 500; padding-inline-start: .3em; }
}
.bg-team-profile__intro {
  & { display: grid; gap: var(--space-m); }
& > p { line-height: 1.65; white-space: pre-line; }
}
.bg-team-profile__role {
  & { color: var(--relative-link-color); font-size: var(--text-l); font-weight: 600; }
}
.bg-team-tags {
  list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-xs);
& > li { border: 0; background: var(--bg-primary-soft); color: var(--bg-soft-primary-text); border-radius: var(--radius-circle); padding: .4em .8em; font-size: var(--text-s); line-height: 1.35; }
}
.bg-team-profile__portrait {
  & { display: grid; justify-items: center; gap: var(--space-m); inline-size: min(100%, 23rem); padding: var(--space-l); border-radius: var(--radius); rotate: 1deg; box-shadow: 0 .75rem 2rem color-mix(in srgb, var(--text-dark) 6%, transparent); margin-inline: auto; }
}
.bg-team-profile__photo {
  & { inline-size: min(100%, 16rem); aspect-ratio: 1; border-radius: var(--radius-circle); overflow: hidden; }
& > img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
}
.bg-team-profile__caption {
  & { font-family: Caveat, cursive; font-size: var(--text-xl); color: var(--relative-link-color); text-align: center; }
}
.bg-team-profile {
  container-type: inline-size;









.bg-team-profile__details { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; gap: var(--space-xl); }
.bg-team-profile__details > :only-child { grid-column: 1 / -1; }
.bg-team-profile__professional { display: grid; gap: var(--space-l); }
.bg-team-profile__copy { display: grid; gap: var(--space-s); }
.bg-team-profile__copy > h3 { font-size: var(--h4); }
.bg-team-profile__copy > :is(p, ul, ol) { line-height: 1.65; }
.bg-team-profile__copy > :is(ul, ol) { padding-inline-start: 1.5em; }
.bg-team-profile__copy li + li { margin-block-start: .35em; }
.bg-team-profile__contact { display: grid; gap: var(--space-l); padding: var(--space-l); border-radius: var(--radius); min-inline-size: 0; }
.bg-team-profile__contact-links { display: grid; gap: var(--space-s); overflow-wrap: anywhere; }
.bg-team-profile__contact-links:empty { display: none; }
.bg-team-profile__aside { display: grid; gap: var(--space-m); min-inline-size: 0; }
.bg-team-profile__location { display: grid; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 15%, transparent); }
.bg-team-profile__location > h3 { display: flex; align-items: center; gap: .5em; font-size: var(--h4); color: var(--bg-soft-primary-text); }
.bg-team-profile__offices { display: grid; gap: var(--space-s); }
.bg-team-profile__offices > div { display: grid; gap: .25em; }
.bg-team-profile__offices dt { font-size: var(--text-s); color: var(--bg-soft-primary-text); }
.bg-team-profile__offices dd { margin-inline: 0; font-size: var(--text-m); font-weight: 600; color: var(--relative-heading-color, var(--heading-color)); }
.bg-team-profile__personal { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: var(--space-l); align-items: start; }
.bg-team-profile__personal > :only-child { grid-column: 1 / -1; }
.bg-team-profile__questions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-m); }
.bg-team-profile__answer { padding: var(--space-m); display: grid; gap: var(--space-s); border-radius: var(--radius); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
.bg-team-profile__answer dt { font-weight: 700; color: var(--relative-heading-color, var(--heading-color)); }
.bg-team-profile__answer dd { margin-inline: 0; line-height: 1.65; white-space: pre-line; }
.bg-team-profile__fun { display: grid; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius); }
.bg-team-profile__fun > h3 { font-size: var(--h3); }
.bg-team-profile__fun > p { line-height: 1.65; white-space: pre-line; }

@container (inline-size < 60rem) { .bg-team-profile__details, .bg-team-profile__personal { grid-template-columns: minmax(0, 1fr); gap: var(--space-l); } }
@container (inline-size < 36rem) { .bg-team-profile__questions { grid-template-columns: minmax(0, 1fr); } .bg-team-profile__contact, .bg-team-profile__location, .bg-team-profile__fun { padding: var(--space-m); } }
}
.bg-team-profile__navigation {
  & { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-m); font-weight: 600; }
}
.bg-team-directory__demo {
  font-size: var(--text-xs); line-height: 1.5; opacity: .75;
}
.bg-team-intro {
  display: grid; gap: var(--space-m);
& > p { line-height: 1.65; }
.bg-team-intro__lead { font-size: var(--text-l); color: var(--relative-heading-color, var(--heading-color)); font-weight: 500; }
& > a { justify-self: start; font-weight: 700; }
}
.bg-team-directory {
  container-type: inline-size; display: grid; gap: var(--space-l); scroll-margin-block-start: var(--space-xl);
.bg-team-directory__intro { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-m); }
.bg-team-directory__intro > p:first-child { max-inline-size: 46ch; font-size: var(--text-l); }
.bg-team-directory__handwritten { font-family: Caveat, cursive; font-size: var(--text-xl); color: var(--primary); rotate: -3deg; inline-size: auto; justify-self: end; }
.bg-team-directory__filterbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-s) var(--space-m); padding-block: var(--space-m); border-block: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 15%, transparent); }
.bg-team-directory__filterbar[hidden] { display: none; }
.bg-team-directory__filter-label { grid-column: 1 / -1; font-size: var(--text-s); font-weight: 600; }
.bg-team-directory__filters { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.bg-team-directory__filters > button { cursor: pointer; background: transparent; color: var(--relative-text-color); border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 24%, transparent); border-radius: var(--radius-circle); padding: .65em 1.1em; font: inherit; font-size: var(--text-s); }
.bg-team-directory__filters > button[aria-pressed='true'] { background: var(--relative-heading-color, var(--heading-color)); color: var(--relative-background-color, var(--body-bg-color)); }
.bg-team-directory__filters > button:hover { border-color: var(--relative-link-color); }
.bg-team-directory__filters > button:focus-visible { outline: 2px solid var(--relative-link-color); outline-offset: 3px; }
.bg-team-directory__count { font-size: var(--text-s); align-self: center; }
.bg-team-directory__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-m); align-items: stretch; }
.bg-team-directory__card { min-inline-size: 0; display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 15%, transparent); border-radius: var(--radius); overflow: hidden; }
.bg-team-directory__card[hidden] { display: none; }
.bg-team-directory__portrait { display: grid; place-items: center; padding: var(--space-m); }
.bg-team-directory__photo { inline-size: clamp(8rem, 13cqi, 12rem); aspect-ratio: 1; border-radius: var(--radius-circle); overflow: hidden; border: .3rem solid var(--body-bg-color); }
.bg-team-directory__photo > img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.bg-team-directory__body { display: flex; flex-direction: column; flex-grow: 1; gap: var(--space-s); padding: var(--space-m); }
.bg-team-directory__body > p { font-size: var(--text-s); line-height: 1.65; white-space: pre-line; }
.bg-team-directory__body > .bg-team-directory__role { color: var(--bg-soft-primary-text); font-size: var(--text-s); font-weight: 700; }
.bg-team-directory__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3em; font-size: var(--h3); line-height: 1.2; }
.bg-team-directory__letters { font-size: var(--text-s); font-weight: 500; color: var(--primary); }
.bg-team-directory__body > .bg-team-directory__location { display: flex; align-items: center; gap: .45em; font-size: var(--text-s); color: var(--bg-soft-primary-text); }
.bg-team-directory__profile { margin-block-start: auto; font-weight: 700; padding-block-start: var(--space-xs); align-self: flex-start; }
.bg-team-directory__contact { padding-block-start: var(--space-s); border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 15%, transparent); }
.bg-team-directory__demo { font-size: var(--text-xs); line-height: 1.5; opacity: .75; }
.bg-team-directory__empty[hidden] { display: none; }
@container (inline-size < 60rem) { .bg-team-directory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bg-team-directory__photo { inline-size: 10rem; } }
@container (inline-size < 36rem) { .bg-team-directory__grid { grid-template-columns: minmax(0, 1fr); } .bg-team-directory__filterbar { grid-template-columns: minmax(0, 1fr); } .bg-team-directory__intro { grid-template-columns: minmax(0, 1fr); } }
/* Slightly smaller directory badges; contact links retain colour and focus cues. */
& .bg-team-tags > li { font-size: calc(var(--text-s) * .9); }
& :is(.bg-team-contact__phone, .bg-team-contact__email),
& :is(.bg-team-contact__phone, .bg-team-contact__email):is(:hover, :focus, :active) { text-decoration: none; }
}
.bg-team-closing {
  display: grid; justify-items: center; gap: var(--space-m); max-inline-size: 70ch; margin-inline: auto; text-align: center;
& > p { line-height: 1.65; }
}
.bg-team-icon {
  display: inline-block; inline-size: 1.3em; block-size: 1.3em; flex: 0 0 1.3em; vertical-align: middle;
}
.bg-team-contact {
  display: grid; gap: var(--space-s); font-size: var(--text-s); overflow-wrap: anywhere;
.bg-team-contact__phone { display: flex; align-items: center; gap: .6em; inline-size: fit-content; font-weight: 600; }
.bg-team-contact__phone > span { display: grid; gap: .15em; }
.bg-team-contact__phone > span > * { line-height: 1.2; }
.bg-team-contact__phone small { font-size: .85em; font-weight: 400; }
.bg-team-contact__links { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-m); align-items: center; }
.bg-team-contact__email, .bg-team-contact__linkedin { display: inline-flex; align-items: center; gap: .5em; min-inline-size: 0; }
.bg-team-contact__email > [data-email-label] { min-inline-size: 0; }
.bg-team-contact__arrow { margin-inline-start: auto; }
&.bg-team-contact--profile { gap: var(--space-m); }
&.bg-team-contact--profile .bg-team-contact__phone { font-size: var(--text-xl); }
&.bg-team-contact--profile .bg-team-contact__phone small { font-size: var(--text-s); }
&.bg-team-contact--profile .bg-team-contact__links { display: grid; gap: var(--space-m); }
&.bg-team-contact--profile .bg-team-contact__email { padding: 1em 1.25em; border-radius: var(--radius); font-size: var(--text-m); font-weight: 600; text-decoration: none; }
&.bg-team-contact--profile .bg-team-contact__email:hover { text-decoration: underline; }
&.bg-team-contact--profile .bg-team-contact__linkedin { justify-self: start; }
& a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Profile telephone links keep the native colour and keyboard focus outline. */
&.bg-team-contact--profile .bg-team-contact__phone,
&.bg-team-contact--profile .bg-team-contact__phone:is(:hover, :focus, :active) { text-decoration: none; }

}
.bg-team-personal-heading {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--space-m); container-type: inline-size;
.bg-team-personal-heading__note { font-family: Caveat, cursive; font-size: var(--text-xl); color: var(--primary); rotate: -3deg; justify-self: end; inline-size: auto; }
@container (inline-size < 40rem) { & { grid-template-columns: minmax(0, 1fr); } }

}
.bg-team-cta {
  position: relative; isolation: isolate; container-type: inline-size; overflow: clip;
& .bg-section-general-01__container { position: relative; z-index: 1; }
.bg-team-cta__watermark { position: absolute; z-index: 0; inset-inline: 0; inset-block-end: -.14em; display: block; inline-size: 100%; font-size: 24cqi; font-weight: 800; line-height: .82; letter-spacing: -.065em; text-align: center; color: color-mix(in srgb, var(--primary) 8%, transparent); pointer-events: none; user-select: none; }

}
.bg-careers {
  container-type: inline-size;

  .bg-careers__artwork { position: relative; inline-size: min(100%, 32rem); margin-inline: auto; padding: var(--space-m) var(--space-m) var(--space-xl) 0; isolation: isolate; }
  .bg-careers__backing { position: absolute; inset: var(--space-l) 0 0 var(--space-m); border-radius: var(--radius); transform: rotate(4deg); z-index: -1; }
  .bg-careers__art-card { display: grid; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius); border: 1px solid color-mix(in srgb, var(--heading-color) 10%, transparent); box-shadow: 0 1rem 3rem color-mix(in srgb, var(--text-dark) 8%, transparent); }
  .bg-careers__art-label, .bg-careers__category { color: var(--bg-soft-primary-text); font-size: var(--text-s); font-weight: 700; letter-spacing: .07em; }
  .bg-careers__portraits { display: flex; padding-inline-start: .4rem; }
  .bg-careers__portraits > a { display: block; flex: 0 0 4.5rem; inline-size: 4.5rem; block-size: 4.5rem; border: 3px solid var(--white); border-radius: var(--radius-circle); margin-inline-start: -.4rem; pointer-events: auto; }
  .bg-careers__portraits > a > img { inline-size: 100%; block-size: 100%; object-fit: cover; }
  .bg-careers__art-title { font-size: var(--h3); line-height: 1.1; }
  .bg-careers__art-title > span { display: block; }
  .bg-careers__art-title > mark { display: block; background: transparent; color: var(--primary); }
  .bg-careers__art-copy { border-block-start: 3px solid var(--secondary); padding-block-start: var(--space-s); }
  .bg-careers__handwritten { font-family: var(--font-family-handwritten, 'Caveat', cursive); color: var(--primary); font-size: var(--text-xl); line-height: 1.2; }
  .bg-careers__artwork > .bg-careers__handwritten { padding: var(--space-s) var(--space-m) 0; }
  .bg-careers__split { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: var(--space-xl); align-items: start; }
  &.bg-careers__note { margin-block-start: var(--space-l); padding: var(--space-m); border-radius: var(--radius); display: flex; gap: var(--space-s); align-items: start; }
  &.bg-careers__note > span { color: inherit; font-size: var(--text-xl); }
  .bg-careers__listing-head { display: flex; gap: var(--space-m); justify-content: space-between; align-items: end; margin-block-end: var(--space-l); }
  .bg-careers__count { flex: 0 0 auto; inline-size: max-content; white-space: nowrap; font-size: var(--text-s); font-weight: 700; padding: .5em .8em; border-radius: var(--radius); }
  .bg-careers__jobs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-m); list-style: none; padding: 0; margin: 0; }
  .bg-careers__job { block-size: 100%; display: flex; flex-direction: column; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius); border: 1px solid color-mix(in srgb, var(--heading-color) 12%, transparent); }
  .bg-careers__job-title { font-size: var(--h3); }
  .bg-careers__job-title > a { color: inherit; text-decoration: none; }
  .bg-careers__job-title > a:hover { text-decoration: underline; }
  .bg-careers__tags { display: flex; flex-wrap: wrap; gap: var(--space-xs); list-style: none; padding: 0; margin: 0; }
  .bg-careers__tags > li { padding: .35em .65em; border-radius: var(--radius); background: var(--bg-primary-soft); color: var(--bg-soft-primary-text); font-size: var(--text-s); }
  .bg-careers__salary { display: grid; gap: var(--space-xs); margin-block-start: auto; }
  .bg-careers__salary > strong { font-size: var(--text-xl); color: var(--heading-color); }
  .bg-careers__salary > span { font-size: var(--text-s); }
  .bg-careers__copy { display: grid; gap: var(--space-m); }
  .bg-careers__form-preview { display: grid; gap: var(--space-m); border: 1px solid color-mix(in srgb, var(--heading-color) 12%, transparent); border-radius: var(--radius); padding: var(--space-l); }
  .bg-careers__form-note { font-size: var(--text-s); }
  .bg-careers__form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-m); }
  .bg-careers__field { display: grid; gap: var(--space-xs); font-size: var(--text-s); }
  .bg-careers__field > span:first-child { font-weight: 600; }
  .bg-careers__input { display: block; min-block-size: 3rem; border: 1px solid color-mix(in srgb, var(--heading-color) 25%, transparent); border-radius: var(--radius); background: var(--body-bg-color); }
  .bg-careers__textarea { min-block-size: 8rem; }
  .bg-careers__upload { display: grid; gap: var(--space-xs); padding: var(--space-l) var(--space-m); text-align: center; border: 1px dashed color-mix(in srgb, var(--heading-color) 35%, transparent); border-radius: var(--radius); }
  .bg-careers__submit { pointer-events: none; text-align: center; }
  .bg-careers__applying { display: grid; gap: var(--space-xs); padding-block-end: var(--space-m); border-block-end: 1px solid color-mix(in srgb, var(--heading-color) 12%, transparent); }
  @container (width < 60rem) { .bg-careers__split { grid-template-columns: 1fr; gap: var(--space-l); } }
  @container (width < 40rem) { .bg-careers__jobs, .bg-careers__form-row { grid-template-columns: 1fr; } .bg-careers__listing-head { align-items: start; flex-direction: column; } .bg-careers__job, .bg-careers__form-preview { padding: var(--space-m); } }
  .bg-careers__conversation { display: flex; align-items: center; gap: var(--space-s); }

}
.bg-vacancy {
  container-type: inline-size;
  .bg-vacancy__back { display: inline-block; margin-block-end: var(--space-m); font-size: var(--text-s); }
  .bg-vacancy__intro { display: grid; gap: var(--space-m); }
  .bg-vacancy__salary-panel { inline-size: 100%; display: grid; gap: var(--space-m); padding: var(--space-l); border: 1px solid color-mix(in srgb, var(--heading-color) 12%, transparent); border-radius: var(--radius); }
  .bg-vacancy__salary-label { color: var(--bg-soft-primary-text); text-transform: uppercase; letter-spacing: .1em; font-size: var(--text-s); font-weight: 700; }
  .bg-vacancy__salary { font-size: var(--h3); line-height: 1.15; color: var(--heading-color); }
  .bg-vacancy__layout { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(16rem,1fr); gap: var(--space-xl); align-items: start; }
  .bg-vacancy__layout--full { grid-template-columns: minmax(0,1fr); }
  .bg-vacancy__sections { display: grid; gap: var(--space-l); }
  .bg-vacancy__section { display: grid; gap: var(--space-s); padding-block-end: var(--space-l); border-block-end: 1px solid color-mix(in srgb, var(--heading-color) 12%, transparent); }
  .bg-vacancy__section:last-child { padding-block-end: 0; border: 0; }
  .bg-vacancy__section > h2 { font-size: var(--h3); }
  .bg-vacancy__prose { display: grid; gap: var(--space-s); }
  .bg-vacancy__prose ul, .bg-vacancy__prose ol { padding-inline-start: 1.3em; }
  .bg-vacancy__prose li + li { margin-block-start: var(--space-xs); }
  .bg-vacancy__aside { display: grid; gap: var(--space-s); padding: var(--space-l); border-radius: var(--radius); }
  /* DL has browser margins: remove them because this card owns its spacing. */
  .bg-vacancy__facts { display: grid; gap: 0; margin-block: 0; }
  .bg-vacancy__facts > div { display: grid; gap: calc(var(--space-xs) / 2); padding-block: var(--space-s); border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 12%, transparent); }
  .bg-vacancy__facts > div:first-child { padding-block-start: 0; }
  .bg-vacancy__facts dt { font-size: var(--text-s); opacity: .8; }
  .bg-vacancy__facts dd { margin-inline-start: 0; font-weight: 600; color: var(--heading-color); }
  &.bg-vacancy__closed { display: grid; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius); }
  @container (width < 60rem) { .bg-vacancy__layout { grid-template-columns: 1fr; gap: var(--space-l); } }
}
.bg-client-intro {
  display: grid; gap: var(--space-m);
& > p { line-height: 1.65; }
}
.bg-client-jump {
  .bg-client-jump__link { display: inline-flex; align-items: center; gap: var(--space-xs); max-inline-size: 100%; font-size: var(--text-s); font-weight: 700; text-decoration: none; }
.bg-client-jump__link:hover { text-decoration: underline; text-underline-offset: .2em; }
.bg-client-jump__arrow { display: grid; place-items: center; flex: none; inline-size: 2.6rem; block-size: 2.6rem; border: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); border-radius: var(--radius-circle); font-size: var(--text-xl); line-height: 1; }
}
.bg-client-statement {
  /* Hero01 owns the columns, shared pattern/glow and responsive stacking.
   This is a text statement panel, so it enters without image-style hover zoom. */
/* Reference artwork treatment: fixed tonal separation, native Primary hue. */
&.bg--dark { background-color: oklch(from var(--primary) 0.330036 0.051799 h); }
position: relative; isolation: isolate; overflow: hidden; display: grid; align-content: center; gap: var(--space-m); inline-size: min(100%, 29rem); margin-inline: auto; padding: var(--space-l); border-radius: var(--radius); box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--text-dark) 10%, transparent);
&::after { content: ""; position: absolute; z-index: -1; inline-size: 12rem; block-size: 12rem; inset-inline-end: -2rem; inset-block-end: -2rem; border-inline-end: 3rem solid currentColor; border-block-end: 3rem solid currentColor; opacity: .035; rotate: -14deg; pointer-events: none; }
.bg-client-statement__message { font-family: var(--heading-font-family); color: var(--relative-heading-color); font-size: var(--h3); font-weight: 600; letter-spacing: var(--heading-letter-spacing); line-height: 1.3; }
.bg-client-statement__accent { display: block; margin-block-start: var(--space-m); color: oklch(from var(--primary) 0.862628 0.072584 h); font-weight: 700; }
.bg-client-statement__rule { min-inline-size: 0; min-block-size: 0; display: block; inline-size: 3rem; block-size: 2px; background: var(--relative-heading-color); }
.bg-client-statement__note { font-family: var(--font-family-handwritten, "Caveat", cursive); color: var(--relative-heading-color); font-size: var(--text-xl); line-height: 1.25; }
@container (inline-size < 37.5rem) { padding: var(--space-m); }
}
.bg-client-form {
  scroll-margin-block-start: 9rem;
.bg-client-form__placeholder { display: grid; gap: var(--space-xs); min-block-size: 12rem; align-content: center; justify-items: center; text-align: center; padding: var(--space-l); border: 1px dashed color-mix(in srgb, var(--relative-heading-color) 25%, transparent); border-radius: var(--radius); }
.bg-client-form__placeholder > p { font-size: var(--text-s); }
.bg-client-form__placeholder > .bg-client-form__label { font-size: var(--text-m); font-weight: 600; color: var(--relative-heading-color); }
}
.bg-contact-office {
  /* Shared facts and contact actions; a separate map beside the single-office details panel. */
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-m);
min-inline-size: 0;
padding: var(--space-l);
border-radius: var(--radius-l, var(--radius));
border: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent);
box-shadow: 0 .5rem 2rem color-mix(in srgb, var(--text-dark) 4%, transparent);
.bg-contact-office__details { display: contents; }
.bg-contact-office__eyebrow { font-weight: 700; color: var(--bg-soft-primary-text); flex-basis: 100%; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: .08em; }
.bg-contact-office__header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-s); }
.bg-contact-office__title { font-size: var(--h3); }
.bg-contact-office__badge { padding: .4em .8em; border-radius: var(--radius); font-size: var(--text-xs); }
.bg-contact-office__body { display: grid; gap: var(--space-m); align-content: start; min-inline-size: 0; }
.bg-contact-office__body > p, .bg-contact-office__body > address { margin: 0; }
.bg-contact-office__address { display: grid; font-style: normal; line-height: 1.6; }
.bg-contact-office__links { display: grid; gap: var(--space-s); overflow-wrap: anywhere; }
.bg-contact-office__links > a { display: flex; gap: var(--space-xs); align-items: baseline; }
.bg-contact-office__whatsapp { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-s); border-radius: var(--radius); }
.bg-contact-office__whatsapp > svg { inline-size: 1.3em; block-size: 1.3em; flex-shrink: 0; color: var(--relative-link-color); }
.bg-contact-office__links > a, .bg-contact-office__whatsapp { text-decoration: none; }
.bg-contact-office__links > a:hover, .bg-contact-office__links > a:focus-visible, .bg-contact-office__whatsapp:hover, .bg-contact-office__whatsapp:focus-visible { text-decoration: underline; text-underline-offset: .2em; }
.bg-contact-office__profile { grid-column: 1 / -1; border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); padding-block-start: var(--space-s); font-size: var(--text-s); }
.bg-contact-office__hours { padding-block-start: var(--space-s); border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); }
.bg-contact-office__hours > strong { color: var(--relative-heading-color); }
.bg-contact-office__hours > p, .bg-contact-office__visit p { white-space: pre-line; }
.bg-contact-office__visit { border-block: 1px solid color-mix(in srgb, var(--relative-heading-color) 12%, transparent); padding-block: var(--space-s); }
.bg-contact-office__visit summary { font-weight: 600; color: var(--relative-heading-color); cursor: pointer; }
.bg-contact-office__visit p { margin-block-start: var(--space-s); }
.bg-contact-office__map { display: grid; align-content: start; gap: var(--space-s); min-inline-size: 0; }
.bg-contact-office__map-frame { inline-size: 100%; block-size: 14rem; border: 0; border-radius: var(--radius); }
.bg-contact-office__map-link { min-block-size: 14rem; display: grid; align-content: center; justify-items: center; gap: var(--space-s); padding: var(--space-m); border-radius: var(--radius); text-align: center; }
.bg-contact-office__map-icon { inline-size: 2.5rem; color: var(--relative-link-color); }
.bg-contact-office__map-icon svg { inline-size: 100%; block-size: auto; }
.bg-contact-office__map-actions { display: flex; flex-wrap: wrap; gap: var(--space-s) var(--space-m); font-size: var(--text-s); }
.bg-contact-office__map-actions > a { text-underline-offset: .2em; }
&.bg-contact-office--compact .bg-contact-office__map { grid-row: 2; }
&.bg-contact-office--wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: var(--space-l); }
&.bg-contact-office--wide .bg-contact-office__details { display: grid; align-content: start; gap: var(--space-m); min-inline-size: 0; }
&.bg-contact-office--wide .bg-contact-office__map-frame, &.bg-contact-office--wide .bg-contact-office__map-link { min-block-size: 23rem; block-size: 100%; }
@container (inline-size < 52rem) {
  &.bg-contact-office--wide { grid-template-columns: minmax(0, 1fr); }
  &.bg-contact-office--wide .bg-contact-office__map-frame, &.bg-contact-office--wide .bg-contact-office__map-link { min-block-size: 16rem; }
}
@container (inline-size < 32rem) { padding: var(--space-m); }

&.bg-contact-office--single { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: var(--space-l); padding: 0; border: 0; box-shadow: none; }
&.bg-contact-office--single .bg-contact-office__details { display: grid; align-content: start; gap: var(--space-m); padding: var(--space-l); border-radius: var(--radius-l, var(--radius)); }
&.bg-contact-office--single .bg-contact-office__map-frame { min-block-size: 28rem; block-size: 100%; }
@container (inline-size < 52rem) {
  &.bg-contact-office--single { grid-template-columns: minmax(0, 1fr); }
  &.bg-contact-office--single .bg-contact-office__map-frame { min-block-size: 20rem; }
}
@container (inline-size < 32rem) { &.bg-contact-office--single .bg-contact-office__details { padding: var(--space-m); } }

/* The profile supplies the single divider below the parking disclosure. */
&.bg-contact-office--single .bg-contact-office__visit { border-block-end: 0; }

}
.bg-contact-offices {
  scroll-margin-block-start: 8rem;
.bg-contact-offices__introduction { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: var(--space-xl); }
.bg-contact-offices__introduction > p { margin: 0; }
@container (inline-size < 52rem) { .bg-contact-offices__introduction { grid-template-columns: minmax(0, 1fr); gap: var(--space-m); } }
.bg-contact-offices__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr)); gap: var(--space-m); align-items: start; }
.bg-contact-offices__help { margin-block-start: var(--space-l); text-align: center; }

}
.bg-contact-finder {
  display: grid;
gap: var(--space-m);
&[data-contact-ready="true"] { grid-template-columns: minmax(15rem, .8fr) minmax(0, 2.2fr); align-items: start; }
.bg-contact-finder__controls { min-inline-size: 0; }
.bg-contact-finder__controls > label { display: block; font-weight: 600; margin-block-end: var(--space-xs); color: var(--relative-heading-color); }
.bg-contact-finder__search { inline-size: 100%; padding: .9em 1em; border: 1px solid color-mix(in srgb, var(--relative-heading-color) 30%, transparent); border-radius: var(--radius); background: var(--body-bg-color); color: var(--body-color); font: inherit; }
.bg-contact-finder__count { font-size: var(--text-s); margin-block: var(--space-s); }
.bg-contact-finder__list { display: grid; gap: var(--space-xs); }
.bg-contact-finder__choice { inline-size: 100%; border: 1px solid color-mix(in srgb, var(--relative-heading-color) 16%, transparent); border-radius: var(--radius); padding: var(--space-m); text-align: start; font: inherit; cursor: pointer; }
.bg-contact-finder__choice { display: flex; align-items: center; justify-content: space-between; gap: var(--space-s); }
.bg-contact-finder__choice-copy { display: grid; gap: .25em; }
.bg-contact-finder__choice-copy > strong { color: var(--relative-heading-color); }
.bg-contact-finder__choice-copy > span { font-size: var(--text-s); }
.bg-contact-finder__arrow { font-size: var(--text-xl); color: var(--relative-heading-color); }
.bg-contact-finder__panels { display: grid; gap: var(--space-m); min-inline-size: 0; container-type: inline-size; }
.bg-contact-finder__empty { padding: var(--space-l); border-radius: var(--radius); }
& [hidden] { display: none; }
@container (inline-size < 60rem) {
  &[data-contact-ready="true"] { grid-template-columns: minmax(0, 1fr); }
  .bg-contact-finder__list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); max-block-size: 18rem; overflow-y: auto; padding: .25rem; }
}

}
.bg-contact-enquiry {
  scroll-margin-block-start: 8rem;
.bg-contact-enquiry__copy { display: grid; gap: var(--space-m); }
.bg-contact-enquiry__note { font-family: var(--font-handwritten); font-size: var(--text-xl); font-weight: 400; line-height: 1.25; color: var(--relative-heading-color); }
.bg-contact-enquiry__placeholder { display: grid; gap: var(--space-s); min-block-size: 24rem; align-content: center; justify-items: center; text-align: center; padding: var(--space-xl); border: 1px dashed color-mix(in srgb, var(--relative-heading-color) 25%, transparent); border-radius: var(--radius-l, var(--radius)); }
.bg-contact-enquiry__placeholder > p { max-inline-size: 38ch; }
.bg-contact-enquiry__label { font-weight: 600; color: var(--relative-heading-color); font-size: var(--h3); }
@container (inline-size < 32rem) { .bg-contact-enquiry__placeholder { padding: var(--space-m); min-block-size: 18rem; } }

}
.bg-contact-option {
  display: grid;
align-content: start;
gap: var(--space-s);
padding: var(--space-m);
border-radius: var(--radius);
min-inline-size: 0;
text-align: left;
& > h2 { font-size: var(--h4); }
& > p { font-size: var(--text-s); }
& > small { font-size: var(--text-s); white-space: pre-line; }
& > a { overflow-wrap: anywhere; }
& > a:not(.bg-button) { text-decoration: none; }
& > a:not(.bg-button):hover, & > a:not(.bg-button):focus-visible { text-decoration: underline; text-underline-offset: .2em; }
.bg-contact-option__contact { display: flex; align-items: center; gap: var(--space-xs); }
.bg-contact-option__contact > svg { inline-size: 1.3em; block-size: 1.3em; flex-shrink: 0; color: var(--relative-link-color); }

}
.bg-contact-actions {
  display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-s); margin-block-start: var(--space-m);
}
.bg-contact-options {
  /* Wrap from the space actually available, including inside the Studio canvas. */
grid-column: 1 / -1;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
gap: var(--space-m);
/* Keep four options balanced as two pairs before switching to one column. */
@container (inline-size < 75rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@container (inline-size < 42rem) { grid-template-columns: minmax(0, 1fr); }

}
.bg-privacy {
  container-type: inline-size;
  --bg-privacy-anchor-offset: 9rem;

  .bg-privacy__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-privacy__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-privacy__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-privacy__eyebrow,
  .bg-privacy__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-privacy__intro > p:last-child {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-privacy__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-privacy__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-privacy__toc {
    min-inline-size: 0;
    padding: var(--space-m);
  }

  .bg-privacy__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-privacy__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-privacy__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-privacy__toc-link[aria-current="location"],
  .bg-privacy__toc-link:hover,
  .bg-privacy__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-privacy__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-privacy__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-privacy-anchor-offset);
  }

  .bg-privacy__section + .bg-privacy__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-privacy__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  .bg-privacy__section > ul {
    padding-inline-start: 1.4em;
  }

  .bg-privacy__section > ul > li + li {
    margin-block-start: .2em;
  }

  .bg-privacy__section > ul > li::marker {
    color: var(--relative-link-color, var(--link-color));
  }

  .bg-privacy__notice {
    padding: var(--space-s);
    border-inline-start: 3px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-privacy__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-privacy__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-privacy__toc {
      position: sticky;
      inset-block-start: var(--bg-privacy-anchor-offset);
      max-block-size: calc(100svh - var(--bg-privacy-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
}
.bg-cookies {
  container-type: inline-size;
  --bg-cookies-anchor-offset: 9rem;

  .bg-cookies__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-cookies__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-cookies__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-cookies__eyebrow,
  .bg-cookies__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-cookies__intro > p:last-child {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-cookies__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-cookies__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-cookies__toc {
    min-inline-size: 0;
    padding: var(--space-m);
  }

  .bg-cookies__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-cookies__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-cookies__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-cookies__toc-link[aria-current="location"],
  .bg-cookies__toc-link:hover,
  .bg-cookies__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-cookies__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-cookies__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-cookies-anchor-offset);
  }

  .bg-cookies__section + .bg-cookies__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-cookies__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-cookies__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-cookies__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-cookies__toc {
      position: sticky;
      inset-block-start: var(--bg-cookies-anchor-offset);
      max-block-size: calc(100svh - var(--bg-cookies-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
}
.bg-terms {
  container-type: inline-size;
  --bg-terms-anchor-offset: 9rem;

  .bg-terms__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-terms__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-terms__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-terms__eyebrow,
  .bg-terms__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-terms__intro > p:last-child {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-terms__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-terms__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-terms__toc {
    min-inline-size: 0;
    padding: var(--space-m);
  }

  .bg-terms__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-terms__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-terms__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-terms__toc-link[aria-current="location"],
  .bg-terms__toc-link:hover,
  .bg-terms__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-terms__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-terms__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-terms-anchor-offset);
  }

  .bg-terms__section + .bg-terms__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-terms__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-terms__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-terms__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-terms__toc {
      position: sticky;
      inset-block-start: var(--bg-terms-anchor-offset);
      max-block-size: calc(100svh - var(--bg-terms-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
}
.bg-regulatory {
  container-type: inline-size;
  --bg-regulatory-anchor-offset: 9rem;

  .bg-regulatory__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-regulatory__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-regulatory__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-regulatory__eyebrow,
  .bg-regulatory__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-regulatory__intro > p:last-child {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-regulatory__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-regulatory__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-regulatory__toc {
    min-inline-size: 0;
    padding: 0;
  }

  .bg-regulatory__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-regulatory__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-regulatory__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-regulatory__toc-link[aria-current="location"],
  .bg-regulatory__toc-link:hover,
  .bg-regulatory__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-regulatory__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-regulatory__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-regulatory-anchor-offset);
  }

  .bg-regulatory__section + .bg-regulatory__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-regulatory__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-regulatory__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-regulatory__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-regulatory__toc {
      position: sticky;
      inset-block-start: var(--bg-regulatory-anchor-offset);
      max-block-size: calc(100svh - var(--bg-regulatory-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }

  .bg-regulatory__details { display: grid; gap: var(--space-xs); margin: 0; }
  .bg-regulatory__detail { display: grid; grid-template-columns: minmax(11rem, 1fr) minmax(0, 1.5fr); gap: var(--space-s); align-items: start; }
  .bg-regulatory__detail > dt { font-weight: 500; }
  .bg-regulatory__detail > dd { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
  .bg-regulatory__registration { display: grid; gap: var(--space-s); }
  .bg-regulatory__registration + .bg-regulatory__registration { padding-block-start: var(--space-m); border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent); }
  .bg-regulatory__multiline { white-space: pre-line; }
  .bg-regulatory__panel { padding: var(--space-m); border-radius: var(--radius-s); border-block-start: 0; }
  .bg-regulatory__section + .bg-regulatory__panel { padding-block-start: var(--space-m); border-block-start: 0; }
  .bg-regulatory__form-space { min-block-size: 12rem; }
  @container (inline-size < 42rem) {
    .bg-regulatory__detail { grid-template-columns: minmax(0, 1fr); gap: .25em; }
  }
  @container (inline-size >= 60rem) {
    .bg-regulatory__toc { border-inline-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent); padding-inline-end: var(--space-m); }
  }

}
.bg-legal-links {
  margin-block-start: var(--space-l);
  padding-block-start: var(--space-m);
  border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);

  .bg-legal-links__heading {
    margin: 0 0 var(--space-s);
    font-size: var(--text-m);
    line-height: 1.4;
  }

  .bg-legal-links__list {
    display: grid;
    gap: var(--space-xs);
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--text-s);
  }
}
.bg-complaints {
  container-type: inline-size;
  --bg-complaints-anchor-offset: 9rem;

  .bg-complaints__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-complaints__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-complaints__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-complaints__eyebrow,
  .bg-complaints__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-complaints__intro > p:last-child {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-complaints__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-complaints__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-complaints__toc {
    min-inline-size: 0;
    padding: var(--space-m);
  }

  .bg-complaints__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-complaints__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-complaints__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-complaints__toc-link[aria-current="location"],
  .bg-complaints__toc-link:hover,
  .bg-complaints__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-complaints__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-complaints__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-complaints-anchor-offset);
  }

  .bg-complaints__section + .bg-complaints__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-complaints__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  .bg-complaints__section > ul {
    padding-inline-start: 1.4em;
  }

  .bg-complaints__section > ul > li + li {
    margin-block-start: .2em;
  }

  .bg-complaints__section > ul > li::marker {
    color: var(--relative-link-color, var(--link-color));
  }

  .bg-complaints__notice {
    padding: var(--space-s);
    border-inline-start: 3px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-complaints__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-complaints__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-complaints__toc {
      position: sticky;
      inset-block-start: var(--bg-complaints-anchor-offset);
      max-block-size: calc(100svh - var(--bg-complaints-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
}
.bg-accessibility {
  container-type: inline-size;
  --bg-accessibility-anchor-offset: 9rem;

  .bg-accessibility__masthead {
    padding-block: var(--space-l) var(--space-m);
  }

  .bg-accessibility__masthead-inner {
    max-inline-size: var(--content-width);
    gap: var(--space-l);
  }

  .bg-accessibility__intro {
    display: grid;
    gap: var(--space-xs);
    padding-block-end: var(--space-m);
    border-block-end: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  .bg-accessibility__eyebrow,
  .bg-accessibility__toc-label {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .bg-accessibility__intro > p:not(.bg-accessibility__eyebrow) {
    max-inline-size: 76ch;
    font-size: var(--text-l);
  }

  .bg-accessibility__body {
    padding-block: var(--space-l) var(--section-space-m);
  }

  .bg-accessibility__layout {
    inline-size: 100%;
    max-inline-size: var(--content-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--space-l);
  }

  .bg-accessibility__toc {
    min-inline-size: 0;
    padding: var(--space-m);
  }

  .bg-accessibility__toc-label {
    margin-block-end: var(--space-s);
  }

  .bg-accessibility__toc-list {
    display: grid;
    gap: .2em;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .bg-accessibility__toc-link {
    display: block;
    padding: .45em .65em;
    border-inline-start: 3px solid transparent;
    color: var(--relative-text-color, var(--text-color));
    font-size: var(--text-s);
    line-height: 1.4;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .bg-accessibility__toc-link[aria-current="location"],
  .bg-accessibility__toc-link:hover,
  .bg-accessibility__toc-link:focus-visible {
    color: var(--relative-link-color, var(--link-color));
    border-inline-start-color: currentColor;
    text-decoration: underline;
    text-underline-offset: .2em;
  }

  .bg-accessibility__content {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    overflow-wrap: anywhere;
  }

  .bg-accessibility__section {
    display: grid;
    gap: var(--space-xs);
    min-inline-size: 0;
    scroll-margin-block-start: var(--bg-accessibility-anchor-offset);
  }

  .bg-accessibility__section + .bg-accessibility__section {
    padding-block-start: var(--space-m);
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 22%, transparent);
  }

  .bg-accessibility__heading {
    font-size: var(--h3);
    line-height: 1.2;
    text-wrap: balance;
  }

  .bg-accessibility__section > ul {
    padding-inline-start: 1.4em;
  }

  .bg-accessibility__section > ul > li + li {
    margin-block-start: .2em;
  }

  .bg-accessibility__section > ul > li::marker {
    color: var(--relative-link-color, var(--link-color));
  }

  .bg-accessibility__notice {
    padding: var(--space-s);
    border-inline-start: 3px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 35%, transparent);
  }

  @container (inline-size >= 36rem) and (inline-size < 60rem) {
    .bg-accessibility__toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @container (inline-size >= 60rem) {
    .bg-accessibility__layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 3fr); gap: var(--space-xl); }
    .bg-accessibility__toc {
      position: sticky;
      inset-block-start: var(--bg-accessibility-anchor-offset);
      max-block-size: calc(100svh - var(--bg-accessibility-anchor-offset) - var(--space-m));
      overflow-y: auto;
      overscroll-behavior: contain;
    }
  }
}
.bg-pricing-pilot {
  padding-block: var(--section-space-m);
  container-type: inline-size;

  .bg-pricing-pilot__inner {
    inline-size: min(100%, 72rem);
    margin-inline: auto;
    display: grid;
    gap: var(--space-l);
  }

  .bg-pricing-pilot__intro, .bg-pricing-pilot__form, .bg-pricing-pilot__results, .bg-pricing-pilot__summary {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
  }

  .bg-pricing-pilot__fields, .bg-pricing-pilot__packages {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--space-m);
  }

  .bg-pricing-pilot__fields > label, .bg-pricing-pilot__package-copy {
    display: grid;
    gap: var(--space-xs);
  }

  .bg-pricing-pilot__fields input:not([type="checkbox"]), .bg-pricing-pilot__fields select {
    inline-size: 100%;
    min-inline-size: 0;
    min-block-size: 3rem;
    padding: var(--space-xs) var(--space-s);
    border: 1px solid currentColor;
    border-radius: var(--radius);
    font: inherit;
  }

  .bg-pricing-pilot__package, .bg-pricing-pilot__summary {
    border: 1px solid currentColor;
    border-radius: var(--radius);
    padding: var(--space-m);
  }

  .bg-pricing-pilot__package {
    display: grid;
    align-content: start;
    gap: var(--space-m);
  }

  .bg-pricing-pilot__package-choice {
    display: flex;
    align-items: start;
    gap: var(--space-s);
    cursor: pointer;
  }

  .bg-pricing-pilot__inclusions {
    display: grid;
    gap: var(--space-xs);
    margin: 0;
    padding-inline-start: 1.2em;
    font-size: var(--text-s);
  }

  .bg-pricing-pilot__package:has(input:checked) {
    outline: 2px solid currentColor;
    outline-offset: 2px;
  }

  .bg-pricing-pilot__package input { margin-block-start: .35em; }
  .bg-pricing-pilot__fields > .bg-pricing-pilot__checkbox {
    display: flex;
    align-items: center;
    gap: var(--space-s);
    cursor: pointer;
  }
  .bg-pricing-pilot__checkbox input {
    flex: none;
    inline-size: 1.25em;
    block-size: 1.25em;
    margin: 0;
  }
  .bg-pricing-pilot__package input:focus-visible, .bg-pricing-pilot__fields :is(input, select):focus-visible {
    outline: 3px solid var(--focus-color);
    outline-offset: 3px;
  }

  .bg-pricing-pilot__breakdown {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-s) var(--space-m);
  }
  .bg-pricing-pilot__breakdown dd { margin: 0; text-align: end; font-variant-numeric: tabular-nums; }
  .bg-pricing-pilot__error { font-weight: 600; }
  .bg-pricing-pilot__inner [hidden] { display: none; }

  .bg-pricing-pilot__group {
    display: grid;
    gap: var(--space-m);
    min-inline-size: 0;
    margin: 0;
    padding: var(--space-m);
    border: 1px solid currentColor;
    border-radius: var(--radius);
  }
  .bg-pricing-pilot__group legend { padding-inline: var(--space-xs); font-weight: 700; font-size: var(--text-l); }
  .bg-pricing-pilot__payment-label { font-weight: 600; }
  .bg-pricing-pilot__totals, .bg-pricing-pilot__prior {
    border-block-start: 1px solid currentColor;
    padding-block-start: var(--space-m);
  }
  .bg-pricing-pilot__totals > :is(dt, dd):first-of-type { font-weight: 700; }
  .bg-pricing-pilot__prior { display: grid; gap: var(--space-m); }
  .bg-pricing-pilot__note { font-size: var(--text-s); }

  @container (max-width: 30rem) {
    .bg-pricing-pilot__breakdown { grid-template-columns: 1fr; gap: var(--space-xs); }
    .bg-pricing-pilot__breakdown dd { text-align: start; margin-block-end: var(--space-s); }
  }
}