:root{
    --purple: #7B0FA6;
    --purple-dark: #5B0C7D;
    --magenta: #C026C0;
    --ink: #150A26;
    --footer-bg: #170826;
    --footer-bg-2: #1F0A32;
    --text-dim: #A99BB8;
    --border-soft: rgba(255,255,255,0.08);
    --header-h: 84px;
  } 

  html, body{
    max-width: 100%;
    overflow-x: hidden;
  }

  body{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--ink);
    background:#fff;
  }

  a{ text-decoration:none; color:inherit; } 
  
  button{ font-family:inherit; }

  /* ============ HEADER ============ */
  .header{
    position: sticky;
    top:0;
    z-index: 1000;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(10px); 
  }

  .header-inner{
    max-width: 1280px;
    margin: 0 auto;
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 48px;
    padding: 18px 0px;
  }

  .logo{
    display:flex;
    align-items:center;
    gap:8px;
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.02em;
    white-space:nowrap;
  }
  .logo .dot{
    width: 22px; height:22px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #FF7A5C, #C81E3C);
    display:inline-block;
    flex-shrink:0;
  }
  .logo .cap-i{ color: var(--purple); }

  .nav-cta-group{
    display:flex;
    align-items:center;
    justify-content: space-between;
    flex: 1;
    gap: 24px;
    min-width: 0;
  }

  .primary-nav{
    display:flex;
    align-items:center;
    gap: 4px;
    flex: 0 0 auto;
    min-width: 0;
  }

  .nav-item{
    position:relative;
  }

  .nav-link{
    display:flex;
    align-items:center;
    gap:6px;
    padding: 10px 16px;
    font-size: 15px;
    font-weight: 500;
    color:#2B2338;
    border-radius: 8px;
    cursor:pointer;
    transition: color .15s ease, background .15s ease;
  }
  .nav-link:hover{ color: var(--purple); }
  .nav-item.active > .nav-link{
    color: var(--magenta);
    font-weight: 600;
  }
  .nav-item.active > .nav-link::after{
    content:"";
    position:absolute;
    left:16px; right:16px; bottom:2px;
    height:2px;
    background: var(--magenta);
    border-radius:2px;
  }

  .chevron{
    width:10px; height:10px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform: rotate(45deg);
    margin-top:-4px;
    transition: transform .2s ease;
    flex-shrink:0;
  }
  .nav-item.dropdown-open .chevron{
    transform: rotate(-135deg);
    margin-top:2px;
  }

  .cta-btn{
    background: linear-gradient(135deg, var(--purple), var(--magenta));
    color:#fff;
    font-weight: 600;
    font-size: 15px;
    padding: 12px 22px;
    border-radius: 999px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
    box-shadow: 0 6px 16px rgba(123,15,166,0.28);
    border:none;
    cursor:pointer;
    transition: transform .15s ease, box-shadow .15s ease;
  }
  .cta-btn:hover{ transform: translateY(-1px); box-shadow: 0 8px 20px rgba(123,15,166,0.36); }
  .cta-btn svg{ width:14px; height:14px; }

  /* Dropdown (mega menu) — visibility is controlled entirely via JS-toggled
     .dropdown-open class (mouseenter/mouseleave with a close-delay, or tap
     on mobile). No CSS :hover trigger, so there's no dead zone between the
     nav link and the panel that causes it to vanish while moving the mouse. */
  .dropdown-panel{
    position:absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    width: 460px;
    background:#fff;
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(20,10,40,0.18);
    padding: 28px 32px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
  /* Invisible bridge that closes the gap between the link and the panel so
     the pointer never leaves a hoverable area of .nav-item while travelling
     down to the menu. */
  .dropdown-panel::before{
    content:"";
    position:absolute;
    top:-10px; left:0; right:0; height:10px;
  }
  .nav-item.dropdown-open .dropdown-panel{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform: translateX(-50%) translateY(0);
  }
  .dropdown-panel--wide{
    width: 560px;
    grid-template-columns: repeat(3, 1fr);
  }

  .dropdown-header{
    grid-column: 1 / -1;
    display:flex;
    align-items:center;
    justify-content: space-between;
    padding-bottom: 14px;
    margin-bottom: 6px;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }
  .dropdown-header .label{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--magenta);
  }
  .dropdown-header .view-all{
    font-size: 13px;
    font-weight: 600;
    color:#2B2338;
    display:flex;
    align-items:center;
    gap:4px;
  }

  .dropdown-col .col-title{
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #9A93A8;
    margin-bottom: 14px;
  }
  .dropdown-col a{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    color:#241B33;
    padding: 10px 14px;
    margin-left: 4px;
    border-radius: 10px;
    position: relative;
    transition: background .15s ease, color .15s ease;
  }
  .dropdown-col a:hover, .dropdown-col a:focus-visible{
    background: #EEF1FC;
    border-left:3px solid var(--magenta);
  }  

  /* Mobile toggle */
  .menu-toggle{
    display:none;
    width: 40px; height:40px;
    border:none;
    background:transparent;
    cursor:pointer;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
  }
  .menu-toggle span{
    width: 22px; height:2px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
  }
  .menu-toggle.open span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .menu-toggle.open span:nth-child(2){ opacity:0; }
  .menu-toggle.open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  /* ============ FOOTER ============ */
  .footer{
    background: linear-gradient(160deg, var(--footer-bg), var(--footer-bg-2));
    color: #EDE8F5;
    padding: 72px 32px 28px;
  }
  .footer-inner{
    max-width: 1280px;
    margin: 0 auto;
  }
  .footer-top{
    display:grid;
    grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr;
    gap: 40px;
    min-width: 0;
  }
  .footer-top > *{ min-width: 0; }

  .footer-brand .logo{ color:#fff; margin-bottom: 18px; gap:0; }
  .footer-brand .logo svg{ height: 30px; width: auto; display:block; }
  .footer-brand p{
    color: var(--text-dim);
    font-size: 14.5px;
    line-height: 1.6;
    max-width: 280px;
  }

  .footer-col h4{
    font-size: 15px;
    font-weight: 700;
    color:#fff;
    margin-bottom: 18px;
  }
  .footer-col ul li{ margin-bottom: 12px; }
  .footer-col ul li a{
    color: var(--text-dim);
    font-size: 14.5px;
    transition: color .15s ease;
    word-break: break-word;
  }
  .footer-col ul li a:hover{ color:#fff; }

  .footer-company{
    grid-column: span 2;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    min-width: 0;
  }
  .footer-company > *{ min-width: 0; }

  .social-row{
    display:flex;
    gap: 10px;
    margin-top: 22px;
  }
  .social-row a{
    width: 36px; height:36px;
    border-radius: 8px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    display:flex;
    align-items:center;
    justify-content:center;
    transition: background .15s ease, transform .15s ease;
  }
  .social-row a:hover{ background: rgba(255,255,255,0.14); transform: translateY(-2px); }
  .social-row svg{ width:15px; height:15px; fill:#fff; }

  .footer-bottom{
    margin-top: 56px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.08);
    font-size: 13.5px;
    color: var(--text-dim);
  }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 1024px){
    .footer-top{ grid-template-columns: 1fr 1fr; row-gap: 40px; }
    .dropdown-panel{ width: 560px; }
  }

  @media (max-width: 860px){
    :root{ --header-h: 72px; }

    .nav-cta-group{
      position: fixed;
      top: var(--header-h);
      left:0; right:0;
      height: calc(100vh - var(--header-h));
      background:#fff;
      flex-direction:column;
      align-items:stretch;
      justify-content:flex-start;
      padding: 12px 20px 24px;
      gap:0;
      overflow-y:auto;
      overflow-x:hidden;
      -webkit-overflow-scrolling: touch;
      transform: translateX(100%);
      transition: transform .25s ease;
      visibility:hidden;
      z-index: 999;
    }
    .nav-cta-group.open{ transform: translateX(0); visibility:visible; }

    .primary-nav{
      display:flex;
      flex-direction: column;
      align-items:stretch;
      gap:0;
      width:100%;
    }

    .nav-item{ width:100%; border-bottom: 1px solid rgba(0,0,0,0.06); }
    .nav-link{
      width:100%;
      justify-content: space-between;
      padding: 16px 4px;
      border-radius:0;
    }
    .nav-item.active > .nav-link::after{ display:none; }

    .dropdown-panel{
      position:static;
      transform:none;
      width:100%;
      box-shadow:none;
      opacity:1;
      visibility:visible;
      pointer-events:auto;
      display:none;
      grid-template-columns: 1fr;
      padding: 0 4px 16px;
      border-radius:0;
      gap:0;
      transition:none;
    }
    .dropdown-panel::before{ display:none; }
    .nav-item.dropdown-open .dropdown-panel{
      display:grid;
      /* The desktop open-state rule above sets translateX(-50%) to center
         the mega-menu under its trigger. That rule isn't media-scoped, so
         without this override it was still shoving the mobile accordion
         panel ~50% of its own width off-screen to the left, making the
         expanded content invisible. Force it back into normal flow. */
      transform:none;
    }

    /* The tappable row ("Products", "API Hub"...) already acts as the
       section heading on mobile, so the desktop mega-menu's eyebrow
       label + "View all" row is redundant here — hide it. */
    .dropdown-header{ display:none; }

    .nav-cta-group > .cta-btn{
      margin-top: 20px;
      width:100%;
      justify-content:center;
    }

    .menu-toggle{ display:flex; }

    /* Previously this dropped to 0 vertical padding, which pulled the logo
       and hamburger flush to the top/bottom edges of a very thin header and
       made the two look misaligned/cramped next to each other. Give the
       row real vertical breathing room instead, matching the logo height. */
    .header-inner{ padding: 16px 0px; }
  }

  @media (max-width: 640px){
    .footer-top{ grid-template-columns: 1fr; }
    .footer-company{ grid-column: auto; grid-template-columns: 1fr 1fr; }
    .footer{ padding: 56px 20px 24px; }
    .footer-bottom{ margin-top: 40px; }
  }:root{
    --purple: #7B0FA6;
    --purple-dark: #5B0C7D;
    --magenta: #C026C0;
    --ink: #150A26;
    --footer-bg: #170826;
    --footer-bg-2: #1F0A32;
    --text-dim: #A99BB8;
    --border-soft: rgba(255,255,255,0.08);
    --header-h: 84px;
  } 

  html, body{
    max-width: 100%;
    overflow-x: hidden;
  }

  body{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--ink);
    background:#fff;
  }

  a{ text-decoration:none; color:inherit; }
  
  button{ font-family:inherit; }

  /* ============ HEADER ============ */
  .header{
    position: sticky;
    top:0;
    z-index: 1000;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(10px); 
  }

  .header-inner{
    max-width: 1280px;
    margin: 0 auto;
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 48px;
    padding: 18px 0px;
  }

  .logo{
    display:flex;
    align-items:center;
    gap:8px;
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.02em;
    white-space:nowrap;
  }
  .logo .dot{
    width: 22px; height:22px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #FF7A5C, #C81E3C);
    display:inline-block;
    flex-shrink:0;
  }
  .logo .cap-i{ color: var(--purple); }

  .nav-cta-group{
    display:flex;
    align-items:center;
    justify-content: space-between;
    flex: 1;
    gap: 24px;
    min-width: 0;
  }

  .primary-nav{
    display:flex;
    align-items:center;
    gap: 4px;
    flex: 0 0 auto;
    min-width: 0;
  }

  .nav-item{
    position:relative;
  }

  .nav-link{
    display:flex;
    align-items:center;
    gap:6px;
    padding: 10px 16px;
    font-size: 15px;
    font-weight: 500;
    color:#2B2338;
    border-radius: 8px;
    cursor:pointer;
    transition: color .15s ease, background .15s ease;
  }
  .nav-link:hover{ color: var(--purple); }
  .nav-item.active > .nav-link{
    color: var(--magenta);
    font-weight: 600;
  }
  .nav-item.active > .nav-link::after{
    content:"";
    position:absolute;
    left:16px; right:16px; bottom:2px;
    height:2px;
    background: var(--magenta);
    border-radius:2px;
  }

  .chevron{
    width:10px; height:10px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform: rotate(45deg);
    margin-top:-4px;
    transition: transform .2s ease;
    flex-shrink:0;
  }
  .nav-item.dropdown-open .chevron{
    transform: rotate(-135deg);
    margin-top:2px;
  }

  .cta-btn{
    background: linear-gradient(135deg, var(--purple), var(--magenta));
    color:#fff;
    font-weight: 600;
    font-size: 15px;
    padding: 12px 22px;
    border-radius: 999px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
    box-shadow: 0 6px 16px rgba(123,15,166,0.28);
    border:none;
    cursor:pointer;
    transition: transform .15s ease, box-shadow .15s ease;
  }
  .cta-btn:hover{ transform: translateY(-1px); box-shadow: 0 8px 20px rgba(123,15,166,0.36); color:#fff; }
  .cta-btn svg{ width:14px; height:14px; }

  /* Dropdown (mega menu) — visibility is controlled entirely via JS-toggled
     .dropdown-open class (mouseenter/mouseleave with a close-delay, or tap
     on mobile). No CSS :hover trigger, so there's no dead zone between the
     nav link and the panel that causes it to vanish while moving the mouse. */
  .dropdown-panel{
    position:absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    width: 460px;
    background:#fff;
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(20,10,40,0.18);
    padding: 28px 32px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
  /* Invisible bridge that closes the gap between the link and the panel so
     the pointer never leaves a hoverable area of .nav-item while travelling
     down to the menu. */
  .dropdown-panel::before{
    content:"";
    position:absolute;
    top:-10px; left:0; right:0; height:10px;
  }
  .nav-item.dropdown-open .dropdown-panel{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform: translateX(-50%) translateY(0);
  }
  .dropdown-panel--wide{
    width: 560px;
    grid-template-columns: repeat(3, 1fr);
  }

  .dropdown-header{
    grid-column: 1 / -1;
    display:flex;
    align-items:center;
    justify-content: space-between;
    padding-bottom: 14px;
    margin-bottom: 6px;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }
  .dropdown-header .label{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--magenta);
  }
  .dropdown-header .view-all{
    font-size: 13px;
    font-weight: 600;
    color:#2B2338;
    display:flex;
    align-items:center;
    gap:4px;
  }

  .dropdown-col .col-title{
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #9A93A8;
    margin-bottom: 14px;
  }
  .dropdown-col a{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    color:#241B33;
    padding: 10px 5px; 
    border-radius: 10px;
    position: relative;
    transition: background .15s ease, color .15s ease;
  }
  .dropdown-col a:hover, .dropdown-col a:focus-visible{
    background: #EEF1FC;
    border-left:3px solid var(--magenta);
  }
  

  /* Mobile toggle */
  .menu-toggle{
    display:none;
    width: 40px; height:40px;
    border:none;
    background:transparent;
    cursor:pointer;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
  }
  .menu-toggle span{
    width: 22px; height:2px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
  }
  .menu-toggle.open span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .menu-toggle.open span:nth-child(2){ opacity:0; }
  .menu-toggle.open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  /* ============ FOOTER ============ */
  .footer{
    background: linear-gradient(160deg, var(--footer-bg), var(--footer-bg-2));
    color: #EDE8F5;
    padding: 72px 32px 28px;
  }
  .footer-inner{
    max-width: 1280px;
    margin: 0 auto;
  }
  .footer-top{
    display:grid;
    grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr;
    gap: 40px;
    min-width: 0;
  }
  .footer-top > *{ min-width: 0; }

  .footer-brand .logo{ color:#fff; margin-bottom: 18px; gap:0; }
  .footer-brand .logo svg{ height: 30px; width: auto; display:block; }
  .footer-brand p{
    color: var(--text-dim);
    font-size: 14.5px;
    line-height: 1.6;
    max-width: 280px;
  }

  .footer-col h4{
    font-size: 15px;
    font-weight: 700;
    color:#fff;
    margin-bottom: 18px;
  }
  .footer-col ul li{ margin-bottom: 12px; }
  .footer-col ul li a{
    color: var(--text-dim);
    font-size: 14.5px;
    transition: color .15s ease;
    word-break: break-word;
  }
  .footer-col ul li a:hover{ color:#fff; }

  .footer-company{
    grid-column: span 2;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    min-width: 0;
  }
  .footer-company > *{ min-width: 0; }

  .social-row{
    display:flex;
    gap: 10px;
    margin-top: 22px;
  }
  .social-row a{
    width: 36px; height:36px;
    border-radius: 8px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    display:flex;
    align-items:center;
    justify-content:center;
    transition: background .15s ease, transform .15s ease;
  }
  .social-row a:hover{ background: rgba(255,255,255,0.14); transform: translateY(-2px); }
  .social-row svg{ width:15px; height:15px; fill:#fff; }

  .footer-bottom{
    margin-top: 56px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.08);
    font-size: 13.5px;
    color: var(--text-dim);
  }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 1024px){
    .footer-top{ grid-template-columns: 1fr 1fr; row-gap: 40px; }
    .dropdown-panel{ width: 560px; }
  }

  @media (max-width: 860px){
    :root{ --header-h: 72px; }

    .nav-cta-group{
      position: fixed;
      top: var(--header-h);
      left:0; right:0;
      height: calc(100vh - var(--header-h));
      background:#fff;
      flex-direction:column;
      align-items:stretch;
      justify-content:flex-start;
      padding: 12px 20px 24px;
      gap:0;
      overflow-y:auto;
      overflow-x:hidden;
      -webkit-overflow-scrolling: touch;
      transform: translateX(100%);
      transition: transform .25s ease;
      visibility:hidden;
      z-index: 999;
    }
    .nav-cta-group.open{ transform: translateX(0); visibility:visible; }

    .primary-nav{
      display:flex;
      flex-direction: column;
      align-items:stretch;
      gap:0;
      width:100%;
    }

    .nav-item{ width:100%; border-bottom: 1px solid rgba(0,0,0,0.06); }
    .nav-link{
      width:100%;
      justify-content: space-between;
      padding: 16px 4px;
      border-radius:0;
    }
    .nav-item.active > .nav-link::after{ display:none; }

    .dropdown-panel{
      position:static;
      transform:none;
      width:100%;
      box-shadow:none;
      opacity:1;
      visibility:visible;
      pointer-events:auto;
      display:none;
      grid-template-columns: 1fr;
      padding: 0 4px 16px;
      border-radius:0;
      gap:0;
      transition:none;
    }
    .dropdown-panel::before{ display:none; }
    .nav-item.dropdown-open .dropdown-panel{
      display:grid;
      /* The desktop open-state rule above sets translateX(-50%) to center
         the mega-menu under its trigger. That rule isn't media-scoped, so
         without this override it was still shoving the mobile accordion
         panel ~50% of its own width off-screen to the left, making the
         expanded content invisible. Force it back into normal flow. */
      transform:none;
    }

    /* The tappable row ("Products", "API Hub"...) already acts as the
       section heading on mobile, so the desktop mega-menu's eyebrow
       label + "View all" row is redundant here — hide it. */
    .dropdown-header{ display:none; }

    .nav-cta-group > .cta-btn{
      margin-top: 20px;
      width:100%;
      justify-content:center;
    }

    .menu-toggle{ display:flex; }

    /* Previously this dropped to 0 vertical padding, which pulled the logo
       and hamburger flush to the top/bottom edges of a very thin header and
       made the two look misaligned/cramped next to each other. Give the
       row real vertical breathing room instead, matching the logo height. */
    .header-inner{ padding: 16px 20px; }
  }

  @media (max-width: 640px){
    .footer-top{ grid-template-columns: 1fr; }
    .footer-company{ grid-column: auto; grid-template-columns: 1fr 1fr; }
    .footer{ padding: 56px 20px 24px; }
    .footer-bottom{ margin-top: 40px; }
  }
  
  .cpt-category-list{margin:0; padding:0;}
  
  .cpt-category-list li:first-child {
    margin-top:0px;
    }
  
  .cpt-category-list li {
    margin: 15px 0px;
    list-style-type:none;
    }
  
  .cpt-category-list li a{
    color: #3A3A3A;
    line-height: 26px;
    font-size: 16px;
    font-weight: 500;
  } 
  
.pg-st span.page-numbers.prev {
    color: #fff !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
}
.pg-st .page-numbers{
	border: 1px solid #D0D5DD;
    padding: 8px 16px;
	margin: 0px !important;
}
.pg-st .page-numbers.current, .pg-st .page-numbers.prev, .pg-st .page-numbers.next{
	background-color: #4903BC;
	color:#fff !important;
}
.pg-st .page-numbers.prev{
	border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
	color: #4903BC!important;
}
.pg-st .page-numbers.next{
	border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
	color: #4903BC!important;
}
.pg-st a.page-numbers.prev, .pg-st a.page-numbers.next{
	background-color: #4903BC!important;
	color: #fff!important;
	border: 1px solid #4903BC;
}