:root {
      --purple: #7B5EA7;
      --purple-light: #9B7FCC;
      --purple-vivid: #8B5CF6;
      --purple-btn: #7C3AED;
      --indigo: #6366F1;
      --bg-dark: #dedede;
      --bg-card: #13101F;
      --bg-card2: #1A1530;
      --text-main:   #575757;;
      --text-muted: #9B93B8;
      --border: rgba(123,94,167,0.25);
      --gradient-hero: linear-gradient(135deg, #7B5EA7 0%, #A78BFA 50%, #C4B5FD 100%);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    body {
      font-family: 'DM Sans', sans-serif;
      background: var(--bg-dark);
      color: var(--text-main);
      overflow-x: hidden;
    }

    h1, h2, h3, h4, h5, h6 { font-family: 'Syne', sans-serif; }

    /* ─── NAVBAR ─────────────────────────────────────── */
    .navbar-custom {
      background: rgb(255 255 255 / 54%);
      backdrop-filter: blur(16px);
      padding: 20px 0;
      position: sticky;
      top: 0;
      z-index: 1000;
      border-radius: 0 0 20px 20px;
    }
    .navbar-brand img {height: 55px;}
    .navbar-brand span {
      font-family: 'Syne', sans-serif;
      font-weight: 800;
      font-size: 1.25rem;
      color: #fff;
      letter-spacing: -0.5px;
    }
    .navbar-brand span em { color: var(--purple-vivid); font-style: normal; }
    .btn-contact {
      background: var(--purple-btn);
      color: #fff;
      border: none;
      border-radius: 50px;
      padding: 15px 30px;
      font-weight: 600;
      font-size: .875rem;
      transition: background .2s, transform .2s;
    }
    .btn-contact:hover { background: #6D28D9; color: #fff; transform: translateY(-1px); }
    .navbar-toggler { border-color: var(--border); }
    .navbar-toggler-icon { filter: invert(1); }

    /* ─── HERO ───────────────────────────────────────── */
    .hero {
      min-height: 100vh;
      display: flex;
      align-items: center;
      position: relative;
      overflow: hidden;
      padding: 150px 0 100px;
      background: #f6f5ff;
      margin-top: -90px;
    }
    .hero-blob {
      position: absolute;
      top: -100px;
      left: -160px;
      width: 620px;
      height: 620px;
      background: radial-gradient(circle at 50% 50%, rgba(139,92,246,.55) 0%, rgba(99,102,241,.3) 40%, transparent 70%);
      border-radius: 50%;
      filter: blur(60px);
      pointer-events: none;
      animation: blobPulse 6s ease-in-out infinite;
    }
    .hero-blob2 {
      position: absolute;
      bottom: -80px; left: -100px;
      width: 400px; height: 400px;
      background: radial-gradient(circle at 50% 50%, rgba(167,139,250,.3) 0%, transparent 70%);
      border-radius: 50%;
      filter: blur(50px);
      pointer-events: none;
      animation: blobPulse 8s ease-in-out infinite reverse;
    }
    @keyframes blobPulse {
      0%,100%{ transform: scale(1) translate(0,0); }
      50%{ transform: scale(1.1) translate(20px,-20px); }
    }
    .hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(139,92,246,.12);
      border: 1px solid rgba(139,92,246,.3);
      border-radius: 50px;
      padding: 6px 16px;
      font-size: .8rem;
      font-weight: 600;
      color: #5a1fbd;
      letter-spacing: .5px;
      text-transform: uppercase;
      margin-bottom: 20px;
    }
    .hero h1 {
      font-size: clamp(2.5rem, 6vw, 4rem);
      font-weight: 800;
      line-height: 1.1;
      margin-bottom: 20px;
      color: #000;
    }
    .hero h1 .highlight {
      background: var(--gradient-hero);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .hero p.lead {
      color: var(--text-muted); font-size: 1.05rem;
      line-height: 1.7; max-width: 500px;
      margin-bottom: 32px;
    }
    .hero-email-form {
      display: flex; gap: 8px;
      background: rgba(255,255,255,.06);
      border: 1px solid var(--border);
      border-radius: 50px;
      padding: 6px 6px 6px 18px;
      max-width: 420px;
      margin-bottom: 20px;
    }
    .hero-email-form input {
      background: transparent; border: none; outline: none;
      color: #fff; font-size: .9rem; flex: 1; min-width: 0;
    }
    .hero-email-form input::placeholder { color: var(--text-muted); }
    .btn-purple-pill {
      background: var(--purple-btn);
      color: #fff; border: none;
      border-radius: 50px; padding: 10px 20px;
      font-weight: 600; font-size: .875rem;
      white-space: nowrap; cursor: pointer;
      transition: background .2s, transform .2s;
    }
    .btn-purple-pill:hover { background: #6D28D9; transform: scale(1.03); }
    .hero-fire-note {
      font-size: .8rem; color: var(--text-muted);
    }
    .hero-socials {
      display: flex;
      align-items: center;
      /* gap: 14px; */
      margin-top: 32px;
    }
    .hero-socials .social-icon {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: rgba(255,255,255,.06);
      border: 1px solid rgb(124 58 237);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--text-muted);
      text-decoration: none;
      font-size: 1rem;
      transition: background .2s, color .2s;
    }
    .hero-socials .social-icon:hover { background: var(--purple-btn); color: #fff; }
    .hero-socials .community-label { color: var(--text-muted); font-size: .85rem; }
    .hero-img-wrap {
      position: relative; display: flex; align-items: center; justify-content: center;
    }
    .hero-orb {
      width: min(460px, 90vw); height: min(460px, 90vw);
      background: radial-gradient(circle, rgba(139,92,246,.35) 0%, rgba(99,102,241,.15) 50%, transparent 75%);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      position: relative;
      animation: orbFloat 5s ease-in-out infinite;
    }
    @keyframes orbFloat {
      0%,100%{ transform: translateY(0); }
      50%{ transform: translateY(-18px); }
    }
    .hero-orb::before {
      content: '';
      position: absolute; inset: 30px;
      border-radius: 50%;
      border: 1px solid rgba(139,92,246,.3);
      animation: spin 20s linear infinite;
    }
    .hero-orb::after {
      content: '';
      position: absolute; inset: 60px;
      border-radius: 50%;
      border: 1px dashed rgba(139,92,246,.2);
      animation: spin 14s linear infinite reverse;
    }
    @keyframes spin { to{ transform: rotate(360deg); } }
    .hero-orb-inner {
      width: 200px; height: 200px;
      background: var(--gradient-hero);
      border-radius: 50%;
      opacity: .7;
      filter: blur(8px);
    }

    /* ─── SECTION COMMON ─────────────────────────────── */
    section { padding: 90px 0; }
    .section-label {
      font-size: .75rem; font-weight: 700; letter-spacing: 2px;
      text-transform: uppercase; color: var(--purple-light);
      margin-bottom: 10px;
    }
    .section-title {
      font-size: clamp(1.8rem, 4vw, 2.8rem);
      font-weight: 800;
      line-height: 1.15;
      margin-bottom: 18px;
      color: #000;
    }
    .section-title .accent { color: var(--purple-vivid); }
    .section-body { color: var(--text-muted); line-height: 1.75; font-size: 1rem; max-width: 520px; }

    /* ─── MODELFI FEATURES ───────────────────────────── */
    .features-section { background: var(--bg-dark); }
    .feature-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 20px;
      padding: 32px 28px;
      height: 100%;
      transition: transform .3s, border-color .3s, box-shadow .3s;
      position: relative;
      overflow: hidden;
      margin-top: 30px;
    }
    .feature-card::before {
      content: ''; position: absolute;
      top: 0; left: 0; right: 0; height: 2px;
      background: var(--gradient-hero);
      opacity: 0; transition: opacity .3s;
    }
    .feature-card:hover { transform: translateY(-6px); border-color: rgba(139,92,246,.5); box-shadow: 0 20px 60px rgba(139,92,246,.15); }
    .feature-card:hover::before { opacity: 1; }
    .feature-icon {
      width: 52px; height: 52px; border-radius: 14px;
      background: rgba(139,92,246,.15);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.4rem; color: var(--purple-vivid);
      margin-bottom: 18px;
    }
    .feature-card h5 { font-size: 1.1rem; font-weight: 700; margin-bottom: 10px; }
    .feature-card p { color: var(--text-muted); font-size: .9rem; line-height: 1.65; margin: 0; }

    /* ─── MODEL ECONOMY ──────────────────────────────── */
    .economy-section {/* background: linear-gradient(180deg, var(--bg-dark) 0%, #0F0C1C 100%); */}
    .economy-visual {
      background: var(--bg-card2);
      border: 1px solid var(--border);
      border-radius: 24px; padding: 24px;
      position: relative; overflow: hidden;
    }
    .economy-visual::after {
      content: ''; position: absolute;
      top: -40%; right: -20%;
      width: 300px; height: 300px;
      background: radial-gradient(circle, rgba(139,92,246,.2) 0%, transparent 70%);
      border-radius: 50%; pointer-events: none;
    }
    .token-row {
      display: flex; align-items: center; justify-content: space-between;
      background: rgba(255,255,255,.04);
      border: 1px solid var(--border);
      border-radius: 12px; padding: 14px 18px;
      margin-bottom: 10px;
      gap: 12px;
    }
    .token-row:last-child { margin-bottom: 0; }
    .token-avatar {
      width: 36px; height: 36px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-weight: 800; font-size: .8rem;
      flex-shrink: 0;
    }
    .token-name { font-weight: 600; font-size: .9rem; }
    .token-price { color: var(--text-muted); font-size: .8rem; }
    .badge-green { background: rgba(34,197,94,.15); color: #22c55e; border-radius: 50px; padding: 3px 10px; font-size: .75rem; font-weight: 600; }
    .badge-red { background: rgba(239,68,68,.15); color: #ef4444; border-radius: 50px; padding: 3px 10px; font-size: .75rem; font-weight: 600; }
    .economy-header {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 20px;
    }
    .economy-header .avatar-big {
      width: 50px; height: 50px; border-radius: 50%;
      background: var(--gradient-hero); display: flex; align-items: center; justify-content: center;
      font-weight: 800; font-size: 1.1rem;
    }
    .economy-header h6 { font-size: .95rem; font-weight: 700; margin: 0; }
    .economy-header small { color: var(--text-muted); font-size: .8rem; }
    .economy-stats {
      display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 14px;
    }
    .stat-pill {
      background: rgba(255,255,255,.04); border: 1px solid var(--border);
      border-radius: 10px; padding: 10px; text-align: center;
    }
    .stat-pill .val { font-weight: 700; font-size: .95rem; color: #A78BFA; }
    .stat-pill .lbl { color: var(--text-muted); font-size: .7rem; }

    /* ─── MODEL STORE ────────────────────────────────── */
    .store-section { background: #0F0C1C; }
    .store-visual {
      background: var(--bg-card2);
      border: 1px solid var(--border);
      border-radius: 24px; overflow: hidden;
    }
    .store-header-bar {
      background: rgba(255,255,255,.04); border-bottom: 1px solid var(--border);
      padding: 14px 20px; display: flex; align-items: center; gap: 8px;
    }
    .store-dot { width: 10px; height: 10px; border-radius: 50%; }
    .store-body { padding: 20px; }
    .store-card {
      background: rgba(255,255,255,.04);
      border: 1px solid var(--border);
      border-radius: 14px; padding: 16px 18px;
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 10px; gap: 12px;
      transition: background .2s;
    }
    .store-card:hover { background: rgba(139,92,246,.1); }
    .store-card:last-child { margin-bottom: 0; }
    .store-card-icon {
      width: 40px; height: 40px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem; flex-shrink: 0;
    }
    .store-card h6 { font-size: .9rem; font-weight: 600; margin: 0 0 3px; }
    .store-card small { color: var(--text-muted); font-size: .78rem; }
    .btn-store {
      background: var(--purple-btn); color: #fff;
      border: none; border-radius: 8px; padding: 7px 16px;
      font-size: .8rem; font-weight: 600; cursor: pointer; white-space: nowrap;
      flex-shrink: 0;
    }
    .btn-store-outline {
      background: transparent; color: var(--purple-light);
      border: 1px solid var(--border); border-radius: 8px; padding: 7px 16px;
      font-size: .8rem; font-weight: 600; cursor: pointer; white-space: nowrap;
      flex-shrink: 0;
    }
    .store-rating { color: #F59E0B; font-size: .75rem; }

    /* ─── MODEL NETWORK ──────────────────────────────── */
    .network-section {background: #0f0c1c;}
    .network-globe {
      position: relative; display: flex; align-items: center; justify-content: center;
    }
    .globe-ring {
      width: min(380px,85vw); height: min(380px,85vw);
      border-radius: 50%;
      border: 1px solid rgba(139,92,246,.25);
      display: flex; align-items: center; justify-content: center;
      position: relative;
      animation: orbFloat 6s ease-in-out infinite;
    }
    .globe-ring::before {
      content: ''; position: absolute; inset: 40px; border-radius: 50%;
      border: 1px dashed rgba(139,92,246,.18);
    }
    .globe-ring::after {
      content: ''; position: absolute; inset: 80px; border-radius: 50%;
      border: 1px solid rgba(139,92,246,.12);
    }
    .globe-core {
      width: 160px; height: 160px; border-radius: 50%;
      background: radial-gradient(circle, rgba(139,92,246,.6) 0%, rgba(99,102,241,.3) 50%, transparent 80%);
      filter: blur(4px);
    }
    .node-dot {
      position: absolute; width: 8px; height: 8px; border-radius: 50%;
      background: var(--purple-vivid); box-shadow: 0 0 10px var(--purple-vivid);
    }
.chat-icon{
        position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
}
    /* ─── PRICING ────────────────────────────────────── */
    .pricing-section { background: var(--bg-dark); }
    .pricing-toggle {
      display: inline-flex; gap: 0;
      background: rgba(255,255,255,.05); border: 1px solid var(--border);
      border-radius: 50px; padding: 4px; margin-bottom: 50px;
    }
    .pricing-toggle button {
      background: transparent; border: none;
      border-radius: 50px; padding: 8px 24px;
      font-size: .85rem; font-weight: 600; cursor: pointer;
      color: var(--text-muted); transition: all .2s;
    }
    .pricing-toggle button.active {
      background: var(--purple-btn); color: #fff;
    }
    .pricing-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 24px;
      padding: 36px 32px;
      height: 100%;
      position: relative;
      transition: transform .3s, box-shadow .3s;
      margin-top: 30px;
    }
    .pricing-card:hover { transform: translateY(-6px); box-shadow: 0 24px 80px rgba(139,92,246,.18); }
    .pricing-card.popular {
      background: linear-gradient(145deg, #1E1538 0%, #15102A 100%);
      border-color: rgba(139,92,246,.6);
    }
    .pricing-card.popular::before {
      content: ''; position: absolute;
      top: 0; left: 0; right: 0; height: 3px;
      background: var(--gradient-hero);
    }
    .popular-badge {
      position: absolute; top: 22px; right: 22px;
      background: var(--purple-btn); color: #fff;
      border-radius: 50px; padding: 4px 14px;
      font-size: .72rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: .5px;
    }
    .pricing-plan-name {font-size: .8rem;font-weight: 700;letter-spacing: 1.5px;text-transform: uppercase;color: #ffffff;margin-bottom: 8px;background: #6935f7;display: inline-block;padding: 4px 17px;border-radius: 30px;}
    .pricing-price {
      margin-bottom: 20px;
      font-family: 'Syne', sans-serif;
      font-size: 3rem;
      font-weight: 800;
      line-height: 1;
      margin-bottom: 20px;
      margin-top: 30px;
    }
    .pricing-price sup { font-size: 1.4rem; vertical-align: super; }
    .pricing-price .period { font-size: 1rem; color: var(--text-muted); font-weight: 400; }
    .pricing-desc { color: var(--text-muted); font-size: .88rem; margin-bottom: 28px; line-height: 1.6; }
    .pricing-divider { border-color: var(--border); margin: 0 0 24px; }
    .pricing-feature {
      display: flex; align-items: flex-start; gap: 12px;
      margin-bottom: 14px; font-size: .88rem;
    }
    .pricing-feature .check-icon {
      width: 20px; height: 20px; border-radius: 50%;
      background: rgba(139,92,246,.2); color: var(--purple-vivid);
      display: flex; align-items: center; justify-content: center;
      font-size: .7rem; flex-shrink: 0; margin-top: 1px;
    }
    .pricing-feature .check-icon.muted { background: rgba(255,255,255,.06); color: var(--text-muted); }
    .pricing-feature span { color: var(--text-muted); line-height: 1.5; }
    .pricing-feature span strong { color: #fff; }
    .btn-pricing {
      display: block; width: 100%;
      background: var(--purple-btn); color: #fff;
      border: none; border-radius: 50px; padding: 13px;
      font-weight: 700; font-size: .9rem; cursor: pointer; margin-top: 28px;
      transition: background .2s, transform .2s;
    }
    .btn-pricing:hover { background: #6D28D9; transform: scale(1.02); }
    .btn-pricing.outline {
      background: transparent; border: 1px solid var(--border);
      color: var(--text-main);
    }
    .btn-pricing.outline:hover { background: rgba(139,92,246,.12); border-color: rgba(139,92,246,.5); }

    /* ─── CTA ────────────────────────────────────────── */
    .cta-section {
      background: linear-gradient(180deg, var(--bg-dark) 0%, #100D1E 100%);
    }
    .cta-box {
      background: linear-gradient(135deg, rgba(139,92,246,.12) 0%, rgba(99,102,241,.08) 100%);
      border: 1px solid rgba(139,92,246,.3);
      border-radius: 28px; padding: 70px 40px;
      text-align: center; position: relative; overflow: hidden;
    }
    .cta-box::before {
      content: ''; position: absolute;
      top: -60px; left: 50%; transform: translateX(-50%);
      width: 400px; height: 300px;
      background: radial-gradient(circle, rgba(139,92,246,.25) 0%, transparent 70%);
      border-radius: 50%; pointer-events: none;
    }
    .cta-box h2 { font-size: clamp(1.8rem,4vw,2.8rem); font-weight: 800; margin-bottom: 14px; }
    .cta-box p { color: var(--text-muted); max-width: 460px; margin: 0 auto 32px; line-height: 1.7; }
    .cta-email-form {
      display: flex; gap: 8px; max-width: 400px; margin: 0 auto 14px;
      background: rgba(255,255,255,.06); border: 1px solid var(--border);
      border-radius: 50px; padding: 6px 6px 6px 18px;
    }
    .cta-email-form input {
      background: transparent; border: none; outline: none;
      color: #fff; font-size: .9rem; flex: 1; min-width: 0;
    }
    .cta-email-form input::placeholder { color: var(--text-muted); }

    /* ─── PARTNERS ───────────────────────────────────── */
    .partners-section { background: #0A0812; padding: 70px 0; }
    .partner-logo {
      display: flex; align-items: center; justify-content: center;
      filter: brightness(0) invert(.5);
      transition: filter .2s;
      padding: 12px 24px;
    }
    .partner-logo:hover { filter: brightness(0) invert(.85); }
    .partner-logo span {
      font-family: 'Syne', sans-serif;
      font-weight: 800; font-size: 1.1rem; letter-spacing: -0.5px;
    }
    .partner-logo i { font-size: 1.4rem; margin-right: 6px; }
    .btn-partner {
      background: var(--purple-btn); color: #fff; border: none;
      border-radius: 50px; padding: 10px 22px;
      font-weight: 600; font-size: .85rem; cursor: pointer;
      transition: background .2s;
    }
    .btn-partner:hover { background: #6D28D9; }

    /* ─── COMMUNITY ──────────────────────────────────── */
    .community-section { background: var(--bg-dark); }
    .community-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 20px;
      padding: 32px;
      text-align: center;
      height: 100%;
      transition: transform .3s, border-color .3s;
      cursor: pointer;
      margin-top: 20px;
    }
    .community-card:hover { transform: translateY(-6px); border-color: rgba(139,92,246,.5); }
    .community-card .com-icon {
      width: 80px;
      height: 80px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 16px;
      font-size: 1.6rem;
      padding: 14px;
    }
    .community-card h5 { font-size: 1rem; font-weight: 700; margin-bottom: 6px; }
    .community-card p { color: var(--text-muted); font-size: .85rem; margin: 0; }

    /* ─── CONTACT ────────────────────────────────────── */
    .contact-section {padding: 80px 0;}
    .contact-section h2 {font-size: clamp(1.8rem,4vw,2.6rem);font-weight: 800;margin-bottom: 14px;color: #000;}
    .contact-section p { color: var(--text-muted); max-width: 480px; line-height: 1.7; margin-bottom: 32px; }

    /* ─── FOOTER ─────────────────────────────────────── */
    footer {
      background: #070610; border-top: 1px solid var(--border);
      padding: 24px 0;
    }
    footer .foot-brand { font-family: 'Syne',sans-serif; font-weight: 800; font-size: 1.1rem; }
    footer .foot-brand em { color: var(--purple-vivid); font-style: normal; }
    footer small { color: var(--text-muted); font-size: .78rem; }
    footer .foot-social { display: flex; gap: 12px; }
    footer .foot-social a {
      width: 34px; height: 34px; border-radius: 50%;
      background: rgba(255,255,255,.05); border: 1px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      color: var(--text-muted); font-size: .9rem; text-decoration: none;
      transition: background .2s, color .2s;
    }
    footer .foot-social a:hover { background: var(--purple-btn); color: #fff; }

    /* ─── DIVIDER ─────────────────────────────────────── */
    .section-divider {
      width: 60px; height: 3px;
      background: var(--gradient-hero);
      border-radius: 3px; margin-bottom: 20px;
    }

    /* ─── ANIMATIONS ─────────────────────────────────── */
    .fade-up {
      opacity: 0; transform: translateY(30px);
      transition: opacity .6s ease, transform .6s ease;
    }
    .fade-up.visible { opacity: 1; transform: translateY(0); }

    /* ─── RESPONSIVE TWEAKS ───────────────────────────── */
    @media (max-width: 768px) {
      section { padding: 60px 0; }
      .hero { padding: 90px 0 60px; }
      .hero-email-form { flex-direction: column; border-radius: 14px; padding: 12px; }
      .hero-email-form input { padding: 8px 4px; }
      .btn-purple-pill { width: 100%; text-align: center; }
      .cta-email-form { flex-direction: column; border-radius: 14px; padding: 12px; }
      .cta-email-form input { padding: 8px 4px; }
    }
    .bann-vi video {
        max-width: 900px;
        height: 900px;
    }
    .bann-vi{
        position: absolute;
        right: -15%;
        top: -17%;
    }
    .social-icon img{
        width: 31px;
    }
    .feature-icon img{
        padding: 10px;
    }
  

.network-section .section-title {
    
    color: #fff;
}
.con-cont{
    background: #fff;
    border-radius: 40px;
    background: url(../images/con-bg.jpg) no-repeat center;
    background-size: cover;
    padding: 50px 60px;
    margin: 0 100px;
    width: auto;
}
.plan-pop{
    font-size: 14px;
    position: absolute;
    top: -17px;
    background: #ffffff;
    padding: 0px 15px;
    border-radius: 40px;
    border: 1px solid #6935f7;
    z-index: 99;
    right: 22px;
    font-weight: 600;
    color: #7c3aed;
    text-transform: uppercase;
    text-align: center;
}