/* Complete the mobile SERVICE styles independently of the desktop-only base. */
@media (max-width: 760px) {
  body main .service-section .service-tab::before {
    display: none !important;
  }

  body main .service-section .service-tab.is-active::after {
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
  }

  body main .service-section {
    --service-card-height: clamp(330px, 86vw, 400px);
  }

  body main section.service-section {
    padding-top: 34px !important;
  }

  body main section.service-section .section-heading {
    margin-bottom: 16px !important;
  }

  body main section.service-section .section-heading .section-eyebrow {
    margin-bottom: 8px !important;
    line-height: 1.5 !important;
  }

  body main section.service-section .section-heading h2,
  body main section.service-section .section-heading h2 .line {
    font-size: clamp(22px, 6.67vw, 26px) !important;
    line-height: 1.3 !important;
  }

  body main section.service-section .section-heading > p:not(.section-eyebrow) {
    margin-top: 10px !important;
    font-size: 12px !important;
    line-height: 1.65 !important;
  }

  body main section.service-section .service-tab,
  body main section.service-section .service-tab.is-active {
    display: flex !important;
    flex: initial !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 8px 1px !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
  }

  body main section.service-section .service-tab .service-tab-num,
  body main section.service-section .service-tab.is-active .service-tab-num {
    flex: 0 0 clamp(24px, 6.7vw, 28px) !important;
    width: clamp(24px, 6.7vw, 28px) !important;
    height: clamp(24px, 6.7vw, 28px) !important;
    grid-area: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
  }

  body main section.service-section .service-tab h3 {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    width: auto !important;
    grid-area: auto !important;
    margin: 0 !important;
    font-size: clamp(12px, 3.6vw, 14px) !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
  }

  body main section.service-section .service-tab:nth-child(3) {
    gap: 2px !important;
  }

  body main section.service-section .service-tab:nth-child(3) .service-tab-num {
    flex-basis: clamp(20px, 6vw, 26px) !important;
    width: clamp(20px, 6vw, 26px) !important;
    height: clamp(20px, 6vw, 26px) !important;
  }

  body main section.service-section .service-tab:nth-child(3) h3 {
    font-size: clamp(10.5px, 2.82vw, 11px) !important;
  }

  body main .service-section .section-heading h2,
  body main .service-section .section-heading h2 .line,
  body main .service-section .section-heading h2 .line > span {
    color: #0862d5 !important;
    background: none !important;
    -webkit-text-fill-color: #0862d5 !important;
  }

  body main .service-section .service-tab-num {
    color: #0862d5 !important;
  }

  body main .service-section .service-tab:nth-child(2).is-active .service-tab-num {
    color: #e95061 !important;
  }

  body main .service-section .service-tabs:has(.service-tab:nth-child(3).is-active) .service-tab-num {
    color: #bc7900 !important;
  }

  body main .service-section .service-compare-panel {
    min-height: calc(var(--service-card-height) + 48px) !important;
    height: calc(var(--service-card-height) + 48px) !important;
    --service-icon-bulb: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6m-5 3h4M8 14a6 6 0 1 1 8 0c-1 1-1 2-1 3H9c0-1 0-2-1-3ZM12 1v2M3 5l2 2M1 11h2M21 11h2M19 7l2-2'/%3E%3C/svg%3E");
    --service-icon-bars: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 14h4v8H3zm7-6h4v14h-4zm7-6h4v20h-4z'/%3E%3C/svg%3E");
    --service-icon-people: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='8' cy='7' r='3'/%3E%3Ccircle cx='17' cy='7' r='3'/%3E%3Cpath d='M1 21v-2a7 7 0 0 1 14 0v2m1-8a6 6 0 0 1 7 6v2'/%3E%3C/svg%3E");
    --service-icon-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a9 9 0 1 1-7-8M16 12a5 5 0 1 1-5-5m1 5 9-9m-4 0h4v4'/%3E%3C/svg%3E");
    --service-icon-pie: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M10 3a9 9 0 1 0 11 11H10Zm4-2v9h9a9 9 0 0 0-9-9Z'/%3E%3C/svg%3E");
    --service-icon-route: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='1' width='8' height='6' rx='1'/%3E%3Crect x='1' y='17' width='7' height='6' rx='1'/%3E%3Crect x='16' y='17' width='7' height='6' rx='1'/%3E%3Cpath d='M12 7v5H4v5m8-5h8v5'/%3E%3C/svg%3E");
    --service-icon-checklist: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4H4v18h16V4h-4M8 2h8v5H8Zm0 13 3 3 5-6'/%3E%3C/svg%3E");
    --service-icon-growth: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 13 9 6l5 4 8-8m-6 0h6v6M3 18h4v5H3zm7-5h4v10h-4zm7-3h4v13h-4z'/%3E%3C/svg%3E");
    --service-icon-handshake: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m1 10 5-6 4 2 4-1 9 7-5 7-3 2-8-5-2 1Zm7-3 4 1-3 4c1 2 3 1 5-1l5 4M6 16l3 3m1-3 3 4m0-6 4 4'/%3E%3C/svg%3E");
    --service-icon-pencil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3H3v19h18V12M9 16l1-5L20 1l4 4-10 10Zm9-13 4 4'/%3E%3C/svg%3E");
    --service-icon-tools: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 4-4 16 16-4 4ZM2 18 18 2l4 4L6 22Zm5-13L5 7m5 1-2 2m8 4-2 2m5 1-2 2'/%3E%3C/svg%3E");
    --service-icon-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M9 5h13M9 12h13M9 19h13M2 5h1M2 12h1M2 19h1'/%3E%3C/svg%3E");
    --service-icon-sort: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22V2L1 7m5-5 5 5m7-5v20l-5-5m5 5 5-5'/%3E%3C/svg%3E");
    --service-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='17' rx='2'/%3E%3Cpath d='M7 2v6m10-6v6M2 11h20'/%3E%3C/svg%3E");
    --service-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='8'/%3E%3Cpath d='m16 16 7 7'/%3E%3C/svg%3E");
    --service-icon-flag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 23V2l17 1-4 5 4 5H4'/%3E%3C/svg%3E");
  }

  body main .service-section .service-compare-grid {
    min-height: var(--service-card-height) !important;
    height: var(--service-card-height) !important;
  }

  body main .service-section .service-compare-card {
    min-width: 0 !important;
    min-height: var(--service-card-height) !important;
    height: var(--service-card-height) !important;
    padding: 12px 14px !important;
    grid-template-rows: 36px 44px 60px 34px minmax(0, 1fr) !important;
    align-content: stretch !important;
  }

  body main .service-section .service-compare-header {
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  body main .service-section .service-compare-num {
    color: var(--service-deep) !important;
  }

  body main .service-section .service-compare-card h4 {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: clamp(15px, 4.5vw, 22px) !important;
    letter-spacing: 0.015em !important;
  }

  body main .service-section .service-compare-card h4 span {
    color: var(--service-accent) !important;
    -webkit-text-fill-color: currentColor !important;
  }

  body main .service-section .service-compare-desc {
    align-self: center !important;
    padding: 0 !important;
    font-size: clamp(10px, 2.7vw, 12px) !important;
    font-weight: 600 !important;
    line-height: 1.75 !important;
    text-wrap: balance;
  }

  body main .service-section .service-compare-tags {
    align-self: center !important;
    min-width: 0 !important;
    grid-template-rows: 30px !important;
    height: 30px !important;
    gap: 4px !important;
  }

  body main .service-section .service-compare-tags li {
    min-width: 0 !important;
    min-height: 30px !important;
    padding: 3px 2px !important;
    gap: 3px !important;
    color: var(--service-deep) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    background: color-mix(in srgb, var(--service-accent) 3%, white) !important;
    border: 1px solid color-mix(in srgb, var(--service-accent) 35%, white) !important;
    border-radius: 999px !important;
    box-shadow: 0 3px 7px color-mix(in srgb, var(--service-accent) 8%, transparent);
  }

  body main .service-section .service-compare-tags li::before {
    position: static !important;
    display: block !important;
    flex: 0 0 12px !important;
    width: 12px !important;
    height: 12px !important;
    content: "" !important;
    background: currentColor !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    mask: var(--service-tag-icon, var(--service-icon-target)) center / contain no-repeat;
  }

  body main .service-section .service-compare-card:nth-child(1) li:nth-child(1) { --service-tag-icon: var(--service-icon-bulb); }
  body main .service-section .service-compare-card:nth-child(1) li:nth-child(2) { --service-tag-icon: var(--service-icon-bars); }
  body main .service-section .service-compare-card:nth-child(1) li:nth-child(3) { --service-tag-icon: var(--service-icon-people); }
  body main .service-section .service-compare-card:nth-child(2) li:nth-child(1) { --service-tag-icon: var(--service-icon-pie); }
  body main .service-section .service-compare-card:nth-child(2) li:nth-child(2) { --service-tag-icon: var(--service-icon-target); }
  body main .service-section .service-compare-card:nth-child(2) li:nth-child(3) { --service-tag-icon: var(--service-icon-route); }
  body main .service-section .service-compare-card:nth-child(3) li:nth-child(1) { --service-tag-icon: var(--service-icon-checklist); }
  body main .service-section .service-compare-card:nth-child(3) li:nth-child(2) { --service-tag-icon: var(--service-icon-growth); }
  body main .service-section .service-compare-card:nth-child(3) li:nth-child(3) { --service-tag-icon: var(--service-icon-handshake); }
  body main .service-section [data-service-tone="coral"] .service-compare-card:nth-child(2) li:nth-child(1) { --service-tag-icon: var(--service-icon-target); }
  body main .service-section [data-service-tone="coral"] .service-compare-card:nth-child(2) li:nth-child(2) { --service-tag-icon: var(--service-icon-pencil); }
  body main .service-section [data-service-tone="coral"] .service-compare-card:nth-child(3) li:nth-child(1) { --service-tag-icon: var(--service-icon-bulb); }
  body main .service-section [data-service-tone="coral"] .service-compare-card:nth-child(3) li:nth-child(2) { --service-tag-icon: var(--service-icon-tools); }
  body main .service-section [data-service-tone="coral"] .service-compare-card:nth-child(3) li:nth-child(3) { --service-tag-icon: var(--service-icon-growth); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(2) li:nth-child(1) { --service-tag-icon: var(--service-icon-list); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(2) li:nth-child(2) { --service-tag-icon: var(--service-icon-sort); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(2) li:nth-child(3) { --service-tag-icon: var(--service-icon-calendar); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(3) li:nth-child(1) { --service-tag-icon: var(--service-icon-search); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(3) li:nth-child(2) { --service-tag-icon: var(--service-icon-bulb); }
  body main .service-section [data-service-tone="gold"] .service-compare-card:nth-child(3) li:nth-child(3) { --service-tag-icon: var(--service-icon-flag); }

  body main .service-section .service-compare-visual {
    position: relative !important;
    align-self: stretch !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 4px 0 0 !important;
    overflow: hidden !important;
    place-items: center !important;
  }

  body main .service-section .service-compare-visual img {
    display: block !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 290px !important;
    max-height: 100% !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }

  body main .service-section .service-card-arrow {
    top: calc(var(--service-card-height) / 2 - 12px) !important;
  }

  body main .service-section .service-card-arrow:disabled {
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body main .service-section .service-number-text {
    display: inline-block;
  }

  body main .service-section .service-number-text.is-animating {
    animation: service-number-pop 0.48s cubic-bezier(0.2, 0.8, 0.25, 1);
  }
}

@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  body main .service-section .service-compare-panel,
  body main .service-section .service-compare-card {
    transition: none !important;
  }

  body main .service-section .service-number-text.is-animating {
    animation: none;
  }
}
