/* URROBOT comparison section — scoped to .urr-cmp only */

    
    
    

    .urr-cmp {
      --navy: #00082f;
      --white: #ffffff;
      --orange: #ff5d04;
      --orange-2: #ff8847;
      --orange-deep: #ff5a00;
      --card-body: #2a3148;
      --radius: 20px;
      --shadow: 0 18px 50px -18px rgba(0, 0, 0, 0.5);
    }

    

    

    .urr-cmp {
      position: relative;
      overflow: hidden;
      background-color: #00082f;
      /* background comes from .comparison-automated in main.css */
      background-repeat: no-repeat;
      background-position: right bottom;
      background-size: cover;
      padding: 100px 0 200px;
    }

    .urr-cmp-title {
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: 0.025em;
      text-align: left;
      color: #fff;
      --container-max: 1920;
      --font-main: 25px;
      --font-xl: 15;
      --margin-bottom: 30px;
      --margin-full: 30;
      font-size: calc(var(--font-main) + var(--font-xl) * (100vw - 320px) / (var(--container-max) - 320));
      margin: 0 0 calc(var(--margin-bottom) + var(--margin-full) * (100vw - 320px) / (var(--container-max) - 320));
    }

    .urr-cmp-block { margin-bottom: 72px; }
    .urr-cmp-block:last-child { margin-bottom: 0; }

    .urr-cmp-block-title {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 30px;
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: 0.025em;
      margin-bottom: 28px;
    }
    .urr-cmp-block-title .urr-cmp-ico-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 40px;
      width: 40px;
      height: 40px;
      margin: 0;
      padding: 0;
      line-height: 0;
      box-sizing: border-box;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.06);
      border: 1.5px solid rgba(255, 136, 71, 0.7);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }
    .urr-cmp-block-title .urr-cmp-ico-wrap svg {
      width: 22px;
      height: 22px;
      display: block;
      margin: 0;
      color: #FF8847;
    }

    .urr-cmp-pair {
      display: grid;
      grid-template-columns: 1fr 85px 1fr;
      gap: 0;
      align-items: stretch;
    }

    .urr-cmp-col { display: flex; flex-direction: column; min-width: 0; }

    .urr-cmp-col-label,
    .urr-cmp-vs-space {
      min-height: 38px;
      margin-bottom: 40px;
    }

    .urr-cmp-col-label {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-size: 30px;
      font-weight: 700;
      text-align: center;
      letter-spacing: 0.025em;
      line-height: 1.25;
    }
    .urr-cmp-col-label svg {
      width: 22px;
      height: 22px;
      display: block;
      margin: 0;
      flex: none;
      color: #FF5D04;
    }
    .urr-cmp-col--yr .urr-cmp-col-label { color: var(--orange-2); }

    .urr-cmp-vs {
      display: flex;
      flex-direction: column;
      min-width: 0;
    }
    .urr-cmp-vs-rail {
      flex: 1;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .urr-cmp-vs-rail::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 10px;
      transform: translateX(-50%);
      background: rgba(255, 93, 4, 0.35);
      filter: blur(7px);
      border-radius: 8px;
      pointer-events: none;
    }
    .urr-cmp-vs-rail::after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 2px;
      transform: translateX(-50%);
      background: linear-gradient(180deg,
        rgba(255,136,71,0) 0%,
        rgba(255,136,71,0.7) 12%,
        rgba(255,93,4,0.95) 50%,
        rgba(255,136,71,0.7) 88%,
        rgba(255,136,71,0) 100%);
      pointer-events: none;
    }
    .urr-cmp-vs-badge {
      position: relative;
      z-index: 1;
      width: 64px;
      height: 64px;
      border-radius: 50%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.08em;
      color: #fff;
      background: linear-gradient(180deg, #1a2150 0%, #00082f 100%);
      box-shadow:
        0 0 0 2px #ff8847,
        0 0 24px rgba(255, 93, 4, 0.55),
        0 8px 20px rgba(0, 0, 0, 0.35);
    }
    .urr-cmp-vs-badge svg {
      width: 16px;
      height: 16px;
      color: var(--orange-2);
      margin-bottom: 0;
      display: block;
    }

    .urr-cmp-card {
      flex: 1;
      display: flex;
      flex-direction: column;
      background: #fff;
      color: var(--navy);
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: var(--shadow);
    }

    .urr-cmp-col--yr .urr-cmp-card {
      border: 2px solid var(--orange-2);
      box-shadow:
        0 18px 50px -18px rgba(0, 0, 0, 0.5),
        0 0 0 4px rgba(255, 136, 71, 0.16),
        0 16px 40px -10px rgba(255, 90, 0, 0.5);
    }

    .urr-cmp-card-head {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 20px 26px;
      min-height: 104px;
      background: #f4f6fb;
      border-bottom: 1px solid rgba(0, 8, 47, 0.06);
    }
    .urr-cmp-col--yr .urr-cmp-card-head {
      background: linear-gradient(180deg, #ff8847 0%, #ff5a00 100%);
      border-bottom: 0;
    }

    .urr-cmp-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 56px;
      width: 56px;
      height: 56px;
      margin: 0;
      padding: 0;
      line-height: 0;
      box-sizing: border-box;
      border-radius: 16px;
      background: #fff;
      box-shadow: 0 6px 18px rgba(0, 8, 47, 0.16);
    }
    .urr-cmp-icon svg { width: 30px; height: 30px; display: block; margin: 0; flex: none; overflow: hidden; }

    .urr-cmp-card-head h3 {
      margin: 0;
      padding: 0;
      font-size: 22px;
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: 0.01em;
      color: var(--navy);
    }
    .urr-cmp-col--yr .urr-cmp-card-head h3 { color: #fff; }

    .urr-cmp-card-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      padding: 22px 26px 24px;
    }

    .urr-cmp-card-body p {
      font-size: 16px;
      font-weight: 400;
      line-height: 1.55;
      color: var(--card-body);
    }

    .urr-cmp-metrics {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: auto;
      padding-top: 18px;
    }

    .urr-cmp-metric {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      gap: 10px;
      min-height: 68px;
      padding: 10px 14px;
      border-radius: 14px;
      background: #f4f6fb;
      flex: 1 1 0;
      min-width: 0;
    }
    .urr-cmp-metric-ico {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 36px;
      width: 36px;
      height: 36px;
      min-width: 36px;
      min-height: 36px;
      margin: 0;
      padding: 0;
      line-height: 0;
      box-sizing: border-box;
      border-radius: 50%;
      background: linear-gradient(180deg, #FF8847 0%, #FF5A00 100%);
      color: #fff;
      box-shadow: 0 3px 8px rgba(255, 93, 4, 0.35);
    }
    .urr-cmp-metric-ico svg {
      width: 20px;
      height: 20px;
      display: block;
      margin: 0;
      flex: none;
      overflow: hidden;
    }
    .urr-cmp-metric-txt { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
    .urr-cmp-metric b {
      display: block;
      font-size: 18px;
      font-weight: 700;
      color: var(--orange);
      line-height: 1.15;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }
    .urr-cmp-metric-txt span {
      display: block;
      font-size: 11px;
      font-weight: 500;
      color: #5a6178;
      line-height: 1.3;
      margin-top: 2px;
    }

    .urr-cmp-col--yr .urr-cmp-metric {
      background: #fff5ee;
      width: 100%;
      flex: 1 1 100%;
      min-height: 76px;
      padding: 14px 18px;
    }
    .urr-cmp-col--yr .urr-cmp-metric b {
      color: var(--orange-deep);
      font-size: 22px;
    }

    @media (max-width: 900px) {
      .urr-cmp { padding: 50px 0; }
      .urr-cmp-block { margin-bottom: 44px; }
      .urr-cmp-block-title { font-size: 20px; margin-bottom: 18px; }
      .urr-cmp-block-title .urr-cmp-ico-wrap { flex-basis: 34px; width: 34px; height: 34px; border-radius: 10px; }
      .urr-cmp-block-title .urr-cmp-ico-wrap svg { width: 18px; height: 18px; }
      .urr-cmp-col-label svg { width: 18px; height: 18px; }
      .urr-cmp-pair { grid-template-columns: 1fr; gap: 8px; }
      .urr-cmp-col-label { font-size: 20px; margin-bottom: 20px; min-height: 0; }
      .urr-cmp-vs-space { display: none; }
      .urr-cmp-vs {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 2px 0 6px;
      }
      .urr-cmp-vs-rail {
        flex: 0 0 auto;
        width: 100%;
        height: 72px;
      }
      .urr-cmp-vs-rail::before {
        width: 42%;
        height: 8px;
        top: 50%;
        left: 50%;
        bottom: auto;
        transform: translate(-50%, -50%);
        filter: blur(6px);
      }
      .urr-cmp-vs-rail::after {
        width: 42%;
        height: 2px;
        top: 50%;
        left: 50%;
        bottom: auto;
        transform: translate(-50%, -50%);
        background: linear-gradient(90deg,
          rgba(255,136,71,0) 0%,
          rgba(255,136,71,0.75) 20%,
          rgba(255,93,4,0.95) 50%,
          rgba(255,136,71,0.75) 80%,
          rgba(255,136,71,0) 100%);
      }
      .urr-cmp-card-head { padding: 16px 16px; gap: 12px; min-height: 88px; }
      .urr-cmp-icon { flex-basis: 56px; width: 56px; height: 56px; border-radius: 16px; }
      .urr-cmp-icon svg { width: 30px; height: 30px; }
      .urr-cmp-metric-ico { flex: 0 0 32px; width: 32px; height: 32px; }
      .urr-cmp-metric-ico svg { width: 18px; height: 18px; }
      .urr-cmp-card-head h3 { font-size: 18px; }
      .urr-cmp-card-body { padding: 16px 16px 18px; }
      .urr-cmp-card-body p { font-size: 15px; }
      .urr-cmp-metrics { padding-top: 14px; }
      .urr-cmp-metric { flex: 1 1 100%; width: 100%; min-height: 58px; padding: 8px 12px; }
      .urr-cmp-metric b { font-size: 16px; }
      .urr-cmp-col--yr .urr-cmp-metric { min-height: 64px; padding: 12px 14px; }
      .urr-cmp-col--yr .urr-cmp-metric b { font-size: 18px; }
    }
  
/* Isolated icon centering: flex only, no negative margin, no transform on icons */
.urr-cmp .urr-cmp-ico-wrap,
.urr-cmp .urr-cmp-icon,
.urr-cmp .urr-cmp-metric-ico,
.urr-cmp .urr-cmp-vs-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  line-height: 0;
  box-sizing: border-box;
  position: relative;
  transform: none;
}
.urr-cmp .urr-cmp-ico-wrap svg,
.urr-cmp .urr-cmp-icon svg,
.urr-cmp .urr-cmp-metric-ico svg,
.urr-cmp .urr-cmp-vs-badge svg,
.urr-cmp .urr-cmp-col-label svg {
  display: block;
  margin: 0;
  padding: 0;
  flex: none;
  transform: none;
  position: static;
  max-width: none;
  vertical-align: top;
}
.urr-cmp .urr-cmp-vs-badge {
  flex-direction: column;
  gap: 1px;
  line-height: 1;
}
.urr-cmp .urr-cmp-vs-badge svg {
  margin-bottom: 0;
}

.urr-cmp h2.urr-cmp-title,
.urr-cmp h3.urr-cmp-block-title,
.urr-cmp .urr-cmp-card-head h3,
.urr-cmp .urr-cmp-card-head h4 {
  font-family: inherit;
}
/* Beat theme h3 { margin-bottom: 60px / fluid calc } so the title
   sits on one row with the icon, align-items:center, equal head padding. */
.urr-cmp .urr-cmp-card-head h3,
.urr-cmp .urr-cmp-card-head h4 {
  margin: 0;
  padding: 0;
  min-width: 0;
  flex: 1 1 auto;
}
.urr-cmp h3.urr-cmp-block-title {
  /* beat theme h3 margins/size */
  font-size: 30px;
  margin: 0 0 28px;
}
@media (max-width: 900px) {
  .urr-cmp h3.urr-cmp-block-title { font-size: 20px; margin: 0 0 18px; }
}