.download-section {
      position: relative;
      isolation: isolate;
      background-color: #000;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      padding: clamp(48px, 6vw, 96px) var(--dl-pad-x)
    }

    .download-overlay {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, var(--dl-overlay), var(--dl-overlay));
      z-index: -1
    }

    .download-head .eyebrow {
      display: inline-block;
      letter-spacing: .06em;
      font-size: 12px;
      font-weight: 600;
      color: red;
      background: rgba(255, 255, 255, .08);
      border: 1px;
      padding: 6px 10px;
      border-radius: 999px
    }

        .counter-card,
    .download-inner,
    .fleet__head,
    .modal-body h3,
    .specs,
    a.badge {
      text-align: center
    }

    
    .badge a,
    .badge img {
      border-radius: var(--dl-radius)
    }

    
    .download-head .title {
      margin: 14px 0 8px;
      font-size: clamp(28px, 4.6vw, 44px);
      line-height: 1.15;
      color: #fff
    }

    .download-head .desc {
      max-width: 760px;
      margin: 10px auto 28px;
      color: #fff;
      font-size: clamp(14px, 1.8vw, 18px)
    }

   

    a.badge {
      display: inline-block;
      padding: 10px 14px;
      margin: 6px 8px;
      font-size: 14px;
      min-width: 48px;
      min-height: 48px
    }

    .badge img {
      width: min(160px, 50vw);
      height: auto;
      display: block
    }

    .badge:hover img {
      transform: translateY(-2px)
    }

    .badge a {
      border: 1px solid red;
      overflow: hidden
    }

    @media screen and (min-width:640px) {
      .badges {
        grid-template-columns: repeat(2, max-content);
        gap: 18px
      }
    }

    .download-inner {
      max-width: var(--dl-max);
      margin: 0 auto;
      backdrop-filter: saturate(120%) contrast(105%);
      border-radius: var(--dl-radius)
    }

    .fleet {
      padding: 48px 16px
    }

    .fleet__title {
      font-size: 3rem
    }

    .tabs {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px
    }

    .panel,
    .specs li {
      align-items: center
    }


    .tab.is-active,
    .tab[aria-selected=true] {
      background: #111;
      color: #fff;
      border-color: #111
    }

    .fleet__panels {
      padding: 16px
    }

    .panel {
      gap: 16px
    }

    .panel[hidden] {
      display: none !important
    }

    .specs {
      gap: 10px
    }

    .specs li {
      display: flex;
      gap: 10px
    }

    .specs__icon {
      display: inline-flex;
      align-items: center;
      justify-content: center
    }

    .counter-wrap {
      margin: 0;
      padding: clamp(40px, 6vw, 90px) 16px;
      background-color: #fff;
      color: #0b0b0b
    }

    .counter-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: clamp(14px, 2.4vw, 28px)
    }

    @media screen and (max-width:992px) {
      .counter-grid {
        grid-template-columns: repeat(2, 1fr)
      }

      .panel__media img {
        width: 240px
      }
    }


    .counter-card {
      display: grid;
      justify-items: center;
      gap: 10px;
      padding: clamp(18px, 3vw, 28px);
      background: #fff;
      border-radius: 18px;
      border: 1px solid #b6b6b6ff
    }

    .counter-icon {
      width: 70px;
      height: 70px;
      display: grid;
      place-items: center;
      border-radius: 16px;
      background: rgba(225, 25, 0, .1)
    }

    .counter-icon img {
      max-width: 70%;
      height: auto;
      display: block
    }

    .counter-number {
      font-size: clamp(30px, 5vw, 44px);
      font-weight: 600;
      letter-spacing: .3px;
      color: #000;
      line-height: 1.05
    }

    .counter-number::after {
      content: attr(data-suffix);
      margin-left: 2px;
      color: #e11900;
      font-weight: 600
    }

    .counter-title {
      margin: 0;
      font-size: 13px;
      letter-spacing: .12em;
      color: #6b7280
    }

    #r-about-info,
    .fleet {
      background: #fff;
      color: #111
    }

    #r-about-info {
      padding: 40px 16px
    }

    #r-about-info h2 {
      color: #000;
      margin-top: 30px;
      margin-bottom: 10px
    }

    #r-about-info h2:first-of-type {
      margin-top: 0
    }

    #r-about-info ul {
      margin-left: 20px
    }

    #r-about-info>div {
      max-width: 1200px;
      margin: 0 auto
    }

    .fleet {
      padding: clamp(32px, 5vw, 48px) 16px
    }

    .fleet__inner {
      max-width: 1100px;
      margin: 0 auto
    }

    .fleet__head {
      margin-bottom: 24px
    }

    .fleet__eyebrow {
      display: inline-block;
      font-size: 12px;
      letter-spacing: .06em;
      color: #666;
      margin-bottom: 8px
    }

    .fleet__title {
      font-size: clamp(28px, 4vw, 36px);
      color: #000;
      margin: 0 0 12px
    }

    .tabs {
      grid-template-columns: repeat(auto-fit, minmax(100px, max-content));
      gap: 12px;
      margin: 24px 0 32px
    }

    .tab {
      appearance: none;
      border: 1px solid #e5e7eb;
      background: #f9fafb;
      color: #111;
      padding: 10px 20px;
      border-radius: 999px;
      font-weight: 600;
      font-size: 16px;
      transition: background .2s, transform .1s
    }

    .tab:hover {
      background: #e5e7eb
    }

    .tab:focus {
      outline: 0;
      box-shadow: 0 0 0 3px rgba(0, 0, 0, .1)
    }

    .tab:active {
      transform: translateY(1px)
    }

    .fleet__panels {
      border: 1px solid #eee;
      border-radius: 16px;
      padding: clamp(16px, 2.5vw, 24px);
      background: #fafafa
    }

    .panel {
      gap: 24px
    }

    @media screen and (min-width:900px) {
      .panel {
        grid-template-columns: 2fr 1fr;
        gap: 32px
      }
    }

    .panel__media img {
      box-shadow: 0 10px 24px rgba(0, 0, 0, .08);
      width: 100%;
      max-width: 350px;
      height: auto;
      display: block;
      margin: 0 auto;
      border-radius: 14px
    }

    .panel__content h3 {
      margin: 0 0 12px;
      font-size: 24px;
      color: #000;
      text-align: center
    }

    .specs {
      list-style: none;
      padding: 0;
      margin: 0;
      gap: 12px
    }

    .specs li {
      display: flex;
      justify-content: center;
      gap: 8px;
      font-size: 16px;
      color: #333
    }

    .specs__icon {
      display: inline-flex;
      width: 24px;
      height: 24px;
      align-items: center;
      justify-content: center;
      color: #e11900
    }

    .specs__icon svg {
      fill: currentColor;
      width: 20px;
      height: 20px
    }