It looks like this is a web page, not a feed. I looked for a feed associated with this page, but couldn't find one. Please enter the address of your feed to validate.

Source: https://thescoove.africa

  1. <!doctype html>
  2. <html lang="en" class="scroll-smooth">
  3.  <head>
  4.    <meta charset="UTF-8" />
  5.    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6.    <title>The Scoove Africa | Premium A&R Services in Nigeria</title>
  7.    <link rel="preconnect" href="https://fonts.googleapis.com" />
  8.    <link rel="icon" type="image/x-icon" href="/assests/scoove.png" />
  9.    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  10.    <link
  11.      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;1,500;1,600&display=swap"
  12.      rel="stylesheet"
  13.    />
  14.    <script src="https://cdn.tailwindcss.com"></script>
  15.    <link rel="stylesheet" href="css/main.css" />
  16.  
  17.    <style>
  18.      /* Mobile menu styles */
  19.      #mobile-menu {
  20.        transform: translateY(-100%);
  21.        transition: transform 0.3s ease-in-out;
  22.        opacity: 0;
  23.        pointer-events: none;
  24.      }
  25.  
  26.      #mobile-menu.active {
  27.        transform: translateY(0);
  28.        opacity: 1;
  29.        pointer-events: auto;
  30.      }
  31.  
  32.      .hamburger-line {
  33.        transition: all 0.3s ease;
  34.      }
  35.  
  36.      .hamburger.active .hamburger-line:nth-child(1) {
  37.        transform: rotate(45deg) translate(6px, 6px);
  38.      }
  39.  
  40.      .hamburger.active .hamburger-line:nth-child(2) {
  41.        opacity: 0;
  42.      }
  43.  
  44.      .hamburger.active .hamburger-line:nth-child(3) {
  45.        transform: rotate(-45deg) translate(6px, -6px);
  46.      }
  47.  
  48.      /* header z-index to be above content */
  49.      header {
  50.        z-index: 50 !important;
  51.      }
  52.  
  53.      /* hero section padding for mobile */
  54.      @media (max-width: 768px) {
  55.        main section {
  56.          padding-top: 100px !important;
  57.        }
  58.      }
  59.    </style>
  60.  
  61.    <script
  62.      type="module"
  63.      async
  64.      src="https://static.rocket.new/rocket-web.js?_cfg=https%3A%2F%2Farshowcase2037back.builtwithrocket.new&_be=https%3A%2F%2Fappanalytics.rocket.new&_v=0.1.14"
  65.    ></script>
  66.    <script
  67.      type="module"
  68.      defer
  69.      src="https://static.rocket.new/rocket-shot.js?v=0.0.2"
  70.    ></script>
  71.  </head>
  72.  <body
  73.    class="antialiased selection:bg-green-500/30 selection:text-zinc-200 text-white bg-black"
  74.  >
  75.    <!-- Background -->
  76.    <div class="fixed inset-0 -z-10">
  77.      <div
  78.        class="absolute inset-0 bg-gradient-to-br from-zinc-950 via-zinc-900/50 to-zinc-950"
  79.      ></div>
  80.      <div
  81.        class="absolute inset-0 bg-gradient-to-b from-transparent via-zinc-950/20 to-zinc-950"
  82.      ></div>
  83.      <div
  84.        class="pointer-events-none absolute inset-0 opacity-20"
  85.        style="
  86.          background-image: url(&quot;data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' /%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.4'/%3E%3C/svg%3E&quot;);
  87.        "
  88.      ></div>
  89.    </div>
  90.  
  91.    <!-- Navigation -->
  92.    <header
  93.      class="fixed top-0 inset-x-0 z-40 transition animate-[slideInBlur_0.8s_ease-out_0.2s_forwards] bg-zinc-950/40 border-white/10 border-b blur-sm backdrop-blur translate-y-[-20px]"
  94.    >
  95.      <div class="max-w-7xl mx-auto px-6">
  96.        <div class="mt-4">
  97.          <div class="flex items-center justify-between pb-4">
  98.            <a href="#" class="flex items-center gap-3 group">
  99.              <img
  100.                src="/assests/logo_transparent.png"
  101.                alt="The Scoove Africa Logo"
  102.                class="h-14 w-auto"
  103.              />
  104.            </a>
  105.  
  106.            <nav
  107.              class="hidden md:flex gap-1 px-2 bg-zinc-900/40 border-white/10 border rounded-full p-1 items-center"
  108.            >
  109.              <a
  110.                class="px-4 py-2 rounded-full transition hover:text-white text-sm font-medium text-zinc-400 hover:bg-white/5"
  111.                href="#services"
  112.                >Services</a
  113.              >
  114.              <a
  115.                class="px-4 py-2 rounded-full transition hover:text-white text-sm font-medium text-zinc-400 hover:bg-white/5"
  116.                href="#success"
  117.                >Success Stories</a
  118.              >
  119.              <a
  120.                class="px-4 py-2 rounded-full transition hover:text-white text-sm font-medium text-zinc-400 hover:bg-white/5"
  121.                href="#process"
  122.                >How It Works</a
  123.              >
  124.              <a
  125.                href="https://the-scoove-africa-ar-ele-77bb3fj.gamma.site/"
  126.                class="px-4 py-2 rounded-full transition hover:text-white text-sm font-medium text-zinc-400 hover:bg-white/5"
  127.                target="_blank"
  128.                rel="noopener noreferrer"
  129.                >Pricing</a
  130.              >
  131.              <a class='px-4 py-2 rounded-full transition hover:text-white text-sm font-medium text-zinc-400 hover:bg-white/5' href='/blog'>Blog</a
  132.              >
  133.            </nav>
  134.  
  135.            <div class="flex items-center gap-2">
  136.              <!-- Desktop CTA -->
  137.              <a
  138.                href="https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header"
  139.                class="hidden sm:inline-flex items-center gap-2 rounded-full border px-5 py-2 text-sm font-medium shadow-[inset_0_1px_0_0_rgba(255,255,255,0.08)] transition border-white/10 bg-white text-zinc-950 hover:bg-zinc-200"
  140.                target="_blank"
  141.                rel="noopener noreferrer"
  142.              >
  143.                Get Started
  144.              </a>
  145.  
  146.              <!-- Mobile Hamburger Menu Button -->
  147.              <button
  148.                id="mobile-menu-button"
  149.                class="md:hidden hamburger w-10 h-10 relative flex flex-col items-center justify-center gap-1.5"
  150.                aria-label="Toggle menu"
  151.              >
  152.                <span
  153.                  class="hamburger-line w-6 h-0.5 bg-white rounded-full"
  154.                ></span>
  155.                <span
  156.                  class="hamburger-line w-6 h-0.5 bg-white rounded-full"
  157.                ></span>
  158.                <span
  159.                  class="hamburger-line w-6 h-0.5 bg-white rounded-full"
  160.                ></span>
  161.              </button>
  162.            </div>
  163.          </div>
  164.        </div>
  165.      </div>
  166.    </header>
  167.  
  168.    <!-- Mobile Navigation Menu -->
  169.    <div
  170.      id="mobile-menu"
  171.      class="mobile-menu fixed inset-x-0 top-[76px] z-40 md:hidden bg-zinc-950/95 backdrop-blur-xl border-b border-white/10"
  172.    >
  173.      <div class="px-4 py-6 space-y-4">
  174.        <a
  175.          href="#services"
  176.          class="flex items-center justify-between py-3 text-base font-medium text-white border-b border-white/10"
  177.          onclick="closeMobileMenu()"
  178.        >
  179.          Services
  180.          <svg
  181.            xmlns="http://www.w3.org/2000/svg"
  182.            width="20"
  183.            height="20"
  184.            viewBox="0 0 24 24"
  185.            fill="none"
  186.            stroke="currentColor"
  187.            stroke-width="2"
  188.            stroke-linecap="round"
  189.            stroke-linejoin="round"
  190.          >
  191.            <path d="M5 12h14M12 5l7 7-7 7" />
  192.          </svg>
  193.        </a>
  194.        <a
  195.          href="#success"
  196.          class="flex items-center justify-between py-3 text-base font-medium text-white border-b border-white/10"
  197.          onclick="closeMobileMenu()"
  198.        >
  199.          Success Stories
  200.          <svg
  201.            xmlns="http://www.w3.org/2000/svg"
  202.            width="20"
  203.            height="20"
  204.            viewBox="0 0 24 24"
  205.            fill="none"
  206.            stroke="currentColor"
  207.            stroke-width="2"
  208.            stroke-linecap="round"
  209.            stroke-linejoin="round"
  210.          >
  211.            <path d="M5 12h14M12 5l7 7-7 7" />
  212.          </svg>
  213.        </a>
  214.        <a
  215.          href="#process"
  216.          class="flex items-center justify-between py-3 text-base font-medium text-white border-b border-white/10"
  217.          onclick="closeMobileMenu()"
  218.        >
  219.          How It Works
  220.          <svg
  221.            xmlns="http://www.w3.org/2000/svg"
  222.            width="20"
  223.            height="20"
  224.            viewBox="0 0 24 24"
  225.            fill="none"
  226.            stroke="currentColor"
  227.            stroke-width="2"
  228.            stroke-linecap="round"
  229.            stroke-linejoin="round"
  230.          >
  231.            <path d="M5 12h14M12 5l7 7-7 7" />
  232.          </svg>
  233.        </a>
  234.        <a
  235.          href="https://the-scoove-africa-ar-ele-77bb3fj.gamma.site/"
  236.          target="_blank"
  237.          rel="noopener noreferrer"
  238.          class="flex items-center justify-between py-3 text-base font-medium text-white border-b border-white/10"
  239.          onclick="closeMobileMenu()"
  240.        >
  241.          Pricings
  242.          <svg
  243.            xmlns="http://www.w3.org/2000/svg"
  244.            width="20"
  245.            height="20"
  246.            viewBox="0 0 24 24"
  247.            fill="none"
  248.            stroke="currentColor"
  249.            stroke-width="2"
  250.            stroke-linecap="round"
  251.            stroke-linejoin="round"
  252.          >
  253.            <path d="M5 12h14M12 5l7 7-7 7" />
  254.          </svg>
  255.        </a>
  256.        <a class='flex items-center justify-between py-3 text-base font-medium text-white border-b border-white/10' href='/blog' onclick='closeMobileMenu()'>
  257.          Blog
  258.          <svg
  259.            xmlns="http://www.w3.org/2000/svg"
  260.            width="20"
  261.            height="20"
  262.            viewBox="0 0 24 24"
  263.            fill="none"
  264.            stroke="currentColor"
  265.            stroke-width="2"
  266.            stroke-linecap="round"
  267.            stroke-linejoin="round"
  268.          >
  269.            <path d="M5 12h14M12 5l7 7-7 7" />
  270.          </svg>
  271.        </a>
  272.        <a
  273.          href="https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header"
  274.          target="_blank"
  275.          rel="noopener noreferrer"
  276.          class="flex items-center justify-center py-3 mt-4 rounded-full border text-base font-medium shadow-[inset_0_1px_0_0_rgba(255,255,255,0.08)] transition border-white/10 bg-white text-zinc-950 hover:bg-zinc-200"
  277.          onclick="closeMobileMenu()"
  278.        >
  279.          Get Started
  280.        </a>
  281.  
  282.        <!-- Contact Info in Mobile Menu -->
  283.        <div class="pt-4 mt-4 border-t border-white/10">
  284.          <div class="space-y-2 text-sm text-zinc-400">
  285.            <p class="flex items-center gap-2">
  286.              <svg
  287.                xmlns="http://www.w3.org/2000/svg"
  288.                width="16"
  289.                height="16"
  290.                viewBox="0 0 24 24"
  291.                fill="none"
  292.                stroke="currentColor"
  293.                stroke-width="2"
  294.              >
  295.                <path
  296.                  d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"
  297.                />
  298.              </svg>
  299.              <a
  300.                href="tel:+2349131294201"
  301.                class="hover:text-white transition-colors"
  302.              >
  303.                09131294201
  304.              </a>
  305.            </p>
  306.            <p class="flex items-center gap-2">
  307.              <svg
  308.                xmlns="http://www.w3.org/2000/svg"
  309.                width="16"
  310.                height="16"
  311.                viewBox="0 0 24 24"
  312.                fill="none"
  313.                stroke="currentColor"
  314.                stroke-width="2"
  315.              >
  316.                <path
  317.                  d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"
  318.                />
  319.                <polyline points="22,6 12,13 2,6" />
  320.              </svg>
  321.              <a
  322.                href="mailto:hello@thescoove.africa"
  323.                class="hover:text-white transition-colors"
  324.              >
  325.                hello@thescoove.africa
  326.              </a>
  327.            </p>
  328.          </div>
  329.        </div>
  330.      </div>
  331.    </div>
  332.  
  333.    <!-- Hero Section -->
  334.    <main class="relative">
  335.      <section class="max-w-7xl mx-auto pt-32 pb-16 px-6 md:pt-48 md:pb-24">
  336.        <div class="flex flex-col text-center space-y-6 items-center">
  337.          <!-- Hero Icon with vinyl animation -->
  338.          <div
  339.            class="relative animate-[scaleInBlur_1.2s_ease-out_0.6s_forwards] mb-8 blur-lg scale-50"
  340.          >
  341.            <div
  342.              class="absolute -inset-8 bg-[radial-gradient(closest-side,rgba(0,135,81,0.15),transparent)] blur-2xl"
  343.            ></div>
  344.            <div
  345.              class="relative h-16 w-16 ring-1 shadow-[0_0_40px_-10px_rgba(0,135,81,0.3),inset_0_1px_0_0_rgba(255,255,255,0.1)] flex ring-white/10 bg-zinc-900/80 backdrop-blur rounded-2xl items-center justify-center text-white p-3 vinyl-spin"
  346.            >
  347.              <svg
  348.                viewBox="0 0 24 24"
  349.                fill="none"
  350.                stroke="currentColor"
  351.                stroke-width="1.5"
  352.                class="w-full h-full"
  353.              >
  354.                <circle cx="12" cy="12" r="10" />
  355.                <circle cx="12" cy="12" r="3" fill="currentColor" />
  356.                <circle cx="12" cy="12" r="6" opacity="0.3" />
  357.              </svg>
  358.            </div>
  359.          </div>
  360.  
  361.          <!-- Eyebrow Badge -->
  362.          <div
  363.            class="mb-6 opacity-0 translate-y-4 blur-sm animate-[slideInBlur_0.8s_ease-out_0.8s_forwards]"
  364.          >
  365.            <span
  366.              class="inline-flex items-center gap-2 rounded-full border px-3 py-1.5 text-[11px] font-medium uppercase tracking-[0.14em] border-white/10 bg-zinc-900/50 text-zinc-400"
  367.            >
  368.              <span
  369.                class="h-1.5 w-1.5 rounded-full shadow-[0_0_0_2px_rgba(255,255,255,0.1)] bg-green-500"
  370.              ></span>
  371.              Trusted by 200+ Nigerian Artists
  372.            </span>
  373.          </div>
  374.  
  375.          <!-- Hero Headline -->
  376.          <h1
  377.            class="max-w-4xl text-5xl sm:text-6xl md:text-7xl tracking-tight leading-[0.95] text-transparent bg-clip-text bg-gradient-to-b font-semibold opacity-0 translate-y-8 blur-sm animate-[slideInBlur_1s_ease-out_1s_forwards] from-white via-zinc-200 to-zinc-500"
  378.          >
  379.            <span class="block">Your Sound. Our Expertise.</span>
  380.            <span class="block">
  381.              <span
  382.                class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  383.                >Nigeria's Airwaves.</span
  384.              >
  385.            </span>
  386.          </h1>
  387.  
  388.          <!-- Subheadline -->
  389.          <p
  390.            class="max-w-2xl sm:text-lg animate-[slideInBlur_0.8s_ease-out_1.2s_forwards] text-zinc-400 opacity-0 mt-6 blur-sm translate-y-6 font-light leading-relaxed"
  391.          >
  392.            Professional A&R services connecting Nigerian artists with radio
  393.            airplay, playlist placements, media coverage, and sound development.
  394.            Your direct path to the industry.
  395.          </p>
  396.  
  397.          <!-- CTA Button with Glow -->
  398.          <div class="pt-8 pb-8">
  399.            <div class="relative inline-block group">
  400.              <button
  401.                onclick="
  402.                  window.open(
  403.                    'https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header',
  404.                    '_blank',
  405.                  )
  406.                "
  407.                class="animate-[slideInBlur_0.8s_ease-out_1.2s_forwards] relative z-10 overflow-hidden shadow-[inset_0_1px_0_rgba(255,255,255,0.1)] transition-transform duration-150 ease-out active:scale-[0.98] text-zinc-950 bg-white border-white border rounded-full px-8 py-4"
  408.                style="--x: 50%; --y: 50%; --o: 0"
  409.                onmousemove="btnMove(event)"
  410.                onmouseenter="this.style.setProperty('--o', '1')"
  411.                onmouseleave="this.style.setProperty('--o', '0')"
  412.              >
  413.                <span
  414.                  class="relative z-10 inline-flex items-center gap-2 font-semibold"
  415.                >
  416.                  Get Started
  417.                  <svg
  418.                    class="h-4 w-4 transition-transform duration-200 ease-out group-hover:translate-x-0.5"
  419.                    fill="none"
  420.                    stroke="currentColor"
  421.                    stroke-width="2"
  422.                    viewBox="0 0 24 24"
  423.                  >
  424.                    <path
  425.                      stroke-linecap="round"
  426.                      stroke-linejoin="round"
  427.                      d="M5 12h14M13 5l7 7-7 7"
  428.                    ></path>
  429.                  </svg>
  430.                </span>
  431.              </button>
  432.              <span
  433.                class="pointer-events-none absolute -bottom-3 left-1/2 z-0 h-6 w-44 -translate-x-1/2 rounded-full opacity-0 transition-opacity duration-300 ease-out group-hover:opacity-100"
  434.                style="
  435.                  background: radial-gradient(
  436.                    60% 100% at 50% 50%,
  437.                    rgba(0, 135, 81, 0.55),
  438.                    rgba(0, 135, 81, 0.28) 35%,
  439.                    transparent 70%
  440.                  );
  441.                  filter: blur(10px) saturate(120%);
  442.                "
  443.              ></span>
  444.            </div>
  445.          </div>
  446.  
  447.          <!-- Trust Stats -->
  448.          <div
  449.            class="mt-14 grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-16 opacity-0 translate-y-4 blur-sm animate-[slideInBlur_0.8s_ease-out_1.6s_forwards] text-zinc-500"
  450.          >
  451.            <div class="text-center">
  452.              <div class="text-2xl font-semibold text-white tracking-tight">
  453.                50k+
  454.              </div>
  455.              <div class="text-[10px] uppercase tracking-widest mt-1">
  456.                Radio Spins
  457.              </div>
  458.            </div>
  459.            <div class="text-center">
  460.              <div class="text-2xl font-semibold text-white tracking-tight">
  461.                200+
  462.              </div>
  463.              <div class="text-[10px] uppercase tracking-widest mt-1">
  464.                Artists Promoted
  465.              </div>
  466.            </div>
  467.            <div class="text-center">
  468.              <div class="text-2xl font-semibold text-white tracking-tight">
  469.                15+
  470.              </div>
  471.              <div class="text-[10px] uppercase tracking-widest mt-1">
  472.                Radio Partners
  473.              </div>
  474.            </div>
  475.            <div class="text-center">
  476.              <div class="text-2xl font-semibold text-white tracking-tight">
  477.                2021
  478.              </div>
  479.              <div class="text-[10px] uppercase tracking-widest mt-1">
  480.                Established
  481.              </div>
  482.            </div>
  483.          </div>
  484.        </div>
  485.      </section>
  486.    </main>
  487.  
  488.    <!-- Services Section -->
  489.    <section id="services" class="w-full max-w-7xl mx-auto px-6 py-1">
  490.      <div class="flex mb-12 items-center justify-center scroll-fade">
  491.        <span
  492.          class="inline-flex items-center gap-2 text-[11px] uppercase tracking-wide border rounded-full px-3 py-1 text-zinc-400 bg-white/5 border-white/10"
  493.        >
  494.          <svg
  495.            xmlns="http://www.w3.org/2000/svg"
  496.            width="14"
  497.            height="14"
  498.            viewBox="0 0 24 24"
  499.            fill="none"
  500.            stroke="currentColor"
  501.            stroke-width="2"
  502.            stroke-linecap="round"
  503.            stroke-linejoin="round"
  504.            class="text-white"
  505.          >
  506.            <path d="M9 18V5l12-2v13"></path>
  507.            <circle cx="6" cy="18" r="3"></circle>
  508.            <circle cx="18" cy="16" r="3"></circle>
  509.          </svg>
  510.          Our Services
  511.        </span>
  512.      </div>
  513.  
  514.      <div class="max-w-3xl scroll-fade scroll-fade-delay text-center mx-auto">
  515.        <h2
  516.          class="text-4xl md:text-5xl font-semibold tracking-tight text-white"
  517.        >
  518.          Everything Your Music
  519.          <span
  520.            class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  521.            >Needs to Gain Real Traction</span
  522.          >
  523.        </h2>
  524.        <p class="md:text-lg text-zinc-400 mt-4 leading-relaxed">
  525.          From radio airplay to playlist placements and artist development, we
  526.          handle every aspect of your music promotion.
  527.        </p>
  528.      </div>
  529.  
  530.      <div class="mt-16 grid grid-cols-1 md:grid-cols-3 gap-6">
  531.        <!-- Service Card: Radio Promotion -->
  532.        <article
  533.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade"
  534.        >
  535.          <div
  536.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  537.          >
  538.            <svg
  539.              xmlns="http://www.w3.org/2000/svg"
  540.              width="20"
  541.              height="20"
  542.              viewBox="0 0 24 24"
  543.              fill="none"
  544.              stroke="currentColor"
  545.              stroke-width="2"
  546.              stroke-linecap="round"
  547.              stroke-linejoin="round"
  548.            >
  549.              <circle cx="12" cy="12" r="2"></circle>
  550.              <path
  551.                d="M16.24 7.76a6 6 0 0 1 0 8.49m-8.48-.01a6 6 0 0 1 0-8.49m11.31-2.82a10 10 0 0 1 0 14.14m-14.14 0a10 10 0 0 1 0-14.14"
  552.              ></path>
  553.            </svg>
  554.          </div>
  555.          <h3 class="text-lg font-semibold text-white mb-2">Radio Airplay</h3>
  556.          <p class="text-sm text-zinc-400 leading-relaxed">
  557.            Get your tracks on 20+ major Nigerian radio stations including
  558.            SoundCity, Cool FM, Bounce Radio, Naija Info, Radio Now, etc
  559.          </p>
  560.        </article>
  561.  
  562.        <!-- Service Card: Playlist Placement -->
  563.        <article
  564.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade scroll-fade-delay"
  565.        >
  566.          <div
  567.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  568.          >
  569.            <svg
  570.              xmlns="http://www.w3.org/2000/svg"
  571.              width="20"
  572.              height="20"
  573.              viewBox="0 0 24 24"
  574.              fill="none"
  575.              stroke="currentColor"
  576.              stroke-width="2"
  577.              stroke-linecap="round"
  578.              stroke-linejoin="round"
  579.            >
  580.              <path d="M9 18V5l12-2v13"></path>
  581.              <circle cx="6" cy="18" r="3"></circle>
  582.              <circle cx="18" cy="16" r="3"></circle>
  583.            </svg>
  584.          </div>
  585.          <h3 class="text-lg font-semibold text-white mb-2">
  586.            Playlist Additions
  587.          </h3>
  588.          <p class="text-sm text-zinc-400 leading-relaxed">
  589.            Secure placements on our curated playlists across Spotify, Apple
  590.            Music, Audiomack, and Boomplay with a combined reach of 100k+
  591.            followers.
  592.          </p>
  593.        </article>
  594.  
  595.        <!-- Service Card: Media Coverage -->
  596.        <article
  597.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade scroll-fade-delay-2"
  598.        >
  599.          <div
  600.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  601.          >
  602.            <svg
  603.              xmlns="http://www.w3.org/2000/svg"
  604.              width="20"
  605.              height="20"
  606.              viewBox="0 0 24 24"
  607.              fill="none"
  608.              stroke="currentColor"
  609.              stroke-width="2"
  610.              stroke-linecap="round"
  611.              stroke-linejoin="round"
  612.            >
  613.              <rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
  614.              <line x1="8" y1="21" x2="16" y2="21"></line>
  615.              <line x1="12" y1="17" x2="12" y2="21"></line>
  616.            </svg>
  617.          </div>
  618.          <h3 class="text-lg font-semibold text-white mb-2">Media Coverage</h3>
  619.          <p class="text-sm text-zinc-400 leading-relaxed">
  620.            Feature placements on NotJustOk, Native Mag, Pulse Nigeria, and 10+
  621.            other leading music blogs and entertainment platforms.
  622.          </p>
  623.        </article>
  624.  
  625.        <!-- Service Card: A&R Development -->
  626.        <article
  627.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade"
  628.        >
  629.          <div
  630.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  631.          >
  632.            <svg
  633.              xmlns="http://www.w3.org/2000/svg"
  634.              width="20"
  635.              height="20"
  636.              viewBox="0 0 24 24"
  637.              fill="none"
  638.              stroke="currentColor"
  639.              stroke-width="2"
  640.              stroke-linecap="round"
  641.              stroke-linejoin="round"
  642.            >
  643.              <path d="M9 18V5l12-2v13"></path>
  644.              <path d="M9 9l12-2"></path>
  645.              <circle cx="6" cy="18" r="3"></circle>
  646.              <circle cx="18" cy="16" r="3"></circle>
  647.            </svg>
  648.          </div>
  649.          <h3 class="text-lg font-semibold text-white mb-2">
  650.            Sound Development
  651.          </h3>
  652.          <p class="text-sm text-zinc-400 leading-relaxed">
  653.            Professional A&R guidance to refine your sound, select the right
  654.            singles, and position your brand for maximum impact in the Nigerian
  655.            music scene.
  656.          </p>
  657.        </article>
  658.  
  659.        <!-- Service Card: Strategy -->
  660.        <article
  661.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade scroll-fade-delay"
  662.        >
  663.          <div
  664.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  665.          >
  666.            <svg
  667.              xmlns="http://www.w3.org/2000/svg"
  668.              width="20"
  669.              height="20"
  670.              viewBox="0 0 24 24"
  671.              fill="none"
  672.              stroke="currentColor"
  673.              stroke-width="2"
  674.              stroke-linecap="round"
  675.              stroke-linejoin="round"
  676.            >
  677.              <polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline>
  678.            </svg>
  679.          </div>
  680.          <h3 class="text-lg font-semibold text-white mb-2">
  681.            Release Strategy
  682.          </h3>
  683.          <p class="text-sm text-zinc-400 leading-relaxed">
  684.            Data-driven release planning including timing, rollout campaigns,
  685.            and multi-platform coordination to maximize your single or album
  686.            launch.
  687.          </p>
  688.        </article>
  689.  
  690.        <!-- Service Card: Industry Connect -->
  691.        <article
  692.          class="relative overflow-hidden rounded-2xl ring-1 p-6 bg-white/5 ring-white/10 hover:bg-white/[0.08] transition-all group scroll-fade scroll-fade-delay-2"
  693.        >
  694.          <div
  695.            class="h-10 w-10 bg-zinc-800 rounded-lg flex items-center justify-center text-white mb-4 ring-1 ring-white/10"
  696.          >
  697.            <svg
  698.              xmlns="http://www.w3.org/2000/svg"
  699.              width="20"
  700.              height="20"
  701.              viewBox="0 0 24 24"
  702.              fill="none"
  703.              stroke="currentColor"
  704.              stroke-width="2"
  705.              stroke-linecap="round"
  706.              stroke-linejoin="round"
  707.            >
  708.              <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
  709.              <circle cx="9" cy="7" r="4"></circle>
  710.              <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
  711.              <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
  712.            </svg>
  713.          </div>
  714.          <h3 class="text-lg font-semibold text-white mb-2">
  715.            Record Label Connections
  716.          </h3>
  717.          <p class="text-sm text-zinc-400 leading-relaxed">
  718.            Get Positioned for Real Label Opportunities. We do not promise
  719.            deals. We build artists that labels want to talk to. We help
  720.            position you for label conversations.
  721.          </p>
  722.        </article>
  723.      </div>
  724.    </section>
  725.  
  726.    <!-- Success Stories Section -->
  727.    <section id="success" class="w-full max-w-7xl mx-auto px-6 py-20">
  728.      <div class="flex items-center justify-center scroll-fade">
  729.        <span
  730.          class="inline-flex items-center gap-2 text-[11px] uppercase tracking-wide border rounded-full px-3 py-1 text-zinc-400 bg-white/5 border-white/10"
  731.        >
  732.          <svg
  733.            xmlns="http://www.w3.org/2000/svg"
  734.            width="14"
  735.            height="14"
  736.            viewBox="0 0 24 24"
  737.            fill="none"
  738.            stroke="currentColor"
  739.            stroke-width="2"
  740.            stroke-linecap="round"
  741.            stroke-linejoin="round"
  742.            class="text-white"
  743.          >
  744.            <polyline points="23 6 13.5 15.5 8.5 10.5 1 18"></polyline>
  745.            <polyline points="17 6 23 6 23 12"></polyline>
  746.          </svg>
  747.          Proven Results
  748.        </span>
  749.      </div>
  750.  
  751.      <div
  752.        class="max-w-3xl text-center mt-6 mx-auto scroll-fade scroll-fade-delay"
  753.      >
  754.        <h2
  755.          class="text-4xl md:text-5xl font-semibold tracking-tight text-white"
  756.        >
  757.          Real Artists. Real
  758.          <span
  759.            class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  760.            >Results.</span
  761.          >
  762.        </h2>
  763.      </div>
  764.  
  765.      <!-- Stacked Testimonial Cards -->
  766.      <div
  767.        class="relative group mt-16 scroll-fade scroll-fade-delay-2 max-w-4xl mx-auto"
  768.      >
  769.        <!-- Back layers -->
  770.        <div
  771.          class="pointer-events-none absolute inset-x-6 -top-12 h-64 border border-white/5 bg-zinc-900/40 rounded-3xl opacity-40 scale-95 blur-[1px]"
  772.        ></div>
  773.        <div
  774.          class="pointer-events-none absolute inset-x-3 -top-6 h-64 border border-white/5 bg-zinc-900/60 rounded-3xl opacity-70 scale-[0.98]"
  775.        ></div>
  776.  
  777.        <!-- Front card -->
  778.        <div
  779.          class="relative z-10 bg-zinc-900/80 border-white/10 border ring-white/10 ring-1 rounded-3xl backdrop-blur-xl p-3 sm:p-8 md:p-12"
  780.        >
  781.          <div class="text-center mb-8">
  782.            <h2 class="text-2xl md:text-3xl font-bold text-white mb-2">
  783.              A&R Sound Development
  784.            </h2>
  785.            <p class="text-zinc-300">Albums & Songs we've worked on</p>
  786.          </div>
  787.  
  788.          <div class="flex flex-col md:flex-row gap-8 justify-center">
  789.            <!-- First Spotify Embed -->
  790.            <div class="w-full md:w-1/2">
  791.              <iframe
  792.                src="https://open.spotify.com/embed/album/0i01dkt7GePW0pPtjQPT8I?utm_source=generator&theme=0"
  793.                width="100%"
  794.                height="352"
  795.                frameborder="0"
  796.                allowfullscreen=""
  797.                allow="
  798.                  autoplay;
  799.                  clipboard-write;
  800.                  encrypted-media;
  801.                  fullscreen;
  802.                  picture-in-picture;
  803.                "
  804.                loading="lazy"
  805.                class="rounded-2xl shadow-2xl"
  806.              ></iframe>
  807.  
  808.              <!-- Optional: Direct link -->
  809.              <div class="mt-6 text-center">
  810.                <a
  811.                  href="https://open.spotify.com/album/0i01dkt7GePW0pPtjQPT8I"
  812.                  target="_blank"
  813.                  rel="noopener noreferrer"
  814.                  class="inline-flex items-center gap-2 text-sm text-zinc-300 hover:text-white transition-colors"
  815.                >
  816.                  <span>Open in Spotify</span>
  817.                  <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24">
  818.                    <path
  819.                      d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.601-1.559.3z"
  820.                    />
  821.                  </svg>
  822.                </a>
  823.              </div>
  824.            </div>
  825.  
  826.            <!-- Second Spotify Embed -->
  827.            <div class="w-full md:w-1/2">
  828.              <iframe
  829.                src="https://open.spotify.com/embed/album/4ZLRIpsemgeO5IswbRgqrt?utm_source=generator&theme=0"
  830.                width="100%"
  831.                height="352"
  832.                frameborder="0"
  833.                allowfullscreen=""
  834.                allow="
  835.                  autoplay;
  836.                  clipboard-write;
  837.                  encrypted-media;
  838.                  fullscreen;
  839.                  picture-in-picture;
  840.                "
  841.                loading="lazy"
  842.                class="rounded-2xl shadow-2xl"
  843.              ></iframe>
  844.  
  845.              <!-- Optional: Direct link -->
  846.              <div class="mt-6 text-center">
  847.                <a
  848.                  href="https://open.spotify.com/album/4ZLRIpsemgeO5IswbRgqrt"
  849.                  target="_blank"
  850.                  rel="noopener noreferrer"
  851.                  class="inline-flex items-center gap-2 text-sm text-zinc-300 hover:text-white transition-colors"
  852.                >
  853.                  <span>Open in Spotify</span>
  854.                  <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24">
  855.                    <path
  856.                      d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.601-1.559.3z"
  857.                    />
  858.                  </svg>
  859.                </a>
  860.              </div>
  861.            </div>
  862.          </div>
  863.        </div>
  864.      </div>
  865.  
  866.      <!-- Success Metrics Grid -->
  867.      <div class="relative scroll-fade text-center mt-24">
  868.        <h2
  869.          class="md:text-4xl text-4xl font-semibold text-white tracking-tight"
  870.        >
  871.          Our Reach in
  872.          <span
  873.            class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  874.            >Numbers</span
  875.          >
  876.        </h2>
  877.        <p class="mt-2 text-lg text-zinc-400 max-w-2xl mx-auto">
  878.          Get Your Music in Front of over 100,000 of Active Listeners
  879.        </p>
  880.      </div>
  881.      <div
  882.        class="mt-8 grid grid-cols-1 md:grid-cols-3 gap-6 scroll-fade scroll-fade-delay-3"
  883.      >
  884.        <!-- Stat 1: Playlist Stats -->
  885.        <div
  886.          class="relative overflow-hidden rounded-2xl ring-1 p-3 sm:p-8 md:p-12 bg-gradient-to-br from-zinc-800 to-zinc-900 ring-white/10 flex flex-col"
  887.        >
  888.          <div class="text-4xl font-bold text-white tracking-tight mb-2">
  889.            30k+
  890.          </div>
  891.          <p class="text-sm text-zinc-400 mb-3">
  892.            Growing saves, over 100k+ combined hours of listens
  893.          </p>
  894.          <h4 class="text-lg font-semibold text-white mb-2">
  895.            Get featured on our playlists
  896.          </h4>
  897.  
  898.          <!-- Spotify Playlist Embed -->
  899.          <div class="mb-4">
  900.            <div
  901.              class="rounded-2xl overflow-hidden bg-zinc-900/80 border border-white/10 shadow-lg"
  902.            >
  903.              <iframe
  904.                src="https://open.spotify.com/embed/playlist/5fiwnGKirZNSUf61aBhe0e?utm_source=generator&theme=0"
  905.                width="100%"
  906.                height="152"
  907.                frameborder="0"
  908.                allowfullscreen=""
  909.                allow="
  910.                  autoplay;
  911.                  clipboard-write;
  912.                  encrypted-media;
  913.                  fullscreen;
  914.                  picture-in-picture;
  915.                "
  916.                loading="lazy"
  917.                class="spotify-embed"
  918.              ></iframe>
  919.            </div>
  920.          </div>
  921.  
  922.          <div class="mt-auto pt-4">
  923.            <a
  924.              href="https://docs.google.com/forms/d/e/1FAIpQLSdC44p2p5bRUdtPAIaGC2DxXSu3B88Ec2TYP0Igw14a37AAjg/viewform"
  925.              class="inline-block px-4 py-2 text-sm font-medium bg-green-600 hover:bg-green-700 text-white rounded-lg transition-colors w-full text-center"
  926.              target="_blank"
  927.              rel="noopener noreferrer"
  928.            >
  929.              Place Your Song
  930.            </a>
  931.          </div>
  932.        </div>
  933.  
  934.        <!-- Stat 2: Website & Newsletter Stats -->
  935.        <div
  936.          class="relative overflow-hidden rounded-2xl ring-1 p-3 sm:p-8 md:p-12 bg-gradient-to-br from-zinc-800 to-zinc-900 ring-white/10 flex flex-col"
  937.        >
  938.          <div class="text-4xl font-bold text-white tracking-tight mb-2">
  939.            50k+
  940.          </div>
  941.          <p class="text-sm text-zinc-400 mb-3">
  942.            Organic Clicks, Over 1k newsletter subscribers
  943.          </p>
  944.          <h4 class="text-lg font-semibold text-white mb-3">
  945.            Get published on our website & newsletter
  946.          </h4>
  947.  
  948.          <div class="mb-4">
  949.            <div class="flex items-center gap-2 mb-2">
  950.              <svg
  951.                xmlns="http://www.w3.org/2000/svg"
  952.                class="h-5 w-5 text-green-500"
  953.                viewBox="0 0 24 24"
  954.                fill="none"
  955.                stroke="currentColor"
  956.                stroke-width="2"
  957.              >
  958.                <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
  959.                <polyline points="22 4 12 14.01 9 11.01"></polyline>
  960.              </svg>
  961.              <span class="text-sm text-zinc-300"
  962.                >Featured artist spotlights</span
  963.              >
  964.            </div>
  965.            <div class="flex items-center gap-2 mb-2">
  966.              <svg
  967.                xmlns="http://www.w3.org/2000/svg"
  968.                class="h-5 w-5 text-green-500"
  969.                viewBox="0 0 24 24"
  970.                fill="none"
  971.                stroke="currentColor"
  972.                stroke-width="2"
  973.              >
  974.                <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
  975.                <polyline points="22 4 12 14.01 9 11.01"></polyline>
  976.              </svg>
  977.              <span class="text-sm text-zinc-300"
  978.                >Weekly music industry insights</span
  979.              >
  980.            </div>
  981.            <div class="flex items-center gap-2">
  982.              <svg
  983.                xmlns="http://www.w3.org/2000/svg"
  984.                class="h-5 w-5 text-green-500"
  985.                viewBox="0 0 24 24"
  986.                fill="none"
  987.                stroke="currentColor"
  988.                stroke-width="2"
  989.              >
  990.                <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
  991.                <polyline points="22 4 12 14.01 9 11.01"></polyline>
  992.              </svg>
  993.              <span class="text-sm text-zinc-300"
  994.                >Exclusive promotion opportunities</span
  995.              >
  996.            </div>
  997.          </div>
  998.  
  999.          <div class="mt-auto pt-4">
  1000.            <a
  1001.              href="https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header"
  1002.              class="inline-block px-4 py-2 text-sm font-medium bg-green-600 hover:bg-green-700 text-white rounded-lg transition-colors w-full text-center"
  1003.              target="_blank"
  1004.              rel="noopener noreferrer"
  1005.            >
  1006.              Get Started
  1007.            </a>
  1008.          </div>
  1009.        </div>
  1010.  
  1011.        <!-- Stat 3: Social Media Stats -->
  1012.        <div
  1013.          class="relative overflow-hidden rounded-2xl ring-1 p-3 sm:p-8 md:p-12 bg-gradient-to-br from-zinc-800 to-zinc-900 ring-white/10 flex flex-col"
  1014.        >
  1015.          <div class="text-4xl font-bold text-white tracking-tight mb-2">
  1016.            10M+
  1017.          </div>
  1018.          <p class="text-sm text-zinc-400 mb-3">
  1019.            Views/Impressions, 30k+ Followers
  1020.          </p>
  1021.          <h4 class="text-lg font-semibold text-white mb-4">
  1022.            Get featured across our socials
  1023.          </h4>
  1024.  
  1025.          <div class="grid grid-cols-2 gap-3 mb-4">
  1026.            <!-- TikTok -->
  1027.            <a
  1028.              href="https://www.tiktok.com/@thescoove.africa"
  1029.              target="_blank"
  1030.              rel="noopener noreferrer"
  1031.              class="flex items-center gap-2 p-2 bg-black/30 rounded-lg hover:bg-black/50 transition-colors"
  1032.            >
  1033.              <div class="w-8 h-8 flex items-center justify-center">
  1034.                <svg viewBox="0 0 24 24" class="w-6 h-6">
  1035.                  <path
  1036.                    fill="#25F4EE"
  1037.                    d="M19.589 6.686a4.793 4.793 0 0 1-3.77-4.245V2h-3.445v13.672a2.896 2.896 0 0 1-5.201 1.743l-.002-.001.002.001a2.895 2.895 0 0 1 3.183-4.51v-3.5a6.329 6.329 0 0 0-5.394 10.692 6.33 6.33 0 0 0 10.857-4.424V8.687a8.182 8.182 0 0 0 4.773 1.526V6.79a4.831 4.831 0 0 1-1.003-.104z"
  1038.                  />
  1039.                </svg>
  1040.              </div>
  1041.              <span class="text-sm text-zinc-300">TikTok</span>
  1042.            </a>
  1043.  
  1044.            <!-- X -->
  1045.            <a
  1046.              href="https://twitter.com/thescoove.africa"
  1047.              target="_blank"
  1048.              rel="noopener noreferrer"
  1049.              class="flex items-center gap-2 p-2 bg-black/30 rounded-lg hover:bg-black/50 transition-colors"
  1050.            >
  1051.              <div
  1052.                class="w-8 h-8 bg-black rounded-full flex items-center justify-center"
  1053.              >
  1054.                <span class="text-xs font-bold text-white">X</span>
  1055.              </div>
  1056.              <span class="text-sm text-zinc-300">X</span>
  1057.            </a>
  1058.  
  1059.            <!-- Instagram -->
  1060.            <a
  1061.              href="https://www.instagram.com/thescoove.africa"
  1062.              target="_blank"
  1063.              rel="noopener noreferrer"
  1064.              class="flex items-center gap-2 p-2 bg-black/30 rounded-lg hover:bg-black/50 transition-colors"
  1065.            >
  1066.              <div class="w-8 h-8 flex items-center justify-center">
  1067.                <svg viewBox="0 0 24 24" class="w-6 h-6">
  1068.                  <path
  1069.                    fill="#E1306C"
  1070.                    d="M12 2c2.717 0 3.056.01 4.122.06 1.065.05 1.79.217 2.428.465.66.254 1.216.598 1.772 1.153a4.908 4.908 0 0 1 1.153 1.772c.247.637.415 1.363.465 2.428.047 1.066.06 1.405.06 4.122 0 2.717-.01 3.056-.06 4.122-.05 1.065-.218 1.79-.465 2.428a4.883 4.883 0 0 1-1.153 1.772 4.915 4.915 0 0 1-1.772 1.153c-.637.247-1.363.415-2.428.465-1.066.047-1.405.06-4.122.06-2.717 0-3.056-.01-4.122-.06-1.065-.05-1.79-.218-2.428-.465a4.89 4.89 0 0 1-1.772-1.153 4.904 4.904 0 0 1-1.153-1.772c-.248-.637-.415-1.363-.465-2.428C2.013 15.056 2 14.717 2 12c0-2.717.01-3.056.06-4.122.05-1.066.217-1.79.465-2.428a4.88 4.88 0 0 1 1.153-1.772A4.897 4.897 0 0 1 5.45 2.525c.638-.248 1.362-.415 2.428-.465C8.944 2.013 9.283 2 12 2zm0 5a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm6.5-.25a1.25 1.25 0 0 0-2.5 0 1.25 1.25 0 0 0 2.5 0zM12 9a3 3 0 1 1 0 6 3 3 0 0 1 0-6z"
  1071.                  />
  1072.                </svg>
  1073.              </div>
  1074.              <span class="text-sm text-zinc-300">Instagram</span>
  1075.            </a>
  1076.  
  1077.            <!-- YouTube -->
  1078.            <a
  1079.              href="https://www.youtube.com/@thescoove.africa"
  1080.              target="_blank"
  1081.              rel="noopener noreferrer"
  1082.              class="flex items-center gap-2 p-2 bg-black/30 rounded-lg hover:bg-black/50 transition-colors"
  1083.            >
  1084.              <div
  1085.                class="w-8 h-8 bg-red-600 rounded-full flex items-center justify-center"
  1086.              >
  1087.                <svg
  1088.                  xmlns="http://www.w3.org/2000/svg"
  1089.                  width="12"
  1090.                  height="12"
  1091.                  viewBox="0 0 24 24"
  1092.                  fill="currentColor"
  1093.                >
  1094.                  <path
  1095.                    d="M19.615 3.184c-3.604-.246-11.631-.245-15.23 0-3.897.266-4.356 2.62-4.385 8.816.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0 3.897-.266 4.356-2.62 4.385-8.816-.029-6.185-.484-8.549-4.385-8.816zm-10.615 12.816v-8l8 3.993-8 4.007z"
  1096.                  />
  1097.                </svg>
  1098.              </div>
  1099.              <span class="text-sm text-zinc-300">YouTube</span>
  1100.            </a>
  1101.          </div>
  1102.  
  1103.          <div class="mt-auto pt-4">
  1104.            <a
  1105.              href="#contact"
  1106.              class="inline-block px-4 py-2 text-sm font-medium bg-green-600 hover:bg-green-700 text-white rounded-lg transition-colors w-full text-center"
  1107.            >
  1108.              Get Featured
  1109.            </a>
  1110.          </div>
  1111.        </div>
  1112.      </div>
  1113.    </section>
  1114.  
  1115.    <!-- How It Works Section -->
  1116.    <section id="process" class="w-full max-w-7xl mx-auto px-6 py-20">
  1117.      <div class="flex items-center justify-center scroll-fade">
  1118.        <span
  1119.          class="inline-flex items-center gap-2 text-[11px] uppercase tracking-wide border rounded-full px-3 py-1 text-zinc-400 bg-white/5 border-white/10"
  1120.        >
  1121.          <svg
  1122.            xmlns="http://www.w3.org/2000/svg"
  1123.            width="14"
  1124.            height="14"
  1125.            viewBox="0 0 24 24"
  1126.            fill="none"
  1127.            stroke="currentColor"
  1128.            stroke-width="2"
  1129.            stroke-linecap="round"
  1130.            stroke-linejoin="round"
  1131.            class="text-white"
  1132.          >
  1133.            <circle cx="12" cy="12" r="10"></circle>
  1134.            <polyline points="12 6 12 12 16 14"></polyline>
  1135.          </svg>
  1136.          Our Process
  1137.        </span>
  1138.      </div>
  1139.  
  1140.      <div
  1141.        class="max-w-3xl text-center mx-auto mt-6 mb-16 scroll-fade scroll-fade-delay"
  1142.      >
  1143.        <h2
  1144.          class="text-4xl md:text-5xl font-semibold tracking-tight text-white"
  1145.        >
  1146.          A Simple, Transparent A&R Process Built for
  1147.          <span
  1148.            class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  1149.            >Nigerian Artists</span
  1150.          >
  1151.        </h2>
  1152.      </div>
  1153.  
  1154.      <div class="grid gap-8 lg:grid-cols-3 scroll-fade scroll-fade-delay-2">
  1155.        <!-- Step 1 -->
  1156.        <div
  1157.          class="relative w-full h-fit overflow-hidden bg-gradient-to-r from-white/10 to-white/5 rounded-[1.5em] border border-white/10 hover:border-white/20 transition-all duration-300 p-3 sm:p-8 md:p-12"
  1158.        >
  1159.          <div
  1160.            class="inline-flex items-center justify-center h-12 w-12 rounded-full bg-green-500/10 text-green-400 font-bold text-lg mb-6 ring-1 ring-green-500/20"
  1161.          >
  1162.            1
  1163.          </div>
  1164.          <a
  1165.            href="https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header"
  1166.            target="_blank"
  1167.            class="inline-block hover:opacity-90 transition-opacity"
  1168.          >
  1169.            <h3 class="text-xl font-semibold tracking-tight text-white mb-3">
  1170.              Submit Your Music
  1171.            </h3>
  1172.          </a>
  1173.          <p class="text-sm text-zinc-400 leading-relaxed mb-6">
  1174.            Send us your track via our online form. We review within 24 hours
  1175.            and provide feedback on readiness for promotion.
  1176.          </p>
  1177.          <div class="space-y-2 text-sm text-zinc-500">
  1178.            <div class="flex items-center gap-2">
  1179.              <svg
  1180.                class="h-4 w-4 text-green-500"
  1181.                viewBox="0 0 24 24"
  1182.                fill="none"
  1183.                stroke="currentColor"
  1184.                stroke-width="2"
  1185.              >
  1186.                <polyline points="20 6 9 17 4 12"></polyline>
  1187.              </svg>
  1188.              <span>24-hour response time</span>
  1189.            </div>
  1190.            <div class="flex items-center gap-2">
  1191.              <svg
  1192.                class="h-4 w-4 text-green-500"
  1193.                viewBox="0 0 24 24"
  1194.                fill="none"
  1195.                stroke="currentColor"
  1196.                stroke-width="2"
  1197.              >
  1198.                <polyline points="20 6 9 17 4 12"></polyline>
  1199.              </svg>
  1200.              <span>Professional A&R feedback</span>
  1201.            </div>
  1202.          </div>
  1203.        </div>
  1204.  
  1205.        <!-- Step 2 -->
  1206.        <div
  1207.          class="relative w-full h-fit overflow-hidden bg-gradient-to-br from-zinc-800 to-zinc-900 rounded-[1.5em] border border-white/20 shadow-[0_0_30px_-5px_rgba(0,135,81,0.2)] ring-1 ring-white/10 p-3 sm:p-8 md:p-12"
  1208.        >
  1209.          <div
  1210.            class="inline-flex items-center justify-center h-12 w-12 rounded-full bg-green-500/10 text-green-400 font-bold text-lg mb-6 ring-1 ring-green-500/20"
  1211.          >
  1212.            2
  1213.          </div>
  1214.          <h3 class="text-xl font-semibold tracking-tight text-white mb-3">
  1215.            Campaign Strategy
  1216.          </h3>
  1217.          <p class="text-sm text-zinc-400 leading-relaxed mb-6">
  1218.            We create a custom promotion strategy targeting the right radio
  1219.            stations, playlists, and media outlets for your genre and audience.
  1220.          </p>
  1221.          <div class="space-y-2 text-sm text-zinc-500">
  1222.            <div class="flex items-center gap-2">
  1223.              <svg
  1224.                class="h-4 w-4 text-green-500"
  1225.                viewBox="0 0 24 24"
  1226.                fill="none"
  1227.                stroke="currentColor"
  1228.                stroke-width="2"
  1229.              >
  1230.                <polyline points="20 6 9 17 4 12"></polyline>
  1231.              </svg>
  1232.              <span>Genre-specific targeting</span>
  1233.            </div>
  1234.            <div class="flex items-center gap-2">
  1235.              <svg
  1236.                class="h-4 w-4 text-green-500"
  1237.                viewBox="0 0 24 24"
  1238.                fill="none"
  1239.                stroke="currentColor"
  1240.                stroke-width="2"
  1241.              >
  1242.                <polyline points="20 6 9 17 4 12"></polyline>
  1243.              </svg>
  1244.              <span>Multi-platform coordination</span>
  1245.            </div>
  1246.          </div>
  1247.        </div>
  1248.  
  1249.        <!-- Step 3 -->
  1250.        <div
  1251.          class="relative w-full h-fit overflow-hidden bg-gradient-to-r from-white/10 to-white/5 rounded-[1.5em] border border-white/10 hover:border-white/20 transition-all duration-300 p-3 sm:p-8 md:p-12"
  1252.        >
  1253.          <div
  1254.            class="inline-flex items-center justify-center h-12 w-12 rounded-full bg-green-500/10 text-green-400 font-bold text-lg mb-6 ring-1 ring-green-500/20"
  1255.          >
  1256.            3
  1257.          </div>
  1258.          <h3 class="text-xl font-semibold tracking-tight text-white mb-3">
  1259.            Launch & Track
  1260.          </h3>
  1261.          <p class="text-sm text-zinc-400 leading-relaxed mb-6">
  1262.            Campaign goes live. You receive weekly reports with airplay data,
  1263.            playlist adds, media features, and streaming growth.
  1264.          </p>
  1265.          <div class="space-y-2 text-sm text-zinc-500">
  1266.            <div class="flex items-center gap-2">
  1267.              <svg
  1268.                class="h-4 w-4 text-green-500"
  1269.                viewBox="0 0 24 24"
  1270.                fill="none"
  1271.                stroke="currentColor"
  1272.                stroke-width="2"
  1273.              >
  1274.                <polyline points="20 6 9 17 4 12"></polyline>
  1275.              </svg>
  1276.              <span>Weekly performance reports</span>
  1277.            </div>
  1278.            <div class="flex items-center gap-2">
  1279.              <svg
  1280.                class="h-4 w-4 text-green-500"
  1281.                viewBox="0 0 24 24"
  1282.                fill="none"
  1283.                stroke="currentColor"
  1284.                stroke-width="2"
  1285.              >
  1286.                <polyline points="20 6 9 17 4 12"></polyline>
  1287.              </svg>
  1288.              <span>Real-time campaign tracking</span>
  1289.            </div>
  1290.          </div>
  1291.        </div>
  1292.      </div>
  1293.  
  1294.      <!-- CTA Button with Glow -->
  1295.      <div class="pt-8 pb-8 flex justify-center">
  1296.        <div class="relative inline-block group">
  1297.          <button
  1298.            onclick="
  1299.              window.open(
  1300.                'https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header',
  1301.                '_blank',
  1302.              )
  1303.            "
  1304.            class="animate-[slideInBlur_0.8s_ease-out_1.2s_forwards] relative z-10 overflow-hidden shadow-[inset_0_1px_0_rgba(255,255,255,0.1)] transition-transform duration-150 ease-out active:scale-[0.98] text-zinc-950 bg-white border-white border rounded-full px-8 py-4"
  1305.            style="--x: 50%; --y: 50%; --o: 0"
  1306.            onmousemove="btnMove(event)"
  1307.            onmouseenter="this.style.setProperty('--o', '1')"
  1308.            onmouseleave="this.style.setProperty('--o', '0')"
  1309.          >
  1310.            <span
  1311.              class="relative z-10 inline-flex items-center gap-2 font-semibold"
  1312.            >
  1313.              Launch your Campaign
  1314.              <svg
  1315.                class="h-4 w-4 transition-transform duration-200 ease-out group-hover:translate-x-0.5"
  1316.                fill="none"
  1317.                stroke="currentColor"
  1318.                stroke-width="2"
  1319.                viewBox="0 0 24 24"
  1320.              >
  1321.                <path
  1322.                  stroke-linecap="round"
  1323.                  stroke-linejoin="round"
  1324.                  d="M5 12h14M13 5l7 7-7 7"
  1325.                ></path>
  1326.              </svg>
  1327.            </span>
  1328.          </button>
  1329.          <span
  1330.            class="pointer-events-none absolute -bottom-3 left-1/2 z-0 h-6 w-44 -translate-x-1/2 rounded-full opacity-0 transition-opacity duration-300 ease-out group-hover:opacity-100"
  1331.            style="
  1332.              background: radial-gradient(
  1333.                60% 100% at 50% 50%,
  1334.                rgba(0, 135, 81, 0.55),
  1335.                rgba(0, 135, 81, 0.28) 35%,
  1336.                transparent 70%
  1337.              );
  1338.              filter: blur(10px) saturate(120%);
  1339.            "
  1340.          ></span>
  1341.        </div>
  1342.      </div>
  1343.      <!-- FAQ Accordion -->
  1344.      <div class="mt-20 max-w-3xl mx-auto">
  1345.        <h3
  1346.          class="text-2xl font-semibold text-white text-center mb-8 scroll-fade"
  1347.        >
  1348.          Common Questions
  1349.        </h3>
  1350.  
  1351.        <div class="scroll-fade scroll-fade-delay space-y-4">
  1352.          <div
  1353.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1354.          >
  1355.            <button
  1356.              type="button"
  1357.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1358.              data-faq-toggle
  1359.            >
  1360.              <span class="text-sm font-medium text-zinc-200"
  1361.                >How long does a campaign take?</span
  1362.              >
  1363.              <svg
  1364.                xmlns="http://www.w3.org/2000/svg"
  1365.                width="20"
  1366.                height="20"
  1367.                viewBox="0 0 24 24"
  1368.                fill="none"
  1369.                stroke="currentColor"
  1370.                stroke-width="2"
  1371.                stroke-linecap="round"
  1372.                stroke-linejoin="round"
  1373.                class="transition-transform duration-300 text-zinc-400"
  1374.                data-lucide="chevron-down"
  1375.              >
  1376.                <polyline points="6 9 12 15 18 9"></polyline>
  1377.              </svg>
  1378.            </button>
  1379.            <div
  1380.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1381.              style="max-height: 0px"
  1382.            >
  1383.              <div class="pb-6 pt-2">
  1384.                Standard campaigns run between 1 to 3 months. You can choose to
  1385.                extend the duration based on your goals. Radio placements
  1386.                typically begin within 7 to 10 days, while playlist additions
  1387.                start immediately and continue throughout the campaign.
  1388.              </div>
  1389.            </div>
  1390.          </div>
  1391.  
  1392.          <div
  1393.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1394.          >
  1395.            <button
  1396.              type="button"
  1397.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1398.              data-faq-toggle
  1399.            >
  1400.              <span class="text-sm font-medium text-zinc-200"
  1401.                >Does The Scoove Africa work with new artists?</span
  1402.              >
  1403.              <svg
  1404.                xmlns="http://www.w3.org/2000/svg"
  1405.                width="20"
  1406.                height="20"
  1407.                viewBox="0 0 24 24"
  1408.                fill="none"
  1409.                stroke="currentColor"
  1410.                stroke-width="2"
  1411.                stroke-linecap="round"
  1412.                stroke-linejoin="round"
  1413.                class="transition-transform duration-300 text-zinc-400"
  1414.                data-lucide="chevron-down"
  1415.              >
  1416.                <polyline points="6 9 12 15 18 9"></polyline>
  1417.              </svg>
  1418.            </button>
  1419.            <div
  1420.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1421.              style="max-height: 0px"
  1422.            >
  1423.              <div class="pb-6 pt-2">
  1424.                Yes! We work with artists at all stages. If your music is still
  1425.                in production, we help you refine it. If your music is
  1426.                professionally recorded and ready for promotion, we can help you
  1427.                reach the right audience.
  1428.              </div>
  1429.            </div>
  1430.          </div>
  1431.  
  1432.          <div
  1433.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1434.          >
  1435.            <button
  1436.              type="button"
  1437.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1438.              data-faq-toggle
  1439.            >
  1440.              <span class="text-sm font-medium text-zinc-200"
  1441.                >What genres does The Scoove Africa promote?</span
  1442.              >
  1443.              <svg
  1444.                xmlns="http://www.w3.org/2000/svg"
  1445.                width="20"
  1446.                height="20"
  1447.                viewBox="0 0 24 24"
  1448.                fill="none"
  1449.                stroke="currentColor"
  1450.                stroke-width="2"
  1451.                stroke-linecap="round"
  1452.                stroke-linejoin="round"
  1453.                class="transition-transform duration-300 text-zinc-400"
  1454.                data-lucide="chevron-down"
  1455.              >
  1456.                <polyline points="6 9 12 15 18 9"></polyline>
  1457.              </svg>
  1458.            </button>
  1459.            <div
  1460.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1461.              style="max-height: 0px"
  1462.            >
  1463.              <div class="pb-6 pt-2">
  1464.                We specialize in Afrobeats, Afropop, Hip-Hop, R&B, and Amapiano.
  1465.                We have established relationships with stations and curators
  1466.                across all these genres.
  1467.              </div>
  1468.            </div>
  1469.          </div>
  1470.  
  1471.          <div
  1472.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1473.          >
  1474.            <button
  1475.              type="button"
  1476.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1477.              data-faq-toggle
  1478.            >
  1479.              <span class="text-sm font-medium text-zinc-200"
  1480.                >How Much Does The Scoove Africa Charge for Radio Plays?</span
  1481.              >
  1482.              <svg
  1483.                xmlns="http://www.w3.org/2000/svg"
  1484.                width="20"
  1485.                height="20"
  1486.                viewBox="0 0 24 24"
  1487.                fill="none"
  1488.                stroke="currentColor"
  1489.                stroke-width="2"
  1490.                stroke-linecap="round"
  1491.                stroke-linejoin="round"
  1492.                class="transition-transform duration-300 text-zinc-400"
  1493.                data-lucide="chevron-down"
  1494.              >
  1495.                <polyline points="6 9 12 15 18 9"></polyline>
  1496.              </svg>
  1497.            </button>
  1498.            <div
  1499.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1500.              style="max-height: 0px"
  1501.            >
  1502.              <div class="pb-6 pt-2">
  1503.                Our rates for radio plays are custom. Artists have different
  1504.                budgets and needs. For placements on radio stations, you can
  1505.                decide to choose the peak/rush hour or a more affordable option
  1506.                like noon placements. It all depends on your budget.
  1507.              </div>
  1508.            </div>
  1509.          </div>
  1510.          <div
  1511.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1512.          >
  1513.            <button
  1514.              type="button"
  1515.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1516.              data-faq-toggle
  1517.            >
  1518.              <span class="text-sm font-medium text-zinc-200"
  1519.                >How Much Does The Scoove Africa Charge for Playlist
  1520.                Placements?</span
  1521.              >
  1522.              <svg
  1523.                xmlns="http://www.w3.org/2000/svg"
  1524.                width="20"
  1525.                height="20"
  1526.                viewBox="0 0 24 24"
  1527.                fill="none"
  1528.                stroke="currentColor"
  1529.                stroke-width="2"
  1530.                stroke-linecap="round"
  1531.                stroke-linejoin="round"
  1532.                class="transition-transform duration-300 text-zinc-400"
  1533.                data-lucide="chevron-down"
  1534.              >
  1535.                <polyline points="6 9 12 15 18 9"></polyline>
  1536.              </svg>
  1537.            </button>
  1538.            <div
  1539.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1540.              style="max-height: 0px"
  1541.            >
  1542.              <div class="pb-6 pt-2">
  1543.                Submit your track for review and let us know how many weeks you
  1544.                want it placed. Once approved, we will send you our rate card
  1545.                based on your selected placement duration. Approved songs are
  1546.                placed immediately.
  1547.              </div>
  1548.              <a
  1549.                href="https://the-scoove-africa-ar-ele-77bb3fj.gamma.site/"
  1550.                class="px-0 py-1 rounded-full text-sm font-medium text-blue-400 mb-16"
  1551.                target="_blank"
  1552.                rel="noopener noreferrer"
  1553.                >Click here to view our rate card for more details</a
  1554.              >
  1555.            </div>
  1556.          </div>
  1557.          <div
  1558.            class="faq-item rounded-xl border border-white/10 bg-white/5 hover:bg-white/10 transition"
  1559.          >
  1560.            <button
  1561.              type="button"
  1562.              class="w-full flex gap-4 focus:outline-none text-left p-4 items-center justify-between"
  1563.              data-faq-toggle
  1564.            >
  1565.              <span class="text-sm font-medium text-zinc-200"
  1566.                >How can I contact The Scoove Africa?</span
  1567.              >
  1568.              <svg
  1569.                xmlns="http://www.w3.org/2000/svg"
  1570.                width="20"
  1571.                height="20"
  1572.                viewBox="0 0 24 24"
  1573.                fill="none"
  1574.                stroke="currentColor"
  1575.                stroke-width="2"
  1576.                stroke-linecap="round"
  1577.                stroke-linejoin="round"
  1578.                class="transition-transform duration-300 text-zinc-400"
  1579.                data-lucide="chevron-down"
  1580.              >
  1581.                <polyline points="6 9 12 15 18 9"></polyline>
  1582.              </svg>
  1583.            </button>
  1584.            <div
  1585.              class="faq-content overflow-hidden transition-all duration-300 text-sm text-zinc-400 px-4"
  1586.              style="max-height: 0px"
  1587.            >
  1588.              <div class="pb-6 pt-2">
  1589.                Send us an email at
  1590.                <a
  1591.                  href="mailto:hello@thescoove.africa"
  1592.                  class="text-green-600 underline hover:text-green-700"
  1593.                >
  1594.                  hello@thescoove.africa
  1595.                </a>
  1596.                or a WhatsApp message at:
  1597.                <a
  1598.                  href="https://wa.me/2349131294201?text=Hello%20Scoove%2C%20I%20would%20like%20to%20make%20an%20enquiry"
  1599.                  target="_blank"
  1600.                  rel="noopener noreferrer"
  1601.                  class="text-green-600 underline hover:text-green-700"
  1602.                >
  1603.                  09131294201
  1604.                </a>
  1605.              </div>
  1606.            </div>
  1607.          </div>
  1608.        </div>
  1609.      </div>
  1610.    </section>
  1611.  
  1612.    <!-- Final CTA Section -->
  1613.    <section id="contact" class="w-full max-w-7xl mx-auto px-6 py-20 mb-20">
  1614.      <div class="relative scroll-fade text-center">
  1615.        <h2
  1616.          class="md:text-6xl text-4xl font-semibold text-white tracking-tight"
  1617.        >
  1618.          Ready to Get Your Music <br />
  1619.          on
  1620.          <span
  1621.            class="bg-clip-text text-transparent bg-gradient-to-r from-green-200 via-white to-green-400 italic font-['Playfair_Display']"
  1622.            >Nigeria's Airwaves?</span
  1623.          >
  1624.        </h2>
  1625.        <p class="mt-6 text-lg text-zinc-400 max-w-2xl mx-auto">
  1626.          Submit your track today. We'll review it within 24 hours and create a
  1627.          custom promotion strategy for your sound.
  1628.        </p>
  1629.  
  1630.        <div class="mt-10">
  1631.          <button
  1632.            onclick="
  1633.              window.open(
  1634.                'https://docs.google.com/forms/d/e/1FAIpQLSfCbfHr5JVpkgW9tFbLrT3AINN6OK7NNokbuyRqzNicT1_lXw/viewform?usp=header',
  1635.                '_blank',
  1636.              )
  1637.            "
  1638.            class="relative z-10 overflow-hidden shadow-[inset_0_1px_0_rgba(255,255,255,0.1)] transition-transform duration-150 ease-out active:scale-[0.98] text-zinc-950 bg-white border-white/20 border rounded-full px-10 py-4 font-semibold text-lg hover:bg-zinc-200"
  1639.          >
  1640.            Submit Your Track
  1641.          </button>
  1642.        </div>
  1643.  
  1644.        <div
  1645.          class="mt-8 flex items-center justify-center gap-6 text-zinc-500 text-sm"
  1646.        >
  1647.          <span>24-Hour Review</span>
  1648.          <span class="h-1 w-1 rounded-full bg-zinc-700"></span>
  1649.          <span>No Upfront Payment</span>
  1650.          <span class="h-1 w-1 rounded-full bg-zinc-700"></span>
  1651.          <span>Free Consultation</span>
  1652.        </div>
  1653.      </div>
  1654.    </section>
  1655.  
  1656.    <!-- Footer -->
  1657.    <footer class="border-t border-white/10 bg-black pt-16 pb-8">
  1658.      <div class="max-w-7xl mx-auto px-6">
  1659.        <div
  1660.          class="flex flex-col md:flex-row justify-between items-start gap-12 mb-16"
  1661.        >
  1662.          <div>
  1663.            <h4
  1664.              class="text-white text-lg font-semibold tracking-tighter uppercase mb-6"
  1665.            >
  1666.              The Scoove Africa
  1667.            </h4>
  1668.            <div class="space-y-2 text-sm text-zinc-500">
  1669.              <p>Professional A&R Services</p>
  1670.              <p>Lagos, Nigeria</p>
  1671.              <p>09131294201</p>
  1672.              <p>
  1673.                <a
  1674.                  href="mailto:hello@thescoove.africa"
  1675.                  class="hover:text-white transition-colors"
  1676.                  >hello@thescoove.africa</a
  1677.                >
  1678.              </p>
  1679.            </div>
  1680.          </div>
  1681.  
  1682.          <div class="grid grid-cols-2 gap-12 text-sm text-zinc-500">
  1683.            <div class="space-y-3">
  1684.              <a
  1685.                href="https://the-scoove-africa-ar-ele-77bb3fj.gamma.site/"
  1686.                class="block hover:text-white transition-colors"
  1687.                target="_blank"
  1688.                rel="noopener noreferrer"
  1689.                >Rate Card</a
  1690.              >
  1691.              <a
  1692.                href="#services"
  1693.                class="block hover:text-white transition-colors"
  1694.                >Services</a
  1695.              >
  1696.              <a
  1697.                href="#success"
  1698.                class="block hover:text-white transition-colors"
  1699.                >Success Stories</a
  1700.              >
  1701.              <a
  1702.                href="#process"
  1703.                class="block hover:text-white transition-colors"
  1704.                >How It Works</a
  1705.              >
  1706.            </div>
  1707.            <div class="space-y-3">
  1708.              <a
  1709.                href="https://www.instagram.com/thescoove.africa"
  1710.                target="_blank"
  1711.                rel="noopener noreferrer"
  1712.                class="block hover:text-white transition-colors"
  1713.                >Instagram</a
  1714.              >
  1715.              <a
  1716.                href="https://x.com/thescooveafrica?lang=en"
  1717.                target="_blank"
  1718.                rel="noopener noreferrer"
  1719.                class="block hover:text-white transition-colors"
  1720.                >Twitter</a
  1721.              >
  1722.              <a
  1723.                href="https://www.tiktok.com/@thescooveafrica"
  1724.                target="_blank"
  1725.                rel="noopener noreferrer"
  1726.                class="block hover:text-white transition-colors"
  1727.                >TikTok</a
  1728.              >
  1729.              <a
  1730.                href="https://www.youtube.com/channel/UCwmuDd4XmsiCjiJT8-3xsow"
  1731.                target="_blank"
  1732.                rel="noopener noreferrer"
  1733.                class="block hover:text-white transition-colors"
  1734.                >YouTube</a
  1735.              >
  1736.            </div>
  1737.          </div>
  1738.        </div>
  1739.  
  1740.        <div
  1741.          class="border-t border-white/10 pt-8 flex flex-col md:flex-row justify-between items-center gap-4 text-xs text-zinc-600"
  1742.        >
  1743.          <p>© 2026 The Scoove Africa. All rights reserved.</p>
  1744.          <p>Connecting Nigerian artists with the industry since 2021.</p>
  1745.        </div>
  1746.      </div>
  1747.    </footer>
  1748.  
  1749.    <!-- JavaScript -->
  1750.    <script>
  1751.      // Button hover effect with mouse tracking
  1752.      function btnMove(e) {
  1753.        const r = e.currentTarget.getBoundingClientRect();
  1754.        e.currentTarget.style.setProperty("--x", e.clientX - r.left + "px");
  1755.        e.currentTarget.style.setProperty("--y", e.clientY - r.top + "px");
  1756.      }
  1757.  
  1758.      // Mobile menu functionality
  1759.      function toggleMobileMenu() {
  1760.        const menu = document.getElementById("mobile-menu");
  1761.        const button = document.getElementById("mobile-menu-button");
  1762.  
  1763.        menu.classList.toggle("active");
  1764.        button.classList.toggle("active");
  1765.  
  1766.        // Prevent body scroll when menu is open
  1767.        if (menu.classList.contains("active")) {
  1768.          document.body.style.overflow = "hidden";
  1769.        } else {
  1770.          document.body.style.overflow = "";
  1771.        }
  1772.      }
  1773.  
  1774.      function closeMobileMenu() {
  1775.        const menu = document.getElementById("mobile-menu");
  1776.        const button = document.getElementById("mobile-menu-button");
  1777.  
  1778.        menu.classList.remove("active");
  1779.        button.classList.remove("active");
  1780.        document.body.style.overflow = "";
  1781.      }
  1782.  
  1783.      // Initialize mobile menu button
  1784.      document.addEventListener("DOMContentLoaded", () => {
  1785.        const mobileMenuButton = document.getElementById("mobile-menu-button");
  1786.        if (mobileMenuButton) {
  1787.          mobileMenuButton.addEventListener("click", toggleMobileMenu);
  1788.        }
  1789.  
  1790.        // Close mobile menu when clicking outside
  1791.        document.addEventListener("click", (e) => {
  1792.          const menu = document.getElementById("mobile-menu");
  1793.          const button = document.getElementById("mobile-menu-button");
  1794.  
  1795.          if (
  1796.            menu &&
  1797.            button &&
  1798.            !menu.contains(e.target) &&
  1799.            !button.contains(e.target) &&
  1800.            menu.classList.contains("active")
  1801.          ) {
  1802.            closeMobileMenu();
  1803.          }
  1804.        });
  1805.      });
  1806.      // Close mobile menu on escape key
  1807.      document.addEventListener("keydown", (e) => {
  1808.        if (e.key === "Escape") {
  1809.          closeMobileMenu();
  1810.        }
  1811.      });
  1812.  
  1813.      // Scroll reveal animations
  1814.      const observerOptions = {
  1815.        root: null,
  1816.        rootMargin: "0px 0px -50px 0px",
  1817.        threshold: 0.1,
  1818.      };
  1819.  
  1820.      const observer = new IntersectionObserver((entries) => {
  1821.        entries.forEach((entry) => {
  1822.          if (entry.isIntersecting) {
  1823.            entry.target.classList.add("visible");
  1824.            observer.unobserve(entry.target);
  1825.          }
  1826.        });
  1827.      }, observerOptions);
  1828.  
  1829.      // Initialize on DOM ready
  1830.      document.addEventListener("DOMContentLoaded", () => {
  1831.        // Check for elements already visible on load
  1832.        requestAnimationFrame(() => {
  1833.          document.querySelectorAll(".scroll-fade").forEach((el) => {
  1834.            const rect = el.getBoundingClientRect();
  1835.            if (rect.top < window.innerHeight * 0.9 && rect.bottom > 0) {
  1836.              el.classList.add("visible");
  1837.            } else {
  1838.              observer.observe(el);
  1839.            }
  1840.          });
  1841.        });
  1842.  
  1843.        // FAQ Accordion
  1844.        document.querySelectorAll("[data-faq-toggle]").forEach((button) => {
  1845.          button.addEventListener("click", () => {
  1846.            const faqItem = button.closest(".faq-item");
  1847.            const content = faqItem.querySelector(".faq-content");
  1848.            const icon = button.querySelector('[data-lucide="chevron-down"]');
  1849.            const isOpen =
  1850.              content.style.maxHeight && content.style.maxHeight !== "0px";
  1851.  
  1852.            // Close all other FAQ items
  1853.            document.querySelectorAll(".faq-item").forEach((item) => {
  1854.              const otherContent = item.querySelector(".faq-content");
  1855.              const otherIcon = item.querySelector(
  1856.                '[data-lucide="chevron-down"]',
  1857.              );
  1858.              if (item !== faqItem) {
  1859.                otherContent.style.maxHeight = "0px";
  1860.                if (otherIcon) otherIcon.style.transform = "rotate(0deg)";
  1861.              }
  1862.            });
  1863.  
  1864.            // Toggle current item
  1865.            if (isOpen) {
  1866.              content.style.maxHeight = "0px";
  1867.              if (icon) icon.style.transform = "rotate(0deg)";
  1868.            } else {
  1869.              content.style.maxHeight = content.scrollHeight + "px";
  1870.              if (icon) icon.style.transform = "rotate(180deg)";
  1871.            }
  1872.          });
  1873.        });
  1874.      });
  1875.    </script>
  1876.    <script id="dhws-dataInjector" src="/public/dhws-data-injector.js"></script>
  1877.  </body>
  1878. </html>
  1879.  

Home · About · News · Docs · Terms

 
Copyright © 2002-9 Sam Ruby, Mark Pilgrim, Joseph Walton, and Phil Ringnalda