{"product_id":"toppal-global-radio-for-android-head-units","title":"Toppal Global Radio for Android Head Units","description":"\u003c!--\n  Toppal Global Radio — Shopify product-page content\n  Usage:\n  1. Paste the contents into a Shopify Custom Liquid block.\n  2. Replace the two blank image variables below with Shopify CDN image URLs.\n  3. If the direct APK URL changes, replace https:\/\/toppal.ai\/radio in two places.\n  4. Product price and variant selection remain in Shopify's native product form.\n--\u003e\n\n{% assign radio_hero_image = '' %}\n{% assign radio_feature_image = '' %}\n\n\u003csection class=\"tr-page\" aria-label=\"Toppal Global Radio product information\"\u003e\n  \u003cstyle\u003e\n    .tr-page,\n    .tr-page * {\n      box-sizing: border-box;\n    }\n\n    .tr-page {\n      --tr-ink: #17221d;\n      --tr-muted: #5f6c65;\n      --tr-green: #235b42;\n      --tr-green-dark: #153b2b;\n      --tr-mint: #eaf5ee;\n      --tr-lime: #d9f07a;\n      --tr-sand: #f7f4ed;\n      --tr-line: #dfe6e1;\n      --tr-white: #ffffff;\n      color: var(--tr-ink);\n      font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n      font-size: 16px;\n      line-height: 1.55;\n      margin: 0 auto;\n      max-width: 1180px;\n      overflow: hidden;\n    }\n\n    .tr-page a {\n      color: inherit;\n    }\n\n    .tr-shell {\n      margin: 0 auto;\n      max-width: 1120px;\n      padding-left: 24px;\n      padding-right: 24px;\n    }\n\n    .tr-section {\n      padding: 70px 0;\n    }\n\n    .tr-section + .tr-section {\n      border-top: 1px solid var(--tr-line);\n    }\n\n    .tr-eyebrow {\n      align-items: center;\n      color: var(--tr-green);\n      display: inline-flex;\n      font-size: 12px;\n      font-weight: 800;\n      gap: 8px;\n      letter-spacing: .12em;\n      margin: 0 0 14px;\n      text-transform: uppercase;\n    }\n\n    .tr-eyebrow::before {\n      background: var(--tr-lime);\n      border-radius: 999px;\n      content: \"\";\n      height: 9px;\n      width: 9px;\n    }\n\n    .tr-page h1,\n    .tr-page h2,\n    .tr-page h3,\n    .tr-page p {\n      margin-top: 0;\n    }\n\n    .tr-page h1 {\n      font-size: clamp(38px, 6vw, 68px);\n      letter-spacing: -.045em;\n      line-height: .98;\n      margin-bottom: 22px;\n      max-width: 760px;\n    }\n\n    .tr-page h2 {\n      font-size: clamp(29px, 4vw, 44px);\n      letter-spacing: -.035em;\n      line-height: 1.08;\n      margin-bottom: 14px;\n    }\n\n    .tr-page h3 {\n      font-size: 20px;\n      letter-spacing: -.015em;\n      line-height: 1.22;\n      margin-bottom: 8px;\n    }\n\n    .tr-lead,\n    .tr-section-intro {\n      color: var(--tr-muted);\n      font-size: 18px;\n      max-width: 720px;\n    }\n\n    .tr-section-head {\n      margin-bottom: 34px;\n    }\n\n    .tr-button-row {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 12px;\n      margin-top: 28px;\n    }\n\n    .tr-button {\n      align-items: center;\n      border: 1px solid var(--tr-green);\n      border-radius: 999px;\n      display: inline-flex;\n      font-size: 15px;\n      font-weight: 800;\n      justify-content: center;\n      min-height: 50px;\n      padding: 13px 22px;\n      text-decoration: none;\n      transition: transform .18s ease, background .18s ease;\n    }\n\n    .tr-button:hover {\n      transform: translateY(-1px);\n    }\n\n    .tr-button--primary {\n      background: var(--tr-green);\n      color: var(--tr-white) !important;\n    }\n\n    .tr-button--secondary {\n      background: transparent;\n      color: var(--tr-green) !important;\n    }\n\n    .tr-button--light {\n      background: var(--tr-white);\n      border-color: var(--tr-white);\n      color: var(--tr-green-dark) !important;\n    }\n\n    .tr-hero {\n      background:\n        radial-gradient(circle at 83% 13%, rgba(217, 240, 122, .35), transparent 28%),\n        linear-gradient(135deg, #f5f8f3 0%, #eaf4ed 100%);\n      border-radius: 28px;\n      margin-top: 16px;\n      padding: 60px 0;\n    }\n\n    .tr-hero-grid {\n      align-items: center;\n      display: grid;\n      gap: 42px;\n      grid-template-columns: minmax(0, 1.08fr) minmax(330px, .92fr);\n    }\n\n    .tr-hero-note {\n      background: rgba(255,255,255,.72);\n      border: 1px solid rgba(35,91,66,.13);\n      border-radius: 14px;\n      color: var(--tr-ink);\n      font-size: 14px;\n      margin: 22px 0 0;\n      max-width: 620px;\n      padding: 13px 16px;\n    }\n\n    .tr-chip-row {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 9px;\n      margin-top: 24px;\n    }\n\n    .tr-chip {\n      align-items: center;\n      background: var(--tr-white);\n      border: 1px solid var(--tr-line);\n      border-radius: 999px;\n      display: inline-flex;\n      font-size: 13px;\n      font-weight: 700;\n      gap: 7px;\n      padding: 8px 12px;\n    }\n\n    .tr-visual {\n      min-width: 0;\n      position: relative;\n    }\n\n    .tr-product-image {\n      border-radius: 22px;\n      display: block;\n      height: auto;\n      width: 100%;\n    }\n\n    .tr-screen {\n      background: #101712;\n      border: 11px solid #202923;\n      border-radius: 22px;\n      box-shadow: 0 24px 60px rgba(21,59,43,.2);\n      color: var(--tr-white);\n      min-height: 330px;\n      overflow: hidden;\n      padding: 28px;\n      position: relative;\n    }\n\n    .tr-screen::after {\n      background: radial-gradient(circle, rgba(217,240,122,.28), transparent 64%);\n      content: \"\";\n      height: 280px;\n      position: absolute;\n      right: -50px;\n      top: -80px;\n      width: 280px;\n    }\n\n    .tr-screen-top {\n      align-items: center;\n      display: flex;\n      justify-content: space-between;\n      position: relative;\n      z-index: 1;\n    }\n\n    .tr-screen-brand {\n      font-size: 18px;\n      font-weight: 800;\n    }\n\n    .tr-live {\n      background: var(--tr-lime);\n      border-radius: 999px;\n      color: var(--tr-green-dark);\n      font-size: 11px;\n      font-weight: 900;\n      padding: 6px 10px;\n      text-transform: uppercase;\n    }\n\n    .tr-station {\n      margin-top: 64px;\n      position: relative;\n      z-index: 1;\n    }\n\n    .tr-station-kicker {\n      color: #9eb0a5;\n      font-size: 12px;\n      letter-spacing: .1em;\n      text-transform: uppercase;\n    }\n\n    .tr-station-name {\n      font-size: clamp(32px, 5vw, 54px);\n      font-weight: 800;\n      letter-spacing: -.04em;\n      line-height: 1;\n      margin-top: 7px;\n    }\n\n    .tr-station-meta {\n      color: #c2cec7;\n      margin-top: 12px;\n    }\n\n    .tr-player {\n      align-items: center;\n      display: flex;\n      gap: 18px;\n      margin-top: 34px;\n      position: relative;\n      z-index: 1;\n    }\n\n    .tr-play {\n      align-items: center;\n      background: var(--tr-lime);\n      border-radius: 50%;\n      color: var(--tr-green-dark);\n      display: flex;\n      font-size: 22px;\n      height: 54px;\n      justify-content: center;\n      padding-left: 3px;\n      width: 54px;\n    }\n\n    .tr-wave {\n      display: flex;\n      gap: 5px;\n    }\n\n    .tr-wave span {\n      background: #759384;\n      border-radius: 999px;\n      display: block;\n      height: 16px;\n      width: 5px;\n    }\n\n    .tr-wave span:nth-child(2),\n    .tr-wave span:nth-child(6) { height: 28px; }\n    .tr-wave span:nth-child(3),\n    .tr-wave span:nth-child(5) { height: 38px; }\n    .tr-wave span:nth-child(4) { height: 46px; }\n\n    .tr-flow {\n      counter-reset: radio-step;\n      display: grid;\n      gap: 14px;\n      grid-template-columns: repeat(4, minmax(0, 1fr));\n    }\n\n    .tr-flow-card {\n      background: var(--tr-sand);\n      border-radius: 18px;\n      min-height: 210px;\n      padding: 24px 20px;\n      position: relative;\n    }\n\n    .tr-flow-card::before {\n      align-items: center;\n      background: var(--tr-green);\n      border-radius: 50%;\n      color: var(--tr-white);\n      content: counter(radio-step);\n      counter-increment: radio-step;\n      display: flex;\n      font-size: 13px;\n      font-weight: 900;\n      height: 32px;\n      justify-content: center;\n      margin-bottom: 38px;\n      width: 32px;\n    }\n\n    .tr-flow-card:not(:last-child)::after {\n      color: var(--tr-green);\n      content: \"→\";\n      font-size: 24px;\n      font-weight: 900;\n      position: absolute;\n      right: -13px;\n      top: 27px;\n      z-index: 2;\n    }\n\n    .tr-flow-card p,\n    .tr-download-card p,\n    .tr-benefit-card p,\n    .tr-plan p {\n      color: var(--tr-muted);\n      font-size: 14px;\n      margin-bottom: 0;\n    }\n\n    .tr-download-wrap {\n      background: var(--tr-green-dark);\n      border-radius: 26px;\n      color: var(--tr-white);\n      padding: 58px 0;\n    }\n\n    .tr-download-wrap .tr-section-intro {\n      color: #bfd0c6;\n    }\n\n    .tr-download-grid {\n      display: grid;\n      gap: 18px;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n\n    .tr-download-card {\n      background: var(--tr-white);\n      border: 2px solid transparent;\n      border-radius: 20px;\n      color: var(--tr-ink);\n      display: flex;\n      flex-direction: column;\n      min-height: 355px;\n      padding: 24px;\n      position: relative;\n    }\n\n    .tr-download-card--recommended {\n      border-color: var(--tr-lime);\n    }\n\n    .tr-download-card--soon {\n      background: #edf1ee;\n    }\n\n    .tr-badge {\n      background: var(--tr-lime);\n      border-radius: 999px;\n      color: var(--tr-green-dark);\n      font-size: 10px;\n      font-weight: 900;\n      letter-spacing: .08em;\n      padding: 6px 9px;\n      position: absolute;\n      right: 18px;\n      text-transform: uppercase;\n      top: 18px;\n    }\n\n    .tr-icon {\n      align-items: center;\n      background: var(--tr-mint);\n      border-radius: 16px;\n      color: var(--tr-green);\n      display: flex;\n      height: 58px;\n      justify-content: center;\n      margin-bottom: 26px;\n      width: 58px;\n    }\n\n    .tr-icon svg {\n      height: 30px;\n      stroke: currentColor;\n      width: 30px;\n    }\n\n    .tr-url {\n      background: var(--tr-mint);\n      border: 1px dashed #9db9a8;\n      border-radius: 10px;\n      color: var(--tr-green-dark);\n      font-size: 16px;\n      font-weight: 900;\n      margin: 18px 0 0;\n      overflow-wrap: anywhere;\n      padding: 10px 12px;\n      text-align: center;\n    }\n\n    .tr-download-card .tr-button {\n      margin-top: auto;\n      width: 100%;\n    }\n\n    .tr-state {\n      align-items: center;\n      background: #dce3df;\n      border-radius: 999px;\n      color: #6b7770;\n      display: flex;\n      font-size: 14px;\n      font-weight: 800;\n      justify-content: center;\n      margin-top: auto;\n      min-height: 50px;\n      padding: 13px 22px;\n    }\n\n    .tr-download-note {\n      color: #bfd0c6;\n      font-size: 13px;\n      margin: 20px auto 0;\n      max-width: 760px;\n      text-align: center;\n    }\n\n    .tr-benefits {\n      align-items: center;\n      display: grid;\n      gap: 46px;\n      grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);\n    }\n\n    .tr-benefit-grid {\n      display: grid;\n      gap: 12px;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    .tr-benefit-card {\n      border: 1px solid var(--tr-line);\n      border-radius: 16px;\n      padding: 20px;\n    }\n\n    .tr-benefit-card .tr-icon {\n      height: 44px;\n      margin-bottom: 16px;\n      width: 44px;\n    }\n\n    .tr-benefit-card .tr-icon svg {\n      height: 23px;\n      width: 23px;\n    }\n\n    .tr-feature-image {\n      border-radius: 22px;\n      display: block;\n      width: 100%;\n    }\n\n    .tr-feature-placeholder {\n      align-content: center;\n      background: linear-gradient(135deg, #eef4ef, #dfece4);\n      border: 1px solid var(--tr-line);\n      border-radius: 22px;\n      display: grid;\n      min-height: 430px;\n      padding: 34px;\n    }\n\n    .tr-ui-grid {\n      display: grid;\n      gap: 12px;\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    .tr-ui-card {\n      background: rgba(255,255,255,.88);\n      border-radius: 14px;\n      min-height: 130px;\n      padding: 20px;\n    }\n\n    .tr-ui-card span {\n      color: var(--tr-green);\n      display: block;\n      font-size: 24px;\n      margin-bottom: 25px;\n    }\n\n    .tr-ui-card strong {\n      display: block;\n      font-size: 15px;\n    }\n\n    .tr-plan-grid {\n      display: grid;\n      gap: 18px;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      max-width: 850px;\n    }\n\n    .tr-plan {\n      border: 1px solid var(--tr-line);\n      border-radius: 20px;\n      padding: 28px;\n      position: relative;\n    }\n\n    .tr-plan--featured {\n      background: var(--tr-green);\n      border-color: var(--tr-green);\n      color: var(--tr-white);\n    }\n\n    .tr-plan--featured p {\n      color: #c9d9d0;\n    }\n\n    .tr-plan-label {\n      color: var(--tr-green);\n      font-size: 12px;\n      font-weight: 900;\n      letter-spacing: .08em;\n      margin-bottom: 36px;\n      text-transform: uppercase;\n    }\n\n    .tr-plan--featured .tr-plan-label {\n      color: var(--tr-lime);\n    }\n\n    .tr-plan-title {\n      font-size: 30px;\n      font-weight: 850;\n      letter-spacing: -.03em;\n      line-height: 1.05;\n      margin-bottom: 12px;\n    }\n\n    .tr-plan-meta {\n      border-top: 1px solid var(--tr-line);\n      font-size: 13px;\n      font-weight: 750;\n      margin-top: 26px;\n      padding-top: 18px;\n    }\n\n    .tr-plan--featured .tr-plan-meta {\n      border-color: rgba(255,255,255,.2);\n    }\n\n    .tr-purchase-note {\n      color: var(--tr-muted);\n      font-size: 13px;\n      margin: 18px 0 0;\n    }\n\n    .tr-existing {\n      background: var(--tr-sand);\n      border: 1px solid #e6dfd1;\n      border-radius: 24px;\n      display: grid;\n      gap: 30px;\n      grid-template-columns: 70px minmax(0, 1fr) auto;\n      padding: 34px;\n    }\n\n    .tr-existing-icon {\n      align-items: center;\n      background: var(--tr-white);\n      border-radius: 50%;\n      color: var(--tr-green);\n      display: flex;\n      height: 70px;\n      justify-content: center;\n      width: 70px;\n    }\n\n    .tr-existing-icon svg {\n      height: 34px;\n      stroke: currentColor;\n      width: 34px;\n    }\n\n    .tr-existing h2 {\n      font-size: 29px;\n      margin-bottom: 8px;\n    }\n\n    .tr-existing p {\n      color: var(--tr-muted);\n      margin-bottom: 7px;\n    }\n\n    .tr-small {\n      font-size: 12px;\n    }\n\n    .tr-existing-action {\n      align-self: center;\n      min-width: 230px;\n    }\n\n    .tr-bonus {\n      align-items: center;\n      background: linear-gradient(100deg, #173f2e, #2b6b4c);\n      border-radius: 24px;\n      color: var(--tr-white);\n      display: grid;\n      gap: 26px;\n      grid-template-columns: 74px minmax(0, 1fr);\n      padding: 32px 36px;\n    }\n\n    .tr-weather-icon {\n      align-items: center;\n      background: rgba(255,255,255,.12);\n      border-radius: 18px;\n      display: flex;\n      font-size: 34px;\n      height: 74px;\n      justify-content: center;\n      width: 74px;\n    }\n\n    .tr-bonus h2 {\n      font-size: 28px;\n      margin-bottom: 5px;\n    }\n\n    .tr-bonus p {\n      color: #d2e2d9;\n      margin-bottom: 0;\n    }\n\n    .tr-faq-list {\n      border-top: 1px solid var(--tr-line);\n    }\n\n    .tr-faq-list details {\n      border-bottom: 1px solid var(--tr-line);\n      padding: 0;\n    }\n\n    .tr-faq-list summary {\n      cursor: pointer;\n      font-size: 17px;\n      font-weight: 800;\n      list-style: none;\n      padding: 21px 42px 21px 0;\n      position: relative;\n    }\n\n    .tr-faq-list summary::-webkit-details-marker {\n      display: none;\n    }\n\n    .tr-faq-list summary::after {\n      color: var(--tr-green);\n      content: \"+\";\n      font-size: 26px;\n      font-weight: 400;\n      position: absolute;\n      right: 8px;\n      top: 14px;\n    }\n\n    .tr-faq-list details[open] summary::after {\n      content: \"−\";\n    }\n\n    .tr-faq-list details p {\n      color: var(--tr-muted);\n      margin-bottom: 22px;\n      max-width: 850px;\n    }\n\n    .tr-delivery-bar {\n      background: var(--tr-mint);\n      border-radius: 14px;\n      color: var(--tr-green-dark);\n      display: grid;\n      font-size: 13px;\n      font-weight: 800;\n      gap: 12px;\n      grid-template-columns: repeat(3, 1fr);\n      margin-top: 28px;\n      padding: 16px 18px;\n      text-align: center;\n    }\n\n    @media (max-width: 900px) {\n      .tr-hero-grid,\n      .tr-benefits {\n        grid-template-columns: 1fr;\n      }\n\n      .tr-flow {\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n      }\n\n      .tr-flow-card:not(:last-child)::after {\n        display: none;\n      }\n\n      .tr-download-grid {\n        grid-template-columns: 1fr;\n      }\n\n      .tr-download-card {\n        min-height: 315px;\n      }\n\n      .tr-existing {\n        grid-template-columns: 70px minmax(0, 1fr);\n      }\n\n      .tr-existing-action {\n        grid-column: 1 \/ -1;\n      }\n    }\n\n    @media (max-width: 620px) {\n      .tr-shell {\n        padding-left: 17px;\n        padding-right: 17px;\n      }\n\n      .tr-section {\n        padding: 50px 0;\n      }\n\n      .tr-hero {\n        border-radius: 20px;\n        margin-top: 8px;\n        padding: 44px 0;\n      }\n\n      .tr-page h1 {\n        font-size: 41px;\n      }\n\n      .tr-page h2 {\n        font-size: 30px;\n      }\n\n      .tr-button {\n        width: 100%;\n      }\n\n      .tr-screen {\n        min-height: 285px;\n        padding: 22px;\n      }\n\n      .tr-flow,\n      .tr-benefit-grid,\n      .tr-plan-grid,\n      .tr-ui-grid {\n        grid-template-columns: 1fr;\n      }\n\n      .tr-flow-card {\n        min-height: 175px;\n      }\n\n      .tr-flow-card::before {\n        margin-bottom: 24px;\n      }\n\n      .tr-download-wrap {\n        border-radius: 20px;\n        padding: 46px 0;\n      }\n\n      .tr-feature-placeholder {\n        min-height: 360px;\n        padding: 20px;\n      }\n\n      .tr-ui-card {\n        min-height: 105px;\n      }\n\n      .tr-existing {\n        grid-template-columns: 1fr;\n        padding: 26px 22px;\n      }\n\n      .tr-existing-action {\n        grid-column: auto;\n        min-width: 0;\n      }\n\n      .tr-bonus {\n        grid-template-columns: 1fr;\n        padding: 27px 23px;\n      }\n\n      .tr-delivery-bar {\n        grid-template-columns: 1fr;\n        text-align: left;\n      }\n    }\n  \u003c\/style\u003e\n\n  \u003c!-- 1. HERO --\u003e\n  \u003cdiv class=\"tr-hero\"\u003e\n    \u003cdiv class=\"tr-shell tr-hero-grid\"\u003e\n      \u003cdiv\u003e\n        \u003cp class=\"tr-eyebrow\"\u003eFree APK download · License required for service\u003c\/p\u003e\n        \u003ch1\u003eGlobal radio, built for your Android car screen.\u003c\/h1\u003e\n        \u003cp class=\"tr-lead\"\u003e\n          Purchase a 2-year or lifetime service license, download the Toppal Radio APK for free,\n          and unlock radio stations from around the world on your car screen.\n        \u003c\/p\u003e\n\n        \u003cdiv class=\"tr-chip-row\" aria-label=\"Product highlights\"\u003e\n          \u003cspan class=\"tr-chip\"\u003e🌍 Global stations\u003c\/span\u003e\n          \u003cspan class=\"tr-chip\"\u003e🚘 Car-screen optimized\u003c\/span\u003e\n          \u003cspan class=\"tr-chip\"\u003e☀️ Weather included free\u003c\/span\u003e\n        \u003c\/div\u003e\n\n        \u003cdiv class=\"tr-button-row\"\u003e\n          \u003ca class=\"tr-button tr-button--primary\" href=\"#tr-license-plans\"\u003eChoose a License\u003c\/a\u003e\n          \u003ca class=\"tr-button tr-button--secondary\" href=\"#tr-download\"\u003eDownload Free APK\u003c\/a\u003e\n        \u003c\/div\u003e\n\n        \u003cp class=\"tr-hero-note\"\u003e\n          \u003cstrong\u003eWhat am I paying for?\u003c\/strong\u003e The APK is free. Your payment unlocks the\n          Toppal Global Radio service for the license period you choose.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-visual\"\u003e\n        {% if radio_hero_image != blank %}\n          \u003cimg class=\"tr-product-image\" src=\"{{%20radio_hero_image%20}}\" alt=\"Toppal Global Radio running on an Android car screen\" loading=\"eager\"\u003e\n        {% else %}\n          \u003c!-- Replace the blank radio_hero_image variable above with a real product image when ready. --\u003e\n          \u003cdiv class=\"tr-screen\" role=\"img\" aria-label=\"Illustration of Toppal Radio on a car screen\"\u003e\n            \u003cdiv class=\"tr-screen-top\"\u003e\n              \u003cspan class=\"tr-screen-brand\"\u003eToppal Radio\u003c\/span\u003e\n              \u003cspan class=\"tr-live\"\u003eLive\u003c\/span\u003e\n            \u003c\/div\u003e\n            \u003cdiv class=\"tr-station\"\u003e\n              \u003cdiv class=\"tr-station-kicker\"\u003eGlobal Radio\u003c\/div\u003e\n              \u003cdiv class=\"tr-station-name\"\u003eOn the road.\u003c\/div\u003e\n              \u003cdiv class=\"tr-station-meta\"\u003eStations from around the world\u003c\/div\u003e\n            \u003c\/div\u003e\n            \u003cdiv class=\"tr-player\"\u003e\n              \u003cspan class=\"tr-play\" aria-hidden=\"true\"\u003e▶\u003c\/span\u003e\n              \u003cspan class=\"tr-wave\" aria-hidden=\"true\"\u003e\n                \u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\u003cspan\u003e\u003c\/span\u003e\n              \u003c\/span\u003e\n            \u003c\/div\u003e\n          \u003c\/div\u003e\n        {% endif %}\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 2. HOW IT WORKS --\u003e\n  \u003cdiv class=\"tr-section\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-section-head\"\u003e\n        \u003cp class=\"tr-eyebrow\"\u003eSimple setup\u003c\/p\u003e\n        \u003ch2\u003eFrom purchase to listening in four steps\u003c\/h2\u003e\n        \u003cp class=\"tr-section-intro\"\u003eNo subscription app store account is required.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-flow\"\u003e\n        \u003carticle class=\"tr-flow-card\"\u003e\n          \u003ch3\u003eChoose a License\u003c\/h3\u003e\n          \u003cp\u003eSelect the 2-year or lifetime option in the product selector.\u003c\/p\u003e\n        \u003c\/article\u003e\n        \u003carticle class=\"tr-flow-card\"\u003e\n          \u003ch3\u003eDownload the APK\u003c\/h3\u003e\n          \u003cp\u003eUse your car-screen browser, this page, or the delivery email.\u003c\/p\u003e\n        \u003c\/article\u003e\n        \u003carticle class=\"tr-flow-card\"\u003e\n          \u003ch3\u003eInstall on Your Screen\u003c\/h3\u003e\n          \u003cp\u003eOpen the APK file on your compatible Android car screen.\u003c\/p\u003e\n        \u003c\/article\u003e\n        \u003carticle class=\"tr-flow-card\"\u003e\n          \u003ch3\u003eEnter Your Code\u003c\/h3\u003e\n          \u003cp\u003eUse the license code sent by email to unlock the service.\u003c\/p\u003e\n        \u003c\/article\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 3. THREE DOWNLOAD METHODS --\u003e\n  \u003cdiv class=\"tr-download-wrap\" id=\"tr-download\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-section-head\"\u003e\n        \u003cp class=\"tr-eyebrow\"\u003eFree app download\u003c\/p\u003e\n        \u003ch2\u003eChoose the easiest way to get the APK\u003c\/h2\u003e\n        \u003cp class=\"tr-section-intro\"\u003e\n          All available methods provide the same Toppal Radio app. Choose the one that works best\n          for your Android car screen.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-download-grid\"\u003e\n        \u003carticle class=\"tr-download-card tr-download-card--recommended\"\u003e\n          \u003cspan class=\"tr-badge\"\u003eRecommended\u003c\/span\u003e\n          \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n              \u003ccircle cx=\"12\" cy=\"12\" r=\"9\"\u003e\u003c\/circle\u003e\n              \u003cpath d=\"M3.5 9h17M3.5 15h17M12 3c2.5 2.5 3.7 5.5 3.7 9S14.5 18.5 12 21M12 3C9.5 5.5 8.3 8.5 8.3 12S9.5 18.5 12 21\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch3\u003eDownload on Your Car Screen\u003c\/h3\u003e\n          \u003cp\u003eOpen the browser on your car screen and enter the address below. The APK download will start automatically.\u003c\/p\u003e\n          \u003cdiv class=\"tr-url\"\u003etoppal.ai\/radio\u003c\/div\u003e\n          \u003ca class=\"tr-button tr-button--primary\" href=\"https:\/\/toppal.ai\/radio\"\u003eOpen Download Link\u003c\/a\u003e\n        \u003c\/article\u003e\n\n        \u003carticle class=\"tr-download-card\"\u003e\n          \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n              \u003cpath d=\"M7 3h7l4 4v14H7z\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"M14 3v5h5M12 11v6M9.5 14.5 12 17l2.5-2.5\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch3\u003eDownload the APK File\u003c\/h3\u003e\n          \u003cp\u003eDownload the APK from this page or your delivery email, then transfer the file to your car screen and install it.\u003c\/p\u003e\n          \u003ca class=\"tr-button tr-button--primary\" href=\"https:\/\/toppal.ai\/radio\"\u003eDownload APK\u003c\/a\u003e\n        \u003c\/article\u003e\n\n        \u003carticle class=\"tr-download-card tr-download-card--soon\"\u003e\n          \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n              \u003cpath d=\"m5 3 13 9L5 21z\"\u003e\u003c\/path\u003e\n              \u003cpath d=\"m5 3 8.5 12.8M5 21l8.5-12.8\"\u003e\u003c\/path\u003e\n            \u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003ch3\u003eGoogle Play\u003c\/h3\u003e\n          \u003cp\u003eToppal Radio is coming to Google Play for easier installation and future app updates.\u003c\/p\u003e\n          \u003cspan class=\"tr-state\" aria-label=\"Google Play availability\"\u003eComing Soon\u003c\/span\u003e\n        \u003c\/article\u003e\n      \u003c\/div\u003e\n\n      \u003cp class=\"tr-download-note\"\u003e\n        Google Play is not available yet. For immediate installation, use the car-screen browser\n        or download the APK file directly.\n      \u003c\/p\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 4. WHY TOPPAL --\u003e\n  \u003cdiv class=\"tr-section\"\u003e\n    \u003cdiv class=\"tr-shell tr-benefits\"\u003e\n      \u003cdiv\u003e\n        \u003cdiv class=\"tr-section-head\"\u003e\n          \u003cp class=\"tr-eyebrow\"\u003eMade for driving\u003c\/p\u003e\n          \u003ch2\u003eWhy Toppal instead of a regular radio app?\u003c\/h2\u003e\n          \u003cp class=\"tr-section-intro\"\u003e\n            Toppal builds software for Android car screens. The experience is designed for the\n            landscape display and the way drivers actually use it.\n          \u003c\/p\u003e\n        \u003c\/div\u003e\n\n        \u003cdiv class=\"tr-benefit-grid\"\u003e\n          \u003carticle class=\"tr-benefit-card\"\u003e\n            \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n              \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n                \u003crect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\u003e\u003c\/rect\u003e\n                \u003cpath d=\"M7 15h10M8 9h8\"\u003e\u003c\/path\u003e\n              \u003c\/svg\u003e\n            \u003c\/div\u003e\n            \u003ch3\u003eBuilt for Car Screens\u003c\/h3\u003e\n            \u003cp\u003eLandscape layout, readable station information and car-friendly controls.\u003c\/p\u003e\n          \u003c\/article\u003e\n\n          \u003carticle class=\"tr-benefit-card\"\u003e\n            \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n              \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n                \u003ccircle cx=\"12\" cy=\"12\" r=\"9\"\u003e\u003c\/circle\u003e\n                \u003cpath d=\"M3 12h18M12 3c2.6 2.6 4 5.6 4 9s-1.4 6.4-4 9M12 3c-2.6 2.6-4 5.6-4 9s1.4 6.4 4 9\"\u003e\u003c\/path\u003e\n              \u003c\/svg\u003e\n            \u003c\/div\u003e\n            \u003ch3\u003eStations Worldwide\u003c\/h3\u003e\n            \u003cp\u003eBrowse radio by country and content category.\u003c\/p\u003e\n          \u003c\/article\u003e\n\n          \u003carticle class=\"tr-benefit-card\"\u003e\n            \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n              \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n                \u003cpath d=\"m12 3 2.8 5.7 6.2.9-4.5 4.4 1.1 6.2L12 17.3l-5.6 2.9 1.1-6.2L3 9.6l6.2-.9z\"\u003e\u003c\/path\u003e\n              \u003c\/svg\u003e\n            \u003c\/div\u003e\n            \u003ch3\u003eFavorites \u0026amp; History\u003c\/h3\u003e\n            \u003cp\u003eSave preferred stations and return to recently played content.\u003c\/p\u003e\n          \u003c\/article\u003e\n\n          \u003carticle class=\"tr-benefit-card\"\u003e\n            \u003cdiv class=\"tr-icon\" aria-hidden=\"true\"\u003e\n              \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n                \u003cpath d=\"M4 18V9M10 18V5M16 18v-7M22 18V3\"\u003e\u003c\/path\u003e\n              \u003c\/svg\u003e\n            \u003c\/div\u003e\n            \u003ch3\u003eFor You\u003c\/h3\u003e\n            \u003cp\u003eDiscover stations based on your listening preferences.\u003c\/p\u003e\n          \u003c\/article\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv\u003e\n        {% if radio_feature_image != blank %}\n          \u003cimg class=\"tr-feature-image\" src=\"{{%20radio_feature_image%20}}\" alt=\"Toppal Radio feature interface on an Android car screen\" loading=\"lazy\"\u003e\n        {% else %}\n          \u003c!-- Replace the blank radio_feature_image variable above with a real UI screenshot when ready. --\u003e\n          \u003cdiv class=\"tr-feature-placeholder\" aria-label=\"Toppal Radio feature overview\"\u003e\n            \u003cdiv class=\"tr-ui-grid\"\u003e\n              \u003cdiv class=\"tr-ui-card\"\u003e\n\u003cspan\u003e🌍\u003c\/span\u003e\u003cstrong\u003eBrowse by Country\u003c\/strong\u003e\n\u003c\/div\u003e\n              \u003cdiv class=\"tr-ui-card\"\u003e\n\u003cspan\u003e▦\u003c\/span\u003e\u003cstrong\u003eBrowse by Category\u003c\/strong\u003e\n\u003c\/div\u003e\n              \u003cdiv class=\"tr-ui-card\"\u003e\n\u003cspan\u003e★\u003c\/span\u003e\u003cstrong\u003eYour Favorites\u003c\/strong\u003e\n\u003c\/div\u003e\n              \u003cdiv class=\"tr-ui-card\"\u003e\n\u003cspan\u003e▶\u003c\/span\u003e\u003cstrong\u003eRecently Played\u003c\/strong\u003e\n\u003c\/div\u003e\n            \u003c\/div\u003e\n          \u003c\/div\u003e\n        {% endif %}\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 5. LICENSE OPTIONS --\u003e\n  \u003cdiv class=\"tr-section\" id=\"tr-license-plans\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-section-head\"\u003e\n        \u003cp class=\"tr-eyebrow\"\u003eOne-time payment\u003c\/p\u003e\n        \u003ch2\u003eChoose how long you want to listen\u003c\/h2\u003e\n        \u003cp class=\"tr-section-intro\"\u003e\n          Select your option in the Shopify product selector above. The APK download itself is free.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-plan-grid\"\u003e\n        \u003carticle class=\"tr-plan\"\u003e\n          \u003cdiv class=\"tr-plan-label\"\u003eFlexible access\u003c\/div\u003e\n          \u003cdiv class=\"tr-plan-title\"\u003e2-Year License\u003c\/div\u003e\n          \u003cp\u003eUnlock Toppal Global Radio for 2 years on your compatible Android car screen.\u003c\/p\u003e\n          \u003cdiv class=\"tr-plan-meta\"\u003ePrice shown in the product selector\u003c\/div\u003e\n        \u003c\/article\u003e\n\n        \u003carticle class=\"tr-plan tr-plan--featured\"\u003e\n          \u003cdiv class=\"tr-plan-label\"\u003eBest long-term value\u003c\/div\u003e\n          \u003cdiv class=\"tr-plan-title\"\u003eLifetime License\u003c\/div\u003e\n          \u003cp\u003eMake one payment for permanent access to the Toppal Global Radio service.\u003c\/p\u003e\n          \u003cdiv class=\"tr-plan-meta\"\u003ePrice shown in the product selector\u003c\/div\u003e\n        \u003c\/article\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-button-row\"\u003e\n        \u003ca class=\"tr-button tr-button--primary\" href=\"#MainContent\"\u003eReturn to Product Options\u003c\/a\u003e\n      \u003c\/div\u003e\n      \u003cp class=\"tr-purchase-note\"\u003eLicense code delivered by email after payment.\u003c\/p\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 6. EXISTING CUSTOMER BENEFIT --\u003e\n  \u003cdiv class=\"tr-section\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-existing\"\u003e\n        \u003cdiv class=\"tr-existing-icon\" aria-hidden=\"true\"\u003e\n          \u003csvg viewbox=\"0 0 24 24\" fill=\"none\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\u003e\n            \u003cpath d=\"M20 8.5A8 8 0 1 0 20 16\"\u003e\u003c\/path\u003e\n            \u003cpath d=\"M20 4v4.5h-4.5M9 12l2 2 4-4\"\u003e\u003c\/path\u003e\n          \u003c\/svg\u003e\n        \u003c\/div\u003e\n        \u003cdiv\u003e\n          \u003cp class=\"tr-eyebrow\"\u003eExisting customer benefit\u003c\/p\u003e\n          \u003ch2\u003eAlready have an eligible Toppal license?\u003c\/h2\u003e\n          \u003cp\u003e\n            Toppal Radio may already be included with an eligible Connected, Renewal or AI license.\n            Please do not purchase another Radio license before checking your existing benefits.\n          \u003c\/p\u003e\n          \u003cp class=\"tr-small\"\u003e\n            Eligibility depends on your previous Toppal product and license status. Use the email\n            address connected to your original order when contacting us.\n          \u003c\/p\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"tr-existing-action\"\u003e\n          \u003c!-- Replace \/pages\/contact below if your existing support page uses a different URL. --\u003e\n          \u003ca class=\"tr-button tr-button--primary\" href=\"\/pages\/contact\"\u003e\n            Check My Benefit\n          \u003c\/a\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 7. WEATHER BONUS --\u003e\n  \u003cdiv class=\"tr-section\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-bonus\"\u003e\n        \u003cdiv class=\"tr-weather-icon\" aria-hidden=\"true\"\u003e☀️\u003c\/div\u003e\n        \u003cdiv\u003e\n          \u003cp class=\"tr-eyebrow\"\u003eFree bonus\u003c\/p\u003e\n          \u003ch2\u003eToppal Weather is included\u003c\/h2\u003e\n          \u003cp\u003e\n            Your Radio license also unlocks the Toppal Weather app at no additional cost.\n            Radio remains the main service; Weather is an included benefit.\n          \u003c\/p\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- 8. FAQ \u0026 DELIVERY --\u003e\n  \u003cdiv class=\"tr-section\"\u003e\n    \u003cdiv class=\"tr-shell\"\u003e\n      \u003cdiv class=\"tr-section-head\"\u003e\n        \u003cp class=\"tr-eyebrow\"\u003eBefore you buy\u003c\/p\u003e\n        \u003ch2\u003eFAQ \u0026amp; delivery\u003c\/h2\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-faq-list\"\u003e\n        \u003cdetails\u003e\n          \u003csummary\u003eWhat device do I need?\u003c\/summary\u003e\n          \u003cp\u003e\n            Toppal Radio is designed for compatible Android car screens. It is not a replacement\n            car screen and is not intended as a standard mobile-phone radio app.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eAm I paying for the APK?\u003c\/summary\u003e\n          \u003cp\u003e\n            No. The APK download is free. You are paying for a 2-year or lifetime license that\n            unlocks the Toppal Global Radio service.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eHow do I receive my license code?\u003c\/summary\u003e\n          \u003cp\u003e\n            After payment, the license code and delivery information are sent to the email address\n            used at checkout. Please also check your spam or promotions folder.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eHow do I install the APK?\u003c\/summary\u003e\n          \u003cp\u003e\n            The recommended method is to open the browser on your car screen and visit\n            \u003cstrong\u003etoppal.ai\/radio\u003c\/strong\u003e. You can also download the APK from this page or your\n            delivery email, transfer it to the car screen, and open the file to install.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eIs Toppal Radio available on Google Play?\u003c\/summary\u003e\n          \u003cp\u003e\n            Not yet. Google Play availability is coming soon. Use the direct APK download methods\n            on this page for immediate installation.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eI am already a Toppal customer. Do I need to buy again?\u003c\/summary\u003e\n          \u003cp\u003e\n            Maybe not. Radio access may already be included with an eligible Connected, Renewal or\n            AI license. Check your existing benefit before purchasing a separate Radio license.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n\n        \u003cdetails\u003e\n          \u003csummary\u003eWhat happens after the 2-year license expires?\u003c\/summary\u003e\n          \u003cp\u003e\n            The Radio service will need to be renewed to continue. A lifetime license does not\n            require a later service-period renewal.\n          \u003c\/p\u003e\n        \u003c\/details\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"tr-delivery-bar\" aria-label=\"Purchase and delivery summary\"\u003e\n        \u003cspan\u003e✓ Free APK download\u003c\/span\u003e\n        \u003cspan\u003e✓ License delivered by email\u003c\/span\u003e\n        \u003cspan\u003e✓ Weather app included\u003c\/span\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\u003c\/section\u003e","brand":"Toppal","offers":[{"title":"2 Year","offer_id":50938380517543,"sku":null,"price":6.99,"currency_code":"USD","in_stock":true},{"title":"Lifetime","offer_id":50938380550311,"sku":null,"price":9.99,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0522\/7878\/8263\/files\/mainpage_d2d165cc-29d0-48ff-9de4-816eed6dd7d3.png?v=1783308056","url":"https:\/\/toppal.myshopify.com\/products\/toppal-global-radio-for-android-head-units","provider":"Toppal","version":"1.0","type":"link"}