:root {
      --bg: #000;
      --text: #fff;
      --accent: #ffffff;
      --card-bg: rgb(136 136 136 / 20%);
      --transition: 0.4s;
      --fade-width: 100px;
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {background: var(--bg);color: var(--text);line-height: 1.6;font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif; overflow-x: hidden;}
    .container {max-width: 1300px;margin: auto;padding: 20px;}
    header {display: flex;align-items: center;justify-content: space-between;padding: 0;}
    .logo { font-size: 1.5rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
    nav { display: flex; gap: 24px; }
    nav a { position: relative; text-decoration: none; color: var(--text); font-weight: 500;
      padding: 4px 0; transition: color var(--transition);
    }
    nav a::after {
      content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px;
      background: var(--accent); transition: width var(--transition);
    }
    nav a:hover { color: var(--accent); }
    nav a:hover::after { width: 100%; }
    .logo img {
      height: 30px;
    }
    .btn {
      display: inline-block;
      padding: 12px 28px;
      border-radius: 999px;
      font-weight: 600;
      text-decoration: none;
      transition: transform var(--transition), box-shadow var(--transition);
    }
    .btn-primary { background: var(--accent); color: var(--bg); }
    .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(77,90,255,0.4); }
    .btn-outline {border: 2px solid var(--accent);color: var(--accent);padding: 10px 26px;}
    .btn-outline:hover { background: var(--accent); color: var(--bg); transform: translateY(-2px); }

    /* Hero Section */
    .hero {position: relative;padding: 0px 25px 25px 25px;overflow: hidden;place-items: center;background: radial-gradient(140% 107.13% at 50% 10%, transparent 37.41%, #63e 69.27%, #fff 100%);border-radius: 40px;}
    .hero .content { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
    .hero .text { flex: 1 1 400px; }
    .hero h1 {font-size: 2rem;margin-bottom: 16px;}
    .hero p {font-size: 1rem;margin-bottom: 24px;color: #ccc;}
    .hero .image video {width: 100%;max-width: 550px;animation: float 6s ease-in-out infinite;}
    @keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-15px); }}
    .image {
      max-height: 400px;
    }
    .images {
      margin-top: 25px;
      border-radius: 25px;
      background: #262629;
      padding: 15px;
      border: 1px solid #333333;
      max-width: 600px;
      margin-bottom: 50px;
    }
    /* Cards */
    .cards {display: flex;flex-wrap: wrap;gap: 24px;margin-top: 0px;}
    .card {
      background: var(--card-bg);
      border-radius: 15px;
      padding: 24px;
      flex: 1 1 280px;
      transition: transform var(--transition), background var(--transition);
      transform: perspective(600px);
      border: 1px solid #ffffff29;
      backdrop-filter: blur(10px);
      background-image: url(bg.png);
      background-repeat: no-repeat;
      background-size: contain;
    }
    .card:hover {
      background: #ffffff1f;
            background-image: url(bg.png);
      background-repeat: no-repeat;
      background-size: contain;
      transform: perspective(600px) rotateX(5deg) rotateY(5deg) translateY(-10px);
    }
    .card h3 {font-size: 1.1rem;margin-bottom: 12px;}
    .card p {font-size: 0.95rem;margin-bottom: 16px;color: #ffffffb5;}

    /* Partners Marquee Full-Width & Fade */
    .rp-partners-wrapper {position: relative;width: 100vw;left: 50%;margin-left: -50vw;overflow: hidden;padding: 0 var(--fade-width);}
    .rp-partners-wrapper::before, .rp-partners-wrapper::after { content: ''; position: absolute; top: 0; bottom: 0; width: var(--fade-width); pointer-events: none; z-index: 2; }
    .rp-partners-wrapper::before { left: 0; background: linear-gradient(to right, var(--bg) 0%, transparent 100%); }
    .rp-partners-wrapper::after { right: 0; background: linear-gradient(to left, var(--bg) 0%, transparent 100%); }
    .rp-partners {margin: 40px 0;opacity: 0.5;}
    .rp-marquee { display: flex; gap: 40px; animation: rpMarqueeAnimation 30s linear infinite; }
    .rp-marquee-item { height: 50px; object-fit: contain; filter: brightness(0) invert(1); }
    .rp-marquee:hover { animation-play-state: paused; }
    @keyframes rpMarqueeAnimation { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); }}

    /* Generic Section */
    .section {display: flex;flex-wrap: wrap;align-items: center;gap: 40px;margin-bottom: 60px;background: #777;border-radius: 40px;padding: 0px 25px 0px 25px;background-color: #1a191c;border: 1px solid #333333;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);}
    .section.reverse { flex-direction: row-reverse; }
    .section .text { flex: 1 1 400px; }
    .section h2 { font-size: 2rem; margin-bottom: 16px; }
    .section p { font-size: 1rem; color: #ccc; margin-bottom: 24px; }

    /* FAQ Accordion */
    .faq { margin-bottom: 80px; }
    .faq h2 { font-size: 2rem; text-align: center; margin-bottom: 32px; }
    .accordion {max-width: 1000px;margin: auto;}
    .accordion-item {background: rgb(26 25 28);border-radius: 15px;margin-bottom: 12px;overflow: hidden;}
    .accordion-header { padding: 16px; cursor: pointer; position: relative; }
    .accordion-header::after { content: '\25BC'; position: absolute; right: 16px; transition: transform var(--transition); }
    .accordion-header.active::after { transform: rotate(180deg); }
    .accordion-body { max-height: 0; padding: 0 16px; transition: max-height var(--transition), padding var(--transition); }
    .accordion-body.open {max-height: 200px;padding: 16px;background: #262629;}

    /* CTA */
    .cta {text-align: center;padding: 80px 20px;margin-bottom: 40px;background: radial-gradient(140% 107.13% at 50% 10%, transparent 37.41%, #63e 69.27%, #fff 100%);border-radius: 40px;}
    .cta p.tag {color: #7548ef;text-transform: uppercase;letter-spacing: 1px;font-weight:600;margin-bottom:8px;}
    .cta h2 { font-size: 2.5rem; margin-bottom: 16px; }
    .cta p { font-size: 1rem; color: #ccc; margin-bottom: 24px; }

    /* Footer */
    footer {padding: 40px 0 0 0;border-top: 1px solid rgba(255,255,255,0.1);}
    .footer-cols { display: flex; flex-wrap: wrap; gap: 40px; justify-content: space-between; margin-bottom: 24px; }
    .footer-col h4 { font-size: 1.1rem; margin-bottom: 12px; }
    .footer-col ul { list-style: none; }
    .footer-col ul li { margin-bottom: 8px; }
    .footer-col ul li a { color: #ccc; text-decoration: none; font-size: 0.9rem; transition: color var(--transition); }
    .footer-col ul li a:hover { color: var(--accent); }
    .footer-bottom { text-align: center; font-size: 0.85rem; color: #555; }