/* Block 02: mobile composition from the approved handoff. */
.business-chain picture { display: contents; }
.business-chain picture > source { display: none; }
@font-face { font-family: "IBM Plex Sans Mobile Chain"; src: url("../assets/mobile/block-02-business-chain/fonts/IBMPlexSans-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans Mobile Chain"; src: url("../assets/mobile/block-02-business-chain/fonts/IBMPlexSans-SemiBold.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "IBM Plex Sans Mobile Chain"; src: url("../assets/mobile/block-02-business-chain/fonts/IBMPlexSans-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@media (max-width: 767px) {
  .business-chain {
    --chain-unit: clamp(.923px, .2564102564vw, 1.4px);
    max-width: none; height: auto; padding: calc(26 * var(--chain-unit)) 5% calc(14 * var(--chain-unit));
    font-family: "IBM Plex Sans Mobile Chain", sans-serif;
    background-image: radial-gradient(ellipse at 40% 40%, #ffffff90, transparent 80%);
    background-size: 100% 100%; background-position: 0 0;
  }
  .business-chain__heading { position: static; margin-inline: calc(10 * var(--chain-unit)); }
  .business-chain__eyebrow { font-size: calc(12 * var(--chain-unit)); line-height: 1.3; letter-spacing: 0; font-weight: 400; }
  .business-chain__heading h2 { margin-top: calc(6 * var(--chain-unit)); font-size: calc(36 * var(--chain-unit)); line-height: .88; letter-spacing: calc(-1 * var(--chain-unit)); }
  .business-chain__intro { position: static; height: auto; margin: calc(10 * var(--chain-unit)) calc(10 * var(--chain-unit)) calc(14 * var(--chain-unit)); padding: 0; border: 0; white-space: normal; font-size: calc(14 * var(--chain-unit)); line-height: 1.2; letter-spacing: calc(-.3 * var(--chain-unit)); }
  .business-chain__intro br { display: none; }
  .business-chain__cards { position: static; grid-template-columns: minmax(0, 1fr); gap: calc(15 * var(--chain-unit)); }
  .business-chain__card { height: auto; min-height: calc(98 * var(--chain-unit)); padding: calc(9 * var(--chain-unit)) calc(12 * var(--chain-unit)) calc(8 * var(--chain-unit)); border-radius: calc(7 * var(--chain-unit)); display: grid; grid-template-columns: calc(44 * var(--chain-unit)) minmax(0,1fr) calc(31 * var(--chain-unit)); grid-template-rows: auto auto auto; }
  .business-chain__number { position: static; grid-column: 1; grid-row: 1 / 3; align-self: start; margin-top: calc(2 * var(--chain-unit)); border-right: 1px solid #9aafc3; font-size: calc(25 * var(--chain-unit)); line-height: 1; font-weight: 700; }
  .business-chain__card h3 { position: static; grid-column: 2; grid-row: 1; padding-left: calc(13 * var(--chain-unit)); font-size: calc(17 * var(--chain-unit)); line-height: 1.12; letter-spacing: calc(-.4 * var(--chain-unit)); }
  .business-chain__card > p { position: static; grid-column: 2; grid-row: 2; padding-left: calc(13 * var(--chain-unit)); font-size: calc(12 * var(--chain-unit)); line-height: 1.15; letter-spacing: calc(-.2 * var(--chain-unit)); white-space: normal; color: #667b94; }
  .business-chain__card > p br { display: none; }
  .business-chain__card--dark > p { color: #c5dce9; }
  .business-chain__card--orange > p { color: #fff; }
  .business-chain__card--orange .business-chain__number { border-color: #ffffff70; }
  .business-chain__card-icon { position: static; grid-column: 3; grid-row: 1 / 3; align-self: start; width: calc(29 * var(--chain-unit)); height: calc(29 * var(--chain-unit)); }
  .business-chain__tools { position: static; grid-column: 1 / -1; grid-row: 3; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(6 * var(--chain-unit)); margin-top: calc(9 * var(--chain-unit)); }
  .business-chain__tool { height: calc(43 * var(--chain-unit)); gap: calc(2 * var(--chain-unit)); border-radius: calc(6 * var(--chain-unit)); }
  .business-chain__tools img { width: calc(22 * var(--chain-unit)); height: calc(22 * var(--chain-unit)); }
  .business-chain__tools span { font-size: calc(11 * var(--chain-unit)); line-height: 1.1; letter-spacing: calc(-.2 * var(--chain-unit)); }
  .business-chain__card:not(:last-child)::after { right: calc(50% - 1px); top: auto; bottom: calc(-12 * var(--chain-unit)); width: 2px; height: calc(13 * var(--chain-unit)); border-radius: 2px; }
  .business-chain__card:not(:last-child)::before { right: calc(50% - 4 * var(--chain-unit)); top: auto; bottom: calc(-12 * var(--chain-unit)); width: calc(8 * var(--chain-unit)); height: calc(8 * var(--chain-unit)); border-width: 2px; transform: rotate(135deg); }
  .business-chain__card--orange .business-chain__tools img { display: none; }
  .business-chain__card--orange .business-chain__tool::before { content: ""; width: calc(22 * var(--chain-unit)); height: calc(22 * var(--chain-unit)); background: #ff6500; mask: var(--tool-icon) center / contain no-repeat; }
  .business-chain__card--orange .business-chain__tools li:nth-child(1) .business-chain__tool { --tool-icon: url("../assets/mobile/block-02-business-chain/svg/icon-direct.svg"); }
  .business-chain__card--orange .business-chain__tools li:nth-child(2) .business-chain__tool { --tool-icon: url("../assets/mobile/block-02-business-chain/svg/icon-seo.svg"); }
  .business-chain__card--orange .business-chain__tools li:nth-child(3) .business-chain__tool { --tool-icon: url("../assets/mobile/block-02-business-chain/svg/icon-target.svg"); }
  .business-chain__connections, .business-chain__automation > ul { display: none; }
  .business-chain__automation { position: relative; left: auto; top: auto; width: auto; height: auto; margin-top: calc(8 * var(--chain-unit)); padding: calc(8 * var(--chain-unit)) calc(24 * var(--chain-unit)) calc(8 * var(--chain-unit)) calc(75 * var(--chain-unit)); min-height: calc(62 * var(--chain-unit)); border-radius: calc(7 * var(--chain-unit)); }
  .business-chain__chip { left: calc(10 * var(--chain-unit)); top: calc(8 * var(--chain-unit)); width: calc(45 * var(--chain-unit)); height: calc(44 * var(--chain-unit)); border-radius: calc(11 * var(--chain-unit)); }
  .business-chain__chip img { width: calc(31 * var(--chain-unit)); height: calc(31 * var(--chain-unit)); }
  .business-chain__automation h3 { position: static; display: block; width: auto; height: auto; padding: 0; border: 0; font-size: calc(14 * var(--chain-unit)); line-height: 1.2; letter-spacing: calc(-.2 * var(--chain-unit)); white-space: normal; }
  .business-chain__automation > p { position: static; display: block; height: auto; margin-top: calc(3 * var(--chain-unit)); padding: 0; border: 0; font-size: calc(10 * var(--chain-unit)); line-height: 1.22; color: #c5dce9; white-space: normal; }
  .business-chain__automation > p br { display: none; }
  .business-chain__automation::before { content: ""; position: absolute; left: calc(65 * var(--chain-unit)); top: calc(10 * var(--chain-unit)); bottom: calc(10 * var(--chain-unit)); border-left: 1px solid #7b92a3; }
  .business-chain__automation::after { content: ""; position: absolute; right: calc(15 * var(--chain-unit)); top: calc(50% - 4 * var(--chain-unit)); width: calc(8 * var(--chain-unit)); height: calc(8 * var(--chain-unit)); border-top: 2px solid white; border-right: 2px solid white; transform: rotate(45deg); }
  .business-chain__footer { position: static; margin-top: calc(8 * var(--chain-unit)); gap: 8px; }
  .business-chain__footer img { width: calc(61 * var(--chain-unit)); }
  .business-chain__footer p { font-size: calc(8 * var(--chain-unit)); line-height: 1.2; letter-spacing: calc(-.15 * var(--chain-unit)); }
}
@media (max-width: 767px) {
  .business-chain__intro br, .business-chain__card--dark > p br { display: initial; }
}
