{"id":5,"date":"2026-09-03T11:50:36","date_gmt":"2026-09-03T11:50:36","guid":{"rendered":"https:\/\/radiosubscriiptiionservices.com\/?page_id=5"},"modified":"2026-09-03T12:46:52","modified_gmt":"2026-09-03T12:46:52","slug":"home","status":"publish","type":"page","link":"https:\/\/radiosubscriiptiionservices.com\/?page_id=5","title":{"rendered":"home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5\" class=\"elementor elementor-5\">\n\t\t\t\t<div class=\"elementor-element elementor-element-da1c800 e-con e-atomic-element e-flexbox-base e-462ba73 \" data-id=\"da1c800\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"da1c800\">\n    \t\t<div class=\"elementor-element elementor-element-d642288 elementor-widget elementor-widget-html\" data-id=\"d642288\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 HERO SECTION\r\n     Paste this whole block into an Elementor \"HTML\" widget.\r\n     (Style + Script tags work fine inside Elementor's HTML widget.)\r\n     Image placeholder is at the bottom marked EDIT ME \u2014 swap the\r\n     src link with your own photo whenever you're ready.\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-hero\" id=\"rcfHero\">\r\n\r\n  <!-- ambient broadcast-wave background -->\r\n  <div class=\"rcf-hero__bg\" aria-hidden=\"true\">\r\n    <svg class=\"rcf-hero__waves\" viewBox=\"0 0 1000 800\" preserveAspectRatio=\"xMidYMid slice\">\r\n      <circle class=\"rcf-wave rcf-wave--1\" cx=\"820\" cy=\"120\" r=\"90\"\/>\r\n      <circle class=\"rcf-wave rcf-wave--2\" cx=\"820\" cy=\"120\" r=\"180\"\/>\r\n      <circle class=\"rcf-wave rcf-wave--3\" cx=\"820\" cy=\"120\" r=\"270\"\/>\r\n      <circle class=\"rcf-wave rcf-wave--4\" cx=\"820\" cy=\"120\" r=\"360\"\/>\r\n    <\/svg>\r\n  <\/div>\r\n\r\n  <div class=\"rcf-hero__inner\">\r\n\r\n    <!-- glass copy panel -->\r\n    <div class=\"rcf-hero__panel\">\r\n      <h1 class=\"rcf-hero__title\">Find any radio station in seconds<\/h1>\r\n      <p class=\"rcf-hero__text\">\r\n        Search thousands of FM and AM stations by name, frequency, or radio ID.\r\n        Radio Code Finder connects you to live broadcasts, global music charts,\r\n        and clear sound frequencies in seconds. Tune in, discover new stations,\r\n        and never lose a favorite signal again \u2014 fast, accurate, and built for\r\n        every listener on the dial.\r\n      <\/p>\r\n      <div class=\"rcf-hero__actions\">\r\n        <a href=\"#\" class=\"rcf-btn rcf-btn--primary\">Find my station<\/a>\r\n        <a href=\"#\" class=\"rcf-btn rcf-btn--ghost\">Browse frequencies<\/a>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- tuning dial visual -->\r\n    <div class=\"rcf-hero__dial\">\r\n      <div class=\"rcf-dial-glass\">\r\n\r\n        <!-- EDIT ME: replace this src with your own image later -->\r\n        <img decoding=\"async\"\r\n          class=\"rcf-hero__photo\"\r\n          src=\"https:\/\/placehold.co\/560x560\/12240a\/e8a33d?text=Radio+Photo\"\r\n          alt=\"Radio station photo placeholder\"\r\n        \/>\r\n\r\n        <svg class=\"rcf-dial-svg\" id=\"rcfDialSvg\" viewBox=\"0 0 400 400\" aria-hidden=\"true\">\r\n          <circle class=\"rcf-dial-ring\" cx=\"200\" cy=\"200\" r=\"176\"\/>\r\n          <g class=\"rcf-dial-ticks\" id=\"rcfTicks\"><\/g>\r\n          <g class=\"rcf-dial-needle\" id=\"rcfNeedle\">\r\n            <line x1=\"200\" y1=\"200\" x2=\"200\" y2=\"52\" \/>\r\n            <circle cx=\"200\" cy=\"200\" r=\"7\" \/>\r\n          <\/g>\r\n        <\/svg>\r\n\r\n        <div class=\"rcf-dial-readout\">\r\n          <span id=\"rcfFreq\">101.5<\/span>\r\n          <small>FM \u00b7 ON AIR<\/small>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  #rcfHero, #rcfHero * { box-sizing: border-box; }\r\n\r\n  #rcfHero {\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    overflow: hidden;\r\n    padding: clamp(64px, 9vw, 120px) clamp(20px, 5vw, 72px);\r\n    background:\r\n      radial-gradient(120% 140% at 82% 15%, var(--rcf-bg-overlay), transparent 60%),\r\n      linear-gradient(160deg, var(--rcf-bg-deep) 0%, var(--rcf-bg-mid) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n    isolation: isolate;\r\n  }\r\n\r\n  \/* background broadcast rings *\/\r\n  .rcf-hero__bg { position: absolute; inset: 0; z-index: 0; }\r\n  .rcf-hero__waves { width: 100%; height: 100%; }\r\n  .rcf-wave {\r\n    fill: none;\r\n    stroke: var(--rcf-amber);\r\n    stroke-width: 1;\r\n    opacity: 0.14;\r\n  }\r\n  .rcf-wave--2 { opacity: 0.10; }\r\n  .rcf-wave--3 { opacity: 0.07; }\r\n  .rcf-wave--4 { opacity: 0.045; }\r\n\r\n  .rcf-hero__inner {\r\n    position: relative;\r\n    z-index: 1;\r\n    max-width: 1180px;\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: 1.05fr 0.95fr;\r\n    gap: clamp(32px, 6vw, 64px);\r\n    align-items: center;\r\n  }\r\n\r\n  \/* ---------- glass copy panel ---------- *\/\r\n  .rcf-hero__panel {\r\n    background: rgba(255, 255, 255, 0.055);\r\n    backdrop-filter: blur(22px) saturate(140%);\r\n    -webkit-backdrop-filter: blur(22px) saturate(140%);\r\n    border: 1px solid rgba(244, 239, 226, 0.14);\r\n    border-radius: 26px;\r\n    padding: clamp(28px, 4vw, 46px);\r\n    box-shadow: 0 30px 60px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08);\r\n  }\r\n\r\n  .rcf-hero__title {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(2rem, 3.6vw, 3.1rem);\r\n    line-height: 1.12;\r\n    letter-spacing: -0.01em;\r\n    margin: 0 0 18px;\r\n    max-width: 15ch;\r\n  }\r\n\r\n  .rcf-hero__text {\r\n    font-size: 1.02rem;\r\n    line-height: 1.65;\r\n    color: var(--rcf-muted);\r\n    max-width: 46ch;\r\n    margin: 0 0 30px;\r\n  }\r\n\r\n  .rcf-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }\r\n\r\n  .rcf-btn {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 14px 26px;\r\n    border-radius: 12px;\r\n    font-weight: 600;\r\n    font-size: 0.95rem;\r\n    text-decoration: none;\r\n    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;\r\n  }\r\n  .rcf-btn--primary {\r\n    background: linear-gradient(135deg, var(--rcf-amber), #c97f22);\r\n    color: #17240a;\r\n    box-shadow: 0 10px 28px rgba(232, 163, 61, 0.35);\r\n  }\r\n  .rcf-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(232, 163, 61, 0.5); }\r\n  .rcf-btn--ghost {\r\n    background: rgba(255,255,255,0.06);\r\n    color: var(--rcf-cream);\r\n    border: 1px solid rgba(244,239,226,0.28);\r\n  }\r\n  .rcf-btn--ghost:hover { background: rgba(255,255,255,0.12); transform: translateY(-2px); }\r\n\r\n  \/* ---------- tuning dial ---------- *\/\r\n  .rcf-hero__dial { display: flex; justify-content: center; }\r\n\r\n  .rcf-dial-glass {\r\n    position: relative;\r\n    width: min(420px, 90vw);\r\n    aspect-ratio: 1 \/ 1;\r\n    border-radius: 50%;\r\n    background: rgba(255,255,255,0.05);\r\n    backdrop-filter: blur(14px);\r\n    -webkit-backdrop-filter: blur(14px);\r\n    border: 1px solid rgba(244,239,226,0.16);\r\n    box-shadow: 0 25px 70px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.1);\r\n    display: grid;\r\n    place-items: center;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .rcf-hero__photo {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    opacity: 0.5;\r\n    filter: saturate(85%) contrast(105%);\r\n  }\r\n\r\n  .rcf-dial-svg { position: relative; width: 100%; height: 100%; z-index: 1; }\r\n  .rcf-dial-ring { fill: none; stroke: rgba(244,239,226,0.35); stroke-width: 1.5; }\r\n  .rcf-dial-ticks line { stroke: var(--rcf-amber-soft); stroke-width: 2; opacity: 0.75; }\r\n  .rcf-dial-needle {\r\n    transform-origin: 200px 200px;\r\n    transform: rotate(-35deg);\r\n    transition: transform 0.15s ease-out;\r\n  }\r\n  .rcf-dial-needle line { stroke: var(--rcf-amber); stroke-width: 3; stroke-linecap: round; }\r\n  .rcf-dial-needle circle { fill: var(--rcf-amber); }\r\n\r\n  .rcf-dial-readout {\r\n    position: absolute;\r\n    bottom: 20%;\r\n    text-align: center;\r\n    z-index: 2;\r\n    font-family: 'Space Mono', monospace;\r\n  }\r\n  .rcf-dial-readout span {\r\n    display: block;\r\n    font-size: clamp(1.6rem, 3vw, 2.1rem);\r\n    color: var(--rcf-amber-soft);\r\n    text-shadow: 0 0 18px rgba(232,163,61,0.55);\r\n    letter-spacing: 0.02em;\r\n  }\r\n  .rcf-dial-readout small {\r\n    display: block;\r\n    margin-top: 4px;\r\n    color: var(--rcf-muted);\r\n    font-size: 0.7rem;\r\n    letter-spacing: 0.08em;\r\n  }\r\n\r\n  @media (max-width: 860px) {\r\n    .rcf-hero__inner { grid-template-columns: 1fr; text-align: left; }\r\n    .rcf-hero__dial { order: -1; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-dial-needle, .rcf-btn { transition: none !important; }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  (function () {\r\n    var hero = document.getElementById('rcfHero');\r\n    var ticksGroup = document.getElementById('rcfTicks');\r\n    var needle = document.getElementById('rcfNeedle');\r\n    var waves = document.querySelectorAll('#rcfHero .rcf-wave');\r\n    var freqLabel = document.getElementById('rcfFreq');\r\n    if (!hero) return;\r\n\r\n    \/* draw dial ticks once *\/\r\n    var cx = 200, cy = 200, rOuter = 176, rInner = 158;\r\n    for (var i = 0; i <= 20; i++) {\r\n      var angle = (-125 + i * (250 \/ 20)) * (Math.PI \/ 180);\r\n      var x1 = cx + rOuter * Math.cos(angle);\r\n      var y1 = cy + rOuter * Math.sin(angle);\r\n      var x2 = cx + rInner * Math.cos(angle);\r\n      var y2 = cy + rInner * Math.sin(angle);\r\n      var line = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'line');\r\n      line.setAttribute('x1', x1); line.setAttribute('y1', y1);\r\n      line.setAttribute('x2', x2); line.setAttribute('y2', y2);\r\n      ticksGroup.appendChild(line);\r\n    }\r\n\r\n    var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    var freqs = ['88.3', '91.9', '94.5', '97.1', '101.5', '104.7', '107.9'];\r\n\r\n    \/* scroll-driven dial + parallax \u2014 scoped only to this hero *\/\r\n    function onScroll() {\r\n      if (reduceMotion) return;\r\n      var rect = hero.getBoundingClientRect();\r\n      var vh = window.innerHeight || 800;\r\n      var progress = 1 - Math.min(Math.max((rect.top + rect.height * 0.4) \/ (vh + rect.height * 0.4), 0), 1);\r\n\r\n      var rotation = -35 + progress * 250;\r\n      needle.style.transform = 'rotate(' + rotation + 'deg)';\r\n\r\n      var idx = Math.min(freqs.length - 1, Math.floor(progress * freqs.length));\r\n      if (freqLabel && freqLabel.textContent !== freqs[idx]) freqLabel.textContent = freqs[idx];\r\n\r\n      waves.forEach(function (w, i) {\r\n        var depth = (i + 1) * 6;\r\n        w.setAttribute('transform', 'translateY(' + (progress * depth) + 'px)');\r\n      });\r\n    }\r\n\r\n    window.addEventListener('scroll', onScroll, { passive: true });\r\n    onScroll();\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7f6e473 elementor-widget elementor-widget-html\" data-id=\"7f6e473\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 FEATURES SECTION (\"SIGNAL SPECTRUM\")\r\n     Paste this whole block into its own Elementor \"HTML\" widget,\r\n     placed directly below the hero section.\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-features\" id=\"rcfFeatures\">\r\n\r\n  <div class=\"rcf-features__intro\">\r\n    <h2 class=\"rcf-features__title\">Built around how radio actually works<\/h2>\r\n    <p class=\"rcf-features__text\">\r\n      No clutter, no dead air. Every tool here maps to something a listener\r\n      actually needs \u2014 a frequency, a station, or a sound worth finding.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"rcf-spectrum\">\r\n    <div class=\"rcf-spectrum__baseline\" aria-hidden=\"true\"><\/div>\r\n\r\n    <div class=\"rcf-spectrum__track\">\r\n\r\n      <div class=\"rcf-signal rcf-signal--up\">\r\n        <div class=\"rcf-signal__stem rcf-signal__stem--down\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"rcf-signal__card\" style=\"--delay:0s; --dur:5.4s;\">\r\n          <span class=\"rcf-signal__freq\">88.5<\/span>\r\n          <svg class=\"rcf-signal__icon\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\r\n            <circle cx=\"10\" cy=\"10\" r=\"6.5\" stroke=\"currentColor\" stroke-width=\"1.6\"\/>\r\n            <path d=\"M14.6 14.6L20 20\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/>\r\n            <path d=\"M7 10c0-1.8 1.3-3 3-3\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\"\/>\r\n          <\/svg>\r\n          <h3>Instant frequency search<\/h3>\r\n          <p>Search FM and AM bands by name, location, or frequency \u2014 skip the manual dial scanning entirely.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"rcf-signal rcf-signal--down\">\r\n        <div class=\"rcf-signal__card\" style=\"--delay:0.6s; --dur:6.1s;\">\r\n          <span class=\"rcf-signal__freq\">94.7<\/span>\r\n          <svg class=\"rcf-signal__icon\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\r\n            <rect x=\"3.5\" y=\"6\" width=\"17\" height=\"12\" rx=\"2\" stroke=\"currentColor\" stroke-width=\"1.6\"\/>\r\n            <circle cx=\"9\" cy=\"12\" r=\"2\" stroke=\"currentColor\" stroke-width=\"1.4\"\/>\r\n            <path d=\"M13.5 10h4M13.5 14h4\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\"\/>\r\n          <\/svg>\r\n          <h3>Radio ID lookup<\/h3>\r\n          <p>Enter any station's radio ID to pull up its full profile, coverage area, and current programming.<\/p>\r\n        <\/div>\r\n        <div class=\"rcf-signal__stem rcf-signal__stem--up\" aria-hidden=\"true\"><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"rcf-signal rcf-signal--up\">\r\n        <div class=\"rcf-signal__stem rcf-signal__stem--down\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"rcf-signal__card\" style=\"--delay:0.3s; --dur:5.8s;\">\r\n          <span class=\"rcf-signal__freq\">101.5<\/span>\r\n          <svg class=\"rcf-signal__icon\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\r\n            <path d=\"M5 16V9l9-2v9\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n            <circle cx=\"5\" cy=\"16\" r=\"2.2\" stroke=\"currentColor\" stroke-width=\"1.4\"\/>\r\n            <circle cx=\"14\" cy=\"14.5\" r=\"2.2\" stroke=\"currentColor\" stroke-width=\"1.4\"\/>\r\n          <\/svg>\r\n          <h3>Live music &amp; charts<\/h3>\r\n          <p>Follow trending tracks and live playlists from stations broadcasting right now, updated as songs change.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"rcf-signal rcf-signal--down\">\r\n        <div class=\"rcf-signal__card\" style=\"--delay:0.9s; --dur:5.2s;\">\r\n          <span class=\"rcf-signal__freq\">107.9<\/span>\r\n          <svg class=\"rcf-signal__icon\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\r\n            <path d=\"M5 16v-3M9.5 16V9M14 16v-6M18.5 16v-2\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/>\r\n          <\/svg>\r\n          <h3>Sound quality check<\/h3>\r\n          <p>Preview signal strength and sound clarity for any station before you commit to tuning in.<\/p>\r\n        <\/div>\r\n        <div class=\"rcf-signal__stem rcf-signal__stem--up\" aria-hidden=\"true\"><\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  #rcfFeatures, #rcfFeatures * { box-sizing: border-box; }\r\n\r\n  #rcfFeatures {\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    overflow: hidden;\r\n    padding: clamp(72px, 10vw, 130px) clamp(20px, 5vw, 72px) clamp(160px, 16vw, 220px);\r\n    background:\r\n      radial-gradient(110% 130% at 10% 100%, var(--rcf-bg-overlay), transparent 55%),\r\n      linear-gradient(200deg, var(--rcf-bg-mid) 0%, var(--rcf-bg-deep) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n  }\r\n\r\n  .rcf-features__intro {\r\n    max-width: 620px;\r\n    margin: 0 auto clamp(70px, 8vw, 110px);\r\n    text-align: center;\r\n  }\r\n\r\n  .rcf-features__title {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1.8rem, 3vw, 2.5rem);\r\n    line-height: 1.18;\r\n    letter-spacing: -0.01em;\r\n    margin: 0 0 16px;\r\n  }\r\n\r\n  .rcf-features__text {\r\n    font-size: 1rem;\r\n    line-height: 1.65;\r\n    color: var(--rcf-muted);\r\n    margin: 0 auto;\r\n    max-width: 46ch;\r\n  }\r\n\r\n  \/* ---------- spectrum \/ floating signal cards ---------- *\/\r\n  .rcf-spectrum {\r\n    position: relative;\r\n    max-width: 1180px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .rcf-spectrum__baseline {\r\n    position: absolute;\r\n    left: 0;\r\n    right: 0;\r\n    top: 50%;\r\n    height: 1px;\r\n    background: repeating-linear-gradient(\r\n      90deg,\r\n      rgba(244,239,226,0.4) 0 6px,\r\n      transparent 6px 14px\r\n    );\r\n  }\r\n\r\n  .rcf-spectrum__track {\r\n    position: relative;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    gap: clamp(14px, 2vw, 28px);\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  .rcf-signal {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    width: clamp(210px, 22%, 260px);\r\n  }\r\n  .rcf-signal--up   { margin-top: -78px; }\r\n  .rcf-signal--down { margin-top: 78px; }\r\n\r\n  .rcf-signal__stem {\r\n    width: 1px;\r\n    height: 78px;\r\n    background: repeating-linear-gradient(\r\n      180deg,\r\n      rgba(232,163,61,0.55) 0 5px,\r\n      transparent 5px 10px\r\n    );\r\n  }\r\n\r\n  .rcf-signal__card {\r\n    position: relative;\r\n    width: 100%;\r\n    background: rgba(255,255,255,0.055);\r\n    backdrop-filter: blur(18px) saturate(140%);\r\n    -webkit-backdrop-filter: blur(18px) saturate(140%);\r\n    border: 1px solid rgba(244,239,226,0.14);\r\n    border-radius: 18px;\r\n    padding: 22px 20px;\r\n    box-shadow: 0 20px 45px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.08);\r\n    animation: rcf-float var(--dur, 5.5s) ease-in-out var(--delay, 0s) infinite;\r\n  }\r\n\r\n  .rcf-signal__freq {\r\n    position: absolute;\r\n    top: -11px;\r\n    right: 16px;\r\n    font-family: 'Space Mono', monospace;\r\n    font-size: 0.72rem;\r\n    letter-spacing: 0.04em;\r\n    color: var(--rcf-amber-soft);\r\n    background: var(--rcf-bg-deep);\r\n    padding: 2px 8px;\r\n    border-radius: 20px;\r\n    border: 1px solid rgba(232,163,61,0.4);\r\n  }\r\n\r\n  .rcf-signal__icon {\r\n    width: 26px;\r\n    height: 26px;\r\n    color: var(--rcf-amber);\r\n    margin-bottom: 14px;\r\n  }\r\n\r\n  .rcf-signal__card h3 {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-size: 1.05rem;\r\n    font-weight: 600;\r\n    margin: 0 0 8px;\r\n    color: var(--rcf-cream);\r\n  }\r\n\r\n  .rcf-signal__card p {\r\n    font-size: 0.9rem;\r\n    line-height: 1.55;\r\n    color: var(--rcf-muted);\r\n    margin: 0;\r\n  }\r\n\r\n  @keyframes rcf-float {\r\n    0%, 100% { transform: translateY(0); }\r\n    50%      { transform: translateY(-10px); }\r\n  }\r\n\r\n  @media (max-width: 900px) {\r\n    .rcf-spectrum__baseline { display: none; }\r\n    .rcf-spectrum__track { flex-direction: column; align-items: stretch; }\r\n    .rcf-signal, .rcf-signal--up, .rcf-signal--down {\r\n      width: 100%;\r\n      margin-top: 0;\r\n    }\r\n    .rcf-signal__stem { display: none; }\r\n    .rcf-signal + .rcf-signal { margin-top: 18px; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-signal__card { animation: none; }\r\n  }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d4bafd9 elementor-widget elementor-widget-html\" data-id=\"d4bafd9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 \"HOW IT WORKS\" + \"WHY LISTENERS STAY\"\r\n     Paste this ENTIRE block into ONE Elementor \"HTML\" widget\r\n     (both sections must stay together for the scroll effect to\r\n     connect them \u2014 don't split into two separate widgets).\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-story\" id=\"rcfStory\">\r\n\r\n  <div class=\"rcf-story__inner\">\r\n\r\n    <!-- sticky tuning-rail visual (desktop) -->\r\n    <div class=\"rcf-story__visual\">\r\n      <div class=\"rcf-story__visualcard\">\r\n        <svg class=\"rcf-rail\" viewBox=\"0 0 120 340\" aria-hidden=\"true\">\r\n          <line x1=\"60\" y1=\"20\" x2=\"60\" y2=\"320\" class=\"rcf-rail__line\"\/>\r\n          <circle cx=\"60\" cy=\"20\"  r=\"7\" class=\"rcf-rail__marker\" id=\"rcfMarker1\"\/>\r\n          <circle cx=\"60\" cy=\"320\" r=\"7\" class=\"rcf-rail__marker\" id=\"rcfMarker2\"\/>\r\n          <circle cx=\"60\" cy=\"20\"  r=\"4.5\" class=\"rcf-rail__dot\" id=\"rcfDot\"\/>\r\n        <\/svg>\r\n        <div class=\"rcf-story__freq\">\r\n          <span id=\"rcfStoryFreq\">88.5<\/span>\r\n          <small>MHz \u00b7 tuning in<\/small>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- scroll content -->\r\n    <div class=\"rcf-story__content\">\r\n\r\n      <article class=\"rcf-panel\" id=\"rcfPanel1\">\r\n        <span class=\"rcf-panel__num\">01<\/span>\r\n        <h2>How Radio Code Finder works<\/h2>\r\n        <p>\r\n          Type a station name, frequency, or radio ID into the search bar\r\n          and get instant matches from our full directory. Every result\r\n          includes live status, coverage details, and a direct link to\r\n          start listening. No downloads, no manual tuning, no guesswork \u2014\r\n          just search, select, and the signal is yours in seconds, wherever\r\n          you are.\r\n        <\/p>\r\n      <\/article>\r\n\r\n      <article class=\"rcf-panel\" id=\"rcfPanel2\">\r\n        <span class=\"rcf-panel__num\">02<\/span>\r\n        <h2>Why listeners stick around<\/h2>\r\n        <p>\r\n          Radio Code Finder covers stations across every region and genre,\r\n          updated as broadcasts change so listings never go stale. Search\r\n          history keeps recent stations one tap away, while sound quality\r\n          indicators help you skip weak signals before you tune in. Built\r\n          for quick checks and long listening sessions alike, on any device.\r\n        <\/p>\r\n      <\/article>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- mobile progress bar (replaces sticky rail below 900px) -->\r\n  <div class=\"rcf-story__mobilebar\" aria-hidden=\"true\">\r\n    <div class=\"rcf-story__mobilefill\" id=\"rcfMobileFill\"><\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  #rcfStory, #rcfStory * { box-sizing: border-box; }\r\n\r\n  #rcfStory {\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    background:\r\n      radial-gradient(90% 60% at 50% 0%, var(--rcf-bg-overlay), transparent 60%),\r\n      linear-gradient(190deg, var(--rcf-bg-deep) 0%, var(--rcf-bg-mid) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n    padding: clamp(60px, 8vw, 100px) clamp(20px, 5vw, 72px);\r\n  }\r\n\r\n  .rcf-story__inner {\r\n    max-width: 1180px;\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: 0.8fr 1.2fr;\r\n    gap: clamp(32px, 5vw, 64px);\r\n    align-items: start;\r\n  }\r\n\r\n  \/* ---------- sticky visual ---------- *\/\r\n  .rcf-story__visual { position: sticky; top: clamp(80px, 10vh, 120px); }\r\n\r\n  .rcf-story__visualcard {\r\n    background: rgba(255,255,255,0.05);\r\n    backdrop-filter: blur(18px) saturate(140%);\r\n    -webkit-backdrop-filter: blur(18px) saturate(140%);\r\n    border: 1px solid rgba(244,239,226,0.14);\r\n    border-radius: 22px;\r\n    padding: 34px 24px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    box-shadow: 0 22px 50px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.08);\r\n  }\r\n\r\n  .rcf-rail { width: 70px; height: auto; }\r\n  .rcf-rail__line { stroke: rgba(244,239,226,0.3); stroke-width: 1.5; }\r\n  .rcf-rail__marker {\r\n    fill: var(--rcf-bg-deep);\r\n    stroke: rgba(244,239,226,0.45);\r\n    stroke-width: 1.5;\r\n    transition: stroke 0.3s ease, fill 0.3s ease;\r\n  }\r\n  .rcf-rail__marker.is-active { stroke: var(--rcf-amber); fill: var(--rcf-amber); }\r\n  .rcf-rail__dot {\r\n    fill: var(--rcf-amber);\r\n    filter: drop-shadow(0 0 6px rgba(232,163,61,0.8));\r\n    transition: cy 0.15s linear;\r\n  }\r\n\r\n  .rcf-story__freq {\r\n    margin-top: 20px;\r\n    text-align: center;\r\n    font-family: 'Space Mono', monospace;\r\n  }\r\n  .rcf-story__freq span {\r\n    display: block;\r\n    font-size: 1.6rem;\r\n    color: var(--rcf-amber-soft);\r\n    text-shadow: 0 0 16px rgba(232,163,61,0.5);\r\n  }\r\n  .rcf-story__freq small {\r\n    display: block;\r\n    margin-top: 4px;\r\n    font-size: 0.68rem;\r\n    letter-spacing: 0.06em;\r\n    color: var(--rcf-muted);\r\n  }\r\n\r\n  \/* ---------- content panels ---------- *\/\r\n  .rcf-story__content {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: clamp(60px, 10vw, 140px);\r\n  }\r\n\r\n  .rcf-panel {\r\n    min-height: 58vh;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    background: rgba(255,255,255,0.045);\r\n    backdrop-filter: blur(16px) saturate(130%);\r\n    -webkit-backdrop-filter: blur(16px) saturate(130%);\r\n    border: 1px solid rgba(244,239,226,0.12);\r\n    border-radius: 22px;\r\n    padding: clamp(28px, 4vw, 46px);\r\n    opacity: 0.55;\r\n    filter: brightness(0.85);\r\n    transform: scale(0.985);\r\n    transition: opacity 0.35s ease, filter 0.35s ease, transform 0.35s ease, border-color 0.35s ease;\r\n  }\r\n\r\n  .rcf-panel.is-active {\r\n    opacity: 1;\r\n    filter: brightness(1);\r\n    transform: scale(1);\r\n    border-color: rgba(232,163,61,0.35);\r\n    box-shadow: 0 24px 55px rgba(0,0,0,0.3);\r\n  }\r\n\r\n  .rcf-panel__num {\r\n    font-family: 'Space Mono', monospace;\r\n    font-size: 0.8rem;\r\n    color: var(--rcf-amber);\r\n    letter-spacing: 0.05em;\r\n    margin-bottom: 14px;\r\n    display: inline-block;\r\n  }\r\n\r\n  .rcf-panel h2 {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1.5rem, 2.6vw, 2.15rem);\r\n    line-height: 1.2;\r\n    margin: 0 0 16px;\r\n    max-width: 20ch;\r\n  }\r\n\r\n  .rcf-panel p {\r\n    font-size: 1rem;\r\n    line-height: 1.7;\r\n    color: var(--rcf-muted);\r\n    max-width: 54ch;\r\n    margin: 0;\r\n  }\r\n\r\n  \/* ---------- mobile progress bar ---------- *\/\r\n  .rcf-story__mobilebar {\r\n    display: none;\r\n    position: sticky;\r\n    top: 0;\r\n    height: 3px;\r\n    background: rgba(244,239,226,0.14);\r\n    z-index: 3;\r\n    margin: 0 0 28px;\r\n    border-radius: 3px;\r\n    overflow: hidden;\r\n  }\r\n  .rcf-story__mobilefill {\r\n    height: 100%;\r\n    width: 0%;\r\n    background: linear-gradient(90deg, var(--rcf-amber), var(--rcf-amber-soft));\r\n  }\r\n\r\n  @media (max-width: 900px) {\r\n    .rcf-story__inner { grid-template-columns: 1fr; }\r\n    .rcf-story__visual { display: none; }\r\n    .rcf-story__mobilebar { display: block; }\r\n    .rcf-panel { min-height: auto; opacity: 1; filter: none; transform: none; }\r\n    .rcf-story__content { gap: 24px; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-panel, .rcf-rail__dot { transition: none !important; }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  (function () {\r\n    var story   = document.getElementById('rcfStory');\r\n    var dot     = document.getElementById('rcfDot');\r\n    var marker1 = document.getElementById('rcfMarker1');\r\n    var marker2 = document.getElementById('rcfMarker2');\r\n    var freq    = document.getElementById('rcfStoryFreq');\r\n    var panel1  = document.getElementById('rcfPanel1');\r\n    var panel2  = document.getElementById('rcfPanel2');\r\n    var mobileFill = document.getElementById('rcfMobileFill');\r\n    if (!story) return;\r\n\r\n    var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    var railTop = 20, railBottom = 320;\r\n    var startFreq = 88.5, endFreq = 107.9;\r\n    var ticking = false;\r\n\r\n    function update() {\r\n      ticking = false;\r\n      var rect = story.getBoundingClientRect();\r\n      var vh = window.innerHeight || 800;\r\n      var total = rect.height - vh;\r\n      var progress = total > 0 ? (-rect.top) \/ total : 0;\r\n      progress = Math.min(Math.max(progress, 0), 1);\r\n\r\n      var y = railTop + progress * (railBottom - railTop);\r\n      dot.setAttribute('cy', y.toFixed(1));\r\n\r\n      var currentFreq = (startFreq + progress * (endFreq - startFreq)).toFixed(1);\r\n      if (freq) freq.textContent = currentFreq;\r\n\r\n      var p1active = progress < 0.55;\r\n      var p2active = progress >= 0.45;\r\n      if (panel1) panel1.classList.toggle('is-active', p1active);\r\n      if (panel2) panel2.classList.toggle('is-active', p2active);\r\n      if (marker1) marker1.classList.toggle('is-active', progress < 0.5);\r\n      if (marker2) marker2.classList.toggle('is-active', progress >= 0.5);\r\n\r\n      if (mobileFill) mobileFill.style.width = (progress * 100).toFixed(1) + '%';\r\n    }\r\n\r\n    function onScroll() {\r\n      if (!ticking) {\r\n        ticking = true;\r\n        requestAnimationFrame(update);\r\n      }\r\n    }\r\n\r\n    window.addEventListener('scroll', onScroll, { passive: true });\r\n    window.addEventListener('resize', onScroll);\r\n    update();\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1a343c0 elementor-widget elementor-widget-html\" data-id=\"1a343c0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 ABOUT SECTION\r\n     Paste this whole block into its own Elementor \"HTML\" widget.\r\n     Effect here is cursor-driven (spotlight + tilt), not scroll-based.\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-about\" id=\"rcfAbout\">\r\n  <div class=\"rcf-about__glow\" id=\"rcfGlow\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"rcf-about__inner\">\r\n\r\n    <div class=\"rcf-about__panel\" id=\"rcfAboutPanel\">\r\n      <h2 class=\"rcf-about__title\">One search, every frequency on earth<\/h2>\r\n      <p class=\"rcf-about__text\">\r\n        Radio Code Finder started with a simple problem \u2014 dialing through\r\n        static to find a station that used to just work. Today it indexes\r\n        stations from small community broadcasts to major networks, keeping\r\n        frequency, coverage, and radio ID data current as stations change.\r\n        Behind every search sits a growing directory built for accuracy\r\n        first: no dead links, no outdated call signs, no guessing which\r\n        frequency actually plays. Whether you're chasing a local FM signal\r\n        or exploring stations across the globe, the goal stays the same \u2014\r\n        get you listening faster than the dial ever could, on any device,\r\n        anywhere.\r\n      <\/p>\r\n      <a href=\"#\" class=\"rcf-about__cta\">Explore the directory<\/a>\r\n    <\/div>\r\n\r\n    <div class=\"rcf-about__eq\" aria-hidden=\"true\">\r\n      <span><\/span><span><\/span><span><\/span><span><\/span>\r\n      <span><\/span><span><\/span><span><\/span><span><\/span>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  #rcfAbout, #rcfAbout * { box-sizing: border-box; }\r\n\r\n  #rcfAbout {\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    overflow: hidden;\r\n    background:\r\n      radial-gradient(100% 120% at 90% 90%, var(--rcf-bg-overlay), transparent 55%),\r\n      linear-gradient(200deg, var(--rcf-bg-deep) 0%, var(--rcf-bg-mid) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n    padding: clamp(64px, 9vw, 120px) clamp(20px, 5vw, 72px);\r\n  }\r\n\r\n  \/* cursor-following spotlight *\/\r\n  .rcf-about__glow {\r\n    position: absolute;\r\n    inset: 0;\r\n    z-index: 0;\r\n    pointer-events: none;\r\n    background: radial-gradient(\r\n      420px circle at var(--rcf-x, 50%) var(--rcf-y, 30%),\r\n      rgba(232, 163, 61, 0.16),\r\n      transparent 70%\r\n    );\r\n    transition: background 0.05s linear;\r\n  }\r\n\r\n  .rcf-about__inner {\r\n    position: relative;\r\n    z-index: 1;\r\n    max-width: 1180px;\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: 1.3fr 0.7fr;\r\n    gap: clamp(32px, 6vw, 64px);\r\n    align-items: center;\r\n  }\r\n\r\n  \/* ---------- glass panel with tilt ---------- *\/\r\n  .rcf-about__panel {\r\n    background: rgba(255,255,255,0.055);\r\n    backdrop-filter: blur(20px) saturate(140%);\r\n    -webkit-backdrop-filter: blur(20px) saturate(140%);\r\n    border: 1px solid rgba(244,239,226,0.14);\r\n    border-radius: 24px;\r\n    padding: clamp(30px, 4.5vw, 50px);\r\n    box-shadow: 0 26px 60px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.08);\r\n    transform: perspective(900px) rotateX(0deg) rotateY(0deg);\r\n    transition: transform 0.25s ease-out;\r\n    will-change: transform;\r\n  }\r\n\r\n  .rcf-about__title {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1.7rem, 3vw, 2.4rem);\r\n    line-height: 1.2;\r\n    letter-spacing: -0.01em;\r\n    margin: 0 0 18px;\r\n    max-width: 22ch;\r\n  }\r\n\r\n  .rcf-about__text {\r\n    font-size: 1rem;\r\n    line-height: 1.72;\r\n    color: var(--rcf-muted);\r\n    max-width: 62ch;\r\n    margin: 0 0 26px;\r\n  }\r\n\r\n  .rcf-about__cta {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    color: var(--rcf-amber-soft);\r\n    text-decoration: none;\r\n    font-weight: 600;\r\n    font-size: 0.95rem;\r\n    border-bottom: 1px solid rgba(232,163,61,0.4);\r\n    padding-bottom: 3px;\r\n    transition: border-color 0.25s ease, color 0.25s ease;\r\n  }\r\n  .rcf-about__cta:hover { color: var(--rcf-amber); border-color: var(--rcf-amber); }\r\n\r\n  \/* ---------- ambient equalizer (not scroll-linked) ---------- *\/\r\n  .rcf-about__eq {\r\n    display: flex;\r\n    align-items: flex-end;\r\n    justify-content: center;\r\n    gap: clamp(6px, 1.2vw, 12px);\r\n    height: clamp(140px, 22vw, 220px);\r\n  }\r\n\r\n  .rcf-about__eq span {\r\n    display: block;\r\n    width: clamp(8px, 1.6vw, 14px);\r\n    border-radius: 6px;\r\n    background: linear-gradient(180deg, var(--rcf-amber-soft), var(--rcf-amber));\r\n    box-shadow: 0 0 14px rgba(232,163,61,0.35);\r\n    animation: rcf-eq 1.8s ease-in-out infinite;\r\n  }\r\n\r\n  .rcf-about__eq span:nth-child(1) { height: 35%; animation-duration: 1.6s; animation-delay: 0s; }\r\n  .rcf-about__eq span:nth-child(2) { height: 70%; animation-duration: 2.1s; animation-delay: 0.15s; }\r\n  .rcf-about__eq span:nth-child(3) { height: 45%; animation-duration: 1.4s; animation-delay: 0.3s; }\r\n  .rcf-about__eq span:nth-child(4) { height: 90%; animation-duration: 2.4s; animation-delay: 0.05s; }\r\n  .rcf-about__eq span:nth-child(5) { height: 55%; animation-duration: 1.9s; animation-delay: 0.25s; }\r\n  .rcf-about__eq span:nth-child(6) { height: 80%; animation-duration: 1.5s; animation-delay: 0.1s; }\r\n  .rcf-about__eq span:nth-child(7) { height: 40%; animation-duration: 2.2s; animation-delay: 0.35s; }\r\n  .rcf-about__eq span:nth-child(8) { height: 65%; animation-duration: 1.7s; animation-delay: 0.2s; }\r\n\r\n  @keyframes rcf-eq {\r\n    0%, 100% { transform: scaleY(0.55); }\r\n    50%      { transform: scaleY(1); }\r\n  }\r\n\r\n  @media (max-width: 900px) {\r\n    .rcf-about__inner { grid-template-columns: 1fr; text-align: left; }\r\n    .rcf-about__eq { order: -1; height: 110px; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-about__panel { transition: none; }\r\n    .rcf-about__eq span { animation: none; transform: scaleY(0.75); }\r\n  }\r\n\r\n  @media (pointer: coarse) {\r\n    .rcf-about__panel { transform: none !important; }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  (function () {\r\n    var section = document.getElementById('rcfAbout');\r\n    var glow = document.getElementById('rcfGlow');\r\n    var panel = document.getElementById('rcfAboutPanel');\r\n    if (!section || !glow || !panel) return;\r\n\r\n    var isFinePointer = window.matchMedia('(pointer: fine)').matches;\r\n    var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    if (!isFinePointer || reduceMotion) return;\r\n\r\n    section.addEventListener('mousemove', function (e) {\r\n      var rect = section.getBoundingClientRect();\r\n      var xPct = ((e.clientX - rect.left) \/ rect.width) * 100;\r\n      var yPct = ((e.clientY - rect.top) \/ rect.height) * 100;\r\n      glow.style.setProperty('--rcf-x', xPct + '%');\r\n      glow.style.setProperty('--rcf-y', yPct + '%');\r\n\r\n      var pRect = panel.getBoundingClientRect();\r\n      var px = (e.clientX - pRect.left) \/ pRect.width - 0.5;\r\n      var py = (e.clientY - pRect.top) \/ pRect.height - 0.5;\r\n      var rotateY = px * 6;\r\n      var rotateX = py * -6;\r\n      panel.style.transform = 'perspective(900px) rotateX(' + rotateX + 'deg) rotateY(' + rotateY + 'deg)';\r\n    });\r\n\r\n    section.addEventListener('mouseleave', function () {\r\n      panel.style.transform = 'perspective(900px) rotateX(0deg) rotateY(0deg)';\r\n    });\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-63d558d elementor-widget elementor-widget-html\" data-id=\"63d558d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 \"HOW IT WORKS\" SECTION\r\n     Paste this whole block into its own Elementor \"HTML\" widget,\r\n     placed directly below the features section.\r\n     Same color system as hero\/about\/features (edit the tokens once\r\n     at the top of the <style> block if the brand palette changes).\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-how\" id=\"rcfHow\">\r\n\r\n  <div class=\"rcf-how__intro\">\r\n    <h2 class=\"rcf-how__title\">From dead air to on air, in three steps<\/h2>\r\n    <p class=\"rcf-how__text\">\r\n      No app to install, no manual dial-turning. Type what you're after and\r\n      Radio Code Finder does the scanning for you.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"rcf-how__scan\" aria-hidden=\"true\">\r\n    <div class=\"rcf-how__scanline\" id=\"rcfScanline\"><\/div>\r\n  <\/div>\r\n\r\n  <ol class=\"rcf-how__steps\">\r\n\r\n    <li class=\"rcf-how__step\">\r\n      <div class=\"rcf-how__marker\">01<\/div>\r\n      <div class=\"rcf-how__body\">\r\n        <h3>Type a name, place, or frequency<\/h3>\r\n        <p>\r\n          Search \"jazz stations Chicago,\" a call sign, or straight-up\r\n          \"98.7\" \u2014 Radio Code Finder matches whatever you type against\r\n          its station index.\r\n        <\/p>\r\n      <\/div>\r\n    <\/li>\r\n\r\n    <li class=\"rcf-how__step\">\r\n      <div class=\"rcf-how__marker\">02<\/div>\r\n      <div class=\"rcf-how__body\">\r\n        <h3>Compare stations side by side<\/h3>\r\n        <p>\r\n          See coverage area, current genre, and radio ID for every match\r\n          at once, so you can pick the signal that actually fits before\r\n          you tune anything.\r\n        <\/p>\r\n      <\/div>\r\n    <\/li>\r\n\r\n    <li class=\"rcf-how__step\">\r\n      <div class=\"rcf-how__marker\">03<\/div>\r\n      <div class=\"rcf-how__body\">\r\n        <h3>Tune in and save it for next time<\/h3>\r\n        <p>\r\n          Lock in the station's frequency or radio ID, and keep it in\r\n          your list so you're never hunting through static for the same\r\n          signal twice.\r\n        <\/p>\r\n      <\/div>\r\n    <\/li>\r\n\r\n  <\/ol>\r\n\r\n  <div class=\"rcf-how__strip\">\r\n    <div class=\"rcf-how__stat\">\r\n      <span class=\"rcf-how__stat-num\">FM \u00b7 AM<\/span>\r\n      <span class=\"rcf-how__stat-label\">Both bands covered<\/span>\r\n    <\/div>\r\n    <div class=\"rcf-how__stat\">\r\n      <span class=\"rcf-how__stat-num\">Live<\/span>\r\n      <span class=\"rcf-how__stat-label\">Programming updates as it airs<\/span>\r\n    <\/div>\r\n    <div class=\"rcf-how__stat\">\r\n      <span class=\"rcf-how__stat-num\">Any device<\/span>\r\n      <span class=\"rcf-how__stat-label\">No install, works in the browser<\/span>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n  #rcfHow, #rcfHow * { box-sizing: border-box; }\r\n\r\n  #rcfHow {\r\n    \/* same tokens as hero \/ about \/ features \u2014 keep in sync *\/\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    overflow: hidden;\r\n    padding: clamp(64px, 9vw, 120px) clamp(20px, 5vw, 72px);\r\n    background:\r\n      radial-gradient(90% 110% at 50% 0%, var(--rcf-bg-overlay), transparent 55%),\r\n      linear-gradient(180deg, var(--rcf-bg-deep) 0%, var(--rcf-bg-mid) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n  }\r\n\r\n  .rcf-how__intro {\r\n    max-width: 560px;\r\n    margin: 0 auto clamp(48px, 6vw, 76px);\r\n    text-align: center;\r\n  }\r\n\r\n  .rcf-how__title {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1.8rem, 3vw, 2.5rem);\r\n    line-height: 1.18;\r\n    letter-spacing: -0.01em;\r\n    margin: 0 0 16px;\r\n  }\r\n\r\n  .rcf-how__text {\r\n    font-size: 1rem;\r\n    line-height: 1.65;\r\n    color: var(--rcf-muted);\r\n    margin: 0 auto;\r\n    max-width: 44ch;\r\n  }\r\n\r\n  \/* ---------- ambient scanning line ---------- *\/\r\n  .rcf-how__scan {\r\n    position: relative;\r\n    max-width: 1180px;\r\n    height: 1px;\r\n    margin: 0 auto clamp(40px, 5vw, 60px);\r\n    background: rgba(244,239,226,0.12);\r\n    overflow: hidden;\r\n  }\r\n\r\n  .rcf-how__scanline {\r\n    position: absolute;\r\n    top: 0;\r\n    left: -18%;\r\n    width: 18%;\r\n    height: 100%;\r\n    background: linear-gradient(90deg, transparent, var(--rcf-amber-soft), transparent);\r\n    animation: rcf-scan 4.5s ease-in-out infinite;\r\n  }\r\n\r\n  @keyframes rcf-scan {\r\n    0%   { left: -18%; }\r\n    50%  { left: 100%; }\r\n    100% { left: -18%; }\r\n  }\r\n\r\n  \/* ---------- numbered steps ---------- *\/\r\n  .rcf-how__steps {\r\n    list-style: none;\r\n    margin: 0 auto;\r\n    padding: 0;\r\n    max-width: 1180px;\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 1fr);\r\n    gap: clamp(20px, 3vw, 40px);\r\n    counter-reset: rcf-step;\r\n  }\r\n\r\n  .rcf-how__step {\r\n    position: relative;\r\n    padding-top: clamp(48px, 6vw, 64px);\r\n    border-top: 1px solid rgba(244,239,226,0.16);\r\n  }\r\n\r\n  .rcf-how__marker {\r\n    position: absolute;\r\n    top: -0.62em;\r\n    left: 0;\r\n    font-family: 'Space Mono', monospace;\r\n    font-size: 0.85rem;\r\n    letter-spacing: 0.04em;\r\n    color: var(--rcf-bg-deep);\r\n    background: linear-gradient(135deg, var(--rcf-amber-soft), var(--rcf-amber));\r\n    width: 34px;\r\n    height: 34px;\r\n    border-radius: 50%;\r\n    display: grid;\r\n    place-items: center;\r\n    box-shadow: 0 8px 20px rgba(232,163,61,0.35);\r\n  }\r\n\r\n  .rcf-how__body h3 {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: 1.15rem;\r\n    line-height: 1.3;\r\n    margin: 0 0 10px;\r\n    color: var(--rcf-cream);\r\n    max-width: 22ch;\r\n  }\r\n\r\n  .rcf-how__body p {\r\n    font-size: 0.94rem;\r\n    line-height: 1.6;\r\n    color: var(--rcf-muted);\r\n    margin: 0;\r\n    max-width: 34ch;\r\n  }\r\n\r\n  \/* ---------- bottom fact strip ---------- *\/\r\n  .rcf-how__strip {\r\n    max-width: 1180px;\r\n    margin: clamp(56px, 7vw, 88px) auto 0;\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n    gap: clamp(28px, 5vw, 64px);\r\n    padding-top: clamp(32px, 4vw, 44px);\r\n    border-top: 1px solid rgba(244,239,226,0.14);\r\n  }\r\n\r\n  .rcf-how__stat {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n    gap: 6px;\r\n  }\r\n\r\n  .rcf-how__stat-num {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: 1.3rem;\r\n    color: var(--rcf-amber-soft);\r\n  }\r\n\r\n  .rcf-how__stat-label {\r\n    font-size: 0.82rem;\r\n    color: var(--rcf-muted);\r\n    max-width: 20ch;\r\n  }\r\n\r\n  @media (max-width: 860px) {\r\n    .rcf-how__steps { grid-template-columns: 1fr; }\r\n    .rcf-how__body h3, .rcf-how__body p { max-width: none; }\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-how__scanline { animation: none; left: 40%; }\r\n  }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d72e92 elementor-widget elementor-widget-html\" data-id=\"2d72e92\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     RADIO CODE FINDER \u2014 FAQ SECTION\r\n     Paste this whole block into its own Elementor \"HTML\" widget,\r\n     placed directly below the \"how it works\" section (last section\r\n     on the page). Same color tokens as hero\/about\/features\/how.\r\n     Accordion works with plain HTML <details>\/<summary> \u2014 no\r\n     dependency on Elementor's own accordion widget.\r\n     ============================================================ -->\r\n\r\n<section class=\"rcf-faq\" id=\"rcfFaq\">\r\n\r\n  <div class=\"rcf-faq__inner\">\r\n\r\n    <div class=\"rcf-faq__intro\">\r\n      <h2 class=\"rcf-faq__title\">Questions people actually ask<\/h2>\r\n      <p class=\"rcf-faq__text\">\r\n        Still not sure how something works? Here's what most listeners want\r\n        to know before they start searching.\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <div class=\"rcf-faq__list\">\r\n\r\n      <details class=\"rcf-faq__item\" open>\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>What exactly is a radio ID?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            A radio ID is the unique code a station uses to identify itself\r\n            on air and in broadcast directories. Enter one into Radio Code\r\n            Finder and you'll get that station's frequency, coverage area,\r\n            and current programming instead of hunting through the dial.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details class=\"rcf-faq__item\">\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>Does this work for AM stations too, or just FM?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            Both. The search covers FM and AM bands the same way, so a\r\n            frequency, a call sign, or a station name will surface a match\r\n            regardless of which band it broadcasts on.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details class=\"rcf-faq__item\">\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>Can I find a station if I only know roughly where it broadcasts?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            Yes. Search by city, region, or general location and you'll get\r\n            every station with coverage there, sorted so the strongest\r\n            local signals show up first.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details class=\"rcf-faq__item\">\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>How current is the frequency and programming data?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            Station listings are checked on a rolling basis so frequencies,\r\n            coverage, and call signs stay accurate. Programming and track\r\n            info update continuously as stations broadcast, so what you see\r\n            reflects what's actually airing.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details class=\"rcf-faq__item\">\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>Do I need to install anything to use it?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            No. Radio Code Finder runs in the browser on any device \u2014 phone,\r\n            tablet, or desktop \u2014 so there's nothing to download before you\r\n            can start searching.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details class=\"rcf-faq__item\">\r\n        <summary class=\"rcf-faq__q\">\r\n          <span>What if the station I'm looking for isn't listed?<\/span>\r\n          <span class=\"rcf-faq__toggle\" aria-hidden=\"true\"><\/span>\r\n        <\/summary>\r\n        <div class=\"rcf-faq__a\">\r\n          <p>\r\n            The directory keeps growing as more stations are added and\r\n            verified. If a search comes up empty, try the frequency or call\r\n            sign directly \u2014 it often catches stations that a name search\r\n            misses.\r\n          <\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  #rcfFaq, #rcfFaq * { box-sizing: border-box; }\r\n\r\n  #rcfFaq {\r\n    \/* same tokens as hero \/ about \/ features \/ how-it-works \u2014 keep in sync *\/\r\n    --rcf-bg-deep: #0e1f08;\r\n    --rcf-bg-mid: #215f01;\r\n    --rcf-bg-overlay: #215F0185;\r\n    --rcf-amber: #e8a33d;\r\n    --rcf-amber-soft: #f4c874;\r\n    --rcf-cream: #f4efe2;\r\n    --rcf-muted: #bccaa9;\r\n\r\n    position: relative;\r\n    overflow: hidden;\r\n    padding: clamp(64px, 9vw, 120px) clamp(20px, 5vw, 72px);\r\n    background:\r\n      radial-gradient(90% 110% at 50% 100%, var(--rcf-bg-overlay), transparent 55%),\r\n      linear-gradient(200deg, var(--rcf-bg-mid) 0%, var(--rcf-bg-deep) 100%);\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n    color: var(--rcf-cream);\r\n  }\r\n\r\n  .rcf-faq__inner {\r\n    position: relative;\r\n    z-index: 1;\r\n    max-width: 880px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .rcf-faq__intro {\r\n    max-width: 560px;\r\n    margin: 0 auto clamp(44px, 6vw, 68px);\r\n    text-align: center;\r\n  }\r\n\r\n  .rcf-faq__title {\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1.8rem, 3vw, 2.5rem);\r\n    line-height: 1.18;\r\n    letter-spacing: -0.01em;\r\n    margin: 0 0 16px;\r\n  }\r\n\r\n  .rcf-faq__text {\r\n    font-size: 1rem;\r\n    line-height: 1.65;\r\n    color: var(--rcf-muted);\r\n    margin: 0 auto;\r\n    max-width: 44ch;\r\n  }\r\n\r\n  \/* ---------- accordion list ---------- *\/\r\n  .rcf-faq__list {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 14px;\r\n  }\r\n\r\n  .rcf-faq__item {\r\n    background: rgba(255,255,255,0.055);\r\n    backdrop-filter: blur(18px) saturate(140%);\r\n    -webkit-backdrop-filter: blur(18px) saturate(140%);\r\n    border: 1px solid rgba(244,239,226,0.14);\r\n    border-radius: 16px;\r\n    overflow: hidden;\r\n    transition: border-color 0.25s ease;\r\n  }\r\n\r\n  .rcf-faq__item[open] {\r\n    border-color: rgba(232,163,61,0.4);\r\n  }\r\n\r\n  .rcf-faq__q {\r\n    list-style: none;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 16px;\r\n    padding: 20px 22px;\r\n    cursor: pointer;\r\n    font-family: 'Space Grotesk', 'Inter', sans-serif;\r\n    font-weight: 600;\r\n    font-size: 1rem;\r\n    line-height: 1.4;\r\n    color: var(--rcf-cream);\r\n  }\r\n\r\n  .rcf-faq__q::-webkit-details-marker { display: none; }\r\n\r\n  .rcf-faq__toggle {\r\n    position: relative;\r\n    flex-shrink: 0;\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n  .rcf-faq__toggle::before,\r\n  .rcf-faq__toggle::after {\r\n    content: '';\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    background: var(--rcf-amber-soft);\r\n    transition: transform 0.25s ease, opacity 0.25s ease;\r\n  }\r\n  .rcf-faq__toggle::before {\r\n    width: 12px;\r\n    height: 1.6px;\r\n    transform: translate(-50%, -50%);\r\n  }\r\n  .rcf-faq__toggle::after {\r\n    width: 1.6px;\r\n    height: 12px;\r\n    transform: translate(-50%, -50%);\r\n  }\r\n  .rcf-faq__item[open] .rcf-faq__toggle::after {\r\n    transform: translate(-50%, -50%) rotate(90deg);\r\n    opacity: 0;\r\n  }\r\n\r\n  .rcf-faq__a {\r\n    padding: 0 22px 22px;\r\n  }\r\n\r\n  .rcf-faq__a p {\r\n    margin: 0;\r\n    font-size: 0.94rem;\r\n    line-height: 1.65;\r\n    color: var(--rcf-muted);\r\n    max-width: 62ch;\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .rcf-faq__item, .rcf-faq__toggle::before, .rcf-faq__toggle::after {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Find any radio station in seconds Search thousands of FM and AM stations by name, frequency, or radio ID. Radio Code Finder connects you to live broadcasts, global music charts, and clear sound frequencies in seconds. Tune in, discover new stations, and never lose a favorite signal again \u2014 fast, accurate, and built for every [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-5","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/pages\/5","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5"}],"version-history":[{"count":10,"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions"}],"predecessor-version":[{"id":19,"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions\/19"}],"wp:attachment":[{"href":"https:\/\/radiosubscriiptiionservices.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}