/* Shared stylesheet for all landing pages. */
/* aem-to-wordpress-migration */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-aem {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-aem h1,
  .jp-aem h2,
  .jp-aem h3,
  .jp-aem h4,
  .jp-aem a,
  .jp-aem button,
  .jp-aem summary {
    font-weight: 600;
  }

  .jp-aem p,
  .jp-aem span,
  .jp-aem li,
  .jp-aem td,
  .jp-aem th {
    font-weight: 500;
  }

  .jp-aem details summary {
    list-style: none;
  }

  .jp-aem details summary::-webkit-details-marker {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* ca-crm */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-ca-crm {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-indigo: #4f46e5;
    --jp-navy: #0e3e5c;
    --jp-saffron: #ff9933;
    --jp-green: #138808;
    --jp-cyan: #0891b2;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-ca-crm a,
  .jp-ca-crm button,
  .jp-ca-crm h1,
  .jp-ca-crm h2,
  .jp-ca-crm h3,
  .jp-ca-crm h4,
  .jp-ca-crm summary {
    font-weight: 600;
  }

  .jp-ca-crm p,
  .jp-ca-crm span,
  .jp-ca-crm li,
  .jp-ca-crm label,
  .jp-ca-crm input {
    font-weight: 500;
  }

  .jp-ca-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .14) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .14) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-ca-accent-text {
    background: linear-gradient(90deg, #0e3e5c, #4f46e5, #138808);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-ca-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-ca-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(14, 62, 92, .13),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-ca-card:hover::before {
    opacity: 1;
  }

  .jp-ca-card:hover {
    transform: translateY(-6px);
    border-color: rgba(14, 62, 92, .30);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-ca-content {
    position: relative;
    z-index: 1;
  }

  .jp-ca-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-ca-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-ca-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-ca-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-ca-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-product-shell {
    position: relative;
    overflow: hidden;
  }

  .jp-product-shell::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(14, 62, 92, .22), transparent 34%),
      radial-gradient(circle at bottom right, rgba(19, 136, 8, .16), transparent 36%);
    pointer-events: none;
  }

  .jp-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(14, 62, 92, .14), transparent);
    animation: jpCaScan 3.8s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #0e3e5c, #4f46e5, #138808);
    animation: jpCaProgress 1.4s ease both;
  }

  .jp-tricolour {
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff9933 0 33.33%, #ffffff 33.33% 66.66%, #138808 66.66% 100%);
    box-shadow: 0 0 0 1px rgba(226, 232, 240, .75);
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #0e3e5c;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #93c5fd !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, .30) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #0e3e5c !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(14, 62, 92, .18);
  }

  .jp-ca-crm details summary {
    list-style: none;
  }

  .jp-ca-crm details summary::-webkit-details-marker {
    display: none;
  }

  .jp-ca-crm details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpCaScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpCaProgress {
    from {
      width: 0;
    }
  }

  @media (max-width: 767px) {
    .jp-dashboard-table {
      overflow-x: auto;
    }

    .jp-dashboard-row {
      min-width: 580px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-ca-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-ca-card:hover {
      transform: none !important;
    }

    .jp-screen::after,
    .jp-progress span,
    .jp-ca-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* corporate-website-development */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-corporate {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-corporate h1,
  .jp-corporate h2,
  .jp-corporate h3,
  .jp-corporate h4,
  .jp-corporate a,
  .jp-corporate button,
  .jp-corporate summary {
    font-weight: 600;
  }

  .jp-corporate p,
  .jp-corporate span,
  .jp-corporate li,
  .jp-corporate td,
  .jp-corporate th {
    font-weight: 500;
  }

  .jp-corporate details summary {
    list-style: none;
  }

  .jp-corporate details summary::-webkit-details-marker {
    display: none;
  }


  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #4f46e5;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #4f46e5 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
  }

  .jp-elementor-contact-form .elementor-message {
    margin-top: 14px;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 500;
  }

  .jp-elementor-contact-form .elementor-message-success {
    background: #ecfdf5;
    color: #047857;
  }

  .jp-elementor-contact-form .elementor-message-danger {
    background: #fef2f2;
    color: #b91c1c;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* custom-crm-development */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-crm {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-crm h1,
  .jp-crm h2,
  .jp-crm h3,
  .jp-crm h4,
  .jp-crm a,
  .jp-crm button,
  .jp-crm summary {
    font-weight: 600;
  }

  .jp-crm p,
  .jp-crm span,
  .jp-crm li,
  .jp-crm td,
  .jp-crm th {
    font-weight: 500;
  }

  .jp-crm details summary {
    list-style: none;
  }

  .jp-crm details summary::-webkit-details-marker {
    display: none;
  }


  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #4f46e5;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #4f46e5 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
  }

  .jp-elementor-contact-form .elementor-message {
    margin-top: 14px;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 500;
  }

  .jp-elementor-contact-form .elementor-message-success {
    background: #ecfdf5;
    color: #047857;
  }

  .jp-elementor-contact-form .elementor-message-danger {
    background: #fef2f2;
    color: #b91c1c;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* drupal-to-wordpress-migration */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-migration {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-migration h1,
  .jp-migration h2,
  .jp-migration h3,
  .jp-migration h4,
  .jp-migration a,
  .jp-migration button,
  .jp-migration summary {
    font-weight: 600;
  }

  .jp-migration p,
  .jp-migration span,
  .jp-migration li,
  .jp-migration td,
  .jp-migration th {
    font-weight: 500;
  }

  .jp-migration details summary {
    list-style: none;
  }

  .jp-migration details summary::-webkit-details-marker {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* framer-developer */
  html{scroll-behavior:smooth;scroll-padding-top:92px}
  .jp-framer{background:#f8fafc;color:#0f172a;--purple:#7c3aed;--pink:#ec4899;--blue:#2563eb;--border:#e2e8f0}
  .jp-framer h1,.jp-framer h2,.jp-framer h3,.jp-framer h4,.jp-framer a,.jp-framer button,.jp-framer summary{font-weight:600}
  .jp-framer p,.jp-framer span,.jp-framer li,.jp-framer input,.jp-framer textarea{font-weight:500}
  .jp-framer-grid{background-image:linear-gradient(to right,rgba(148,163,184,.15) 1px,transparent 1px),linear-gradient(to bottom,rgba(148,163,184,.15) 1px,transparent 1px);background-size:34px 34px}
  .jp-framer-accent{background:linear-gradient(90deg,#0f172a,#7c3aed,#ec4899,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent}
  .jp-framer-card{position:relative;overflow:hidden;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background-color .24s ease}
  .jp-framer-card:before{content:"";position:absolute;inset:0;background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(124,58,237,.14),transparent 45%);opacity:0;transition:opacity .25s ease;pointer-events:none}
  .jp-framer-card:hover:before{opacity:1}
  .jp-framer-card:hover{transform:translateY(-6px);border-color:rgba(124,58,237,.3);box-shadow:0 24px 70px rgba(15,23,42,.12);background:#fff}
  .jp-framer-content{position:relative;z-index:1}
  .jp-framer-shine{position:relative;overflow:hidden;isolation:isolate}
  .jp-framer-shine:after{content:"";position:absolute;inset:0;transform:translateX(-130%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.46),transparent);transition:transform .7s ease;z-index:-1}
  .jp-framer-shine:hover:after{transform:translateX(130%) skewX(-18deg)}
  .jp-framer-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
  .jp-framer-reveal.jp-show{opacity:1;transform:translateY(0)}
  .jp-framer-browser{position:relative;overflow:hidden}
  .jp-framer-browser:before{content:"";position:absolute;inset:-2px;background:radial-gradient(circle at top left,rgba(124,58,237,.24),transparent 34%),radial-gradient(circle at bottom right,rgba(236,72,153,.18),transparent 36%);pointer-events:none}
  .jp-framer-screen{position:relative;overflow:hidden}
  .jp-framer-screen:after{content:"";position:absolute;top:-20%;left:0;width:100%;height:34%;background:linear-gradient(to bottom,transparent,rgba(124,58,237,.13),transparent);animation:jpFramerScan 4.2s ease-in-out infinite;pointer-events:none}
  .jp-framer-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0f172a,#7c3aed,#ec4899,#2563eb);animation:jpFramerProgress 1.4s ease both}
  .jp-framer-float{animation:jpFramerFloat 5s ease-in-out infinite}
  .jp-framer-float:nth-child(2){animation-delay:.5s}
  .jp-framer-float:nth-child(3){animation-delay:1s}
  .jp-form-empty{border:1px dashed #cbd5e1;border-radius:24px;background:#f8fafc;padding:28px;text-align:center;color:#64748b}
  .jp-form-empty i{color:#7c3aed;font-size:26px}
  .jp-elementor-contact-form .elementor-field-group{margin-bottom:16px}
  .jp-elementor-contact-form .elementor-field,.jp-elementor-contact-form .elementor-select-wrapper select{min-height:56px;border:1px solid #e2e8f0!important;border-radius:16px!important;background:#f8fafc!important;color:#0f172a!important;padding:14px 18px!important;font-size:14px!important;font-weight:500!important;box-shadow:none!important;outline:none!important}
  .jp-elementor-contact-form textarea.elementor-field{min-height:140px;resize:vertical}
  .jp-elementor-contact-form .elementor-field:focus,.jp-elementor-contact-form .elementor-select-wrapper select:focus{border-color:#c4b5fd!important;background:#fff!important;box-shadow:0 0 0 4px rgba(196,181,253,.35)!important}
  .jp-elementor-contact-form .elementor-field::placeholder{color:#94a3b8!important}
  .jp-elementor-contact-form .elementor-field-label{margin-bottom:8px;color:#334155;font-size:14px;font-weight:600!important}
  .jp-elementor-contact-form .elementor-button{width:100%;min-height:56px;border-radius:16px!important;background:#0f172a!important;color:#fff!important;font-size:15px!important;font-weight:600!important;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;box-shadow:0 18px 42px rgba(15,23,42,.14)}
  .jp-elementor-contact-form .elementor-button:hover{background:#7c3aed!important;transform:translateY(-2px);box-shadow:0 24px 70px rgba(124,58,237,.18)}
  .jp-framer details summary{list-style:none}
  .jp-framer details summary::-webkit-details-marker{display:none}
  .jp-framer details[open] .jp-faq-icon{transform:rotate(180deg)}
  .jp-faq-icon{transition:transform .2s ease}
  @keyframes jpFramerScan{0%{transform:translateY(-120%);opacity:0}20%{opacity:1}70%{opacity:1}100%{transform:translateY(360%);opacity:0}}
  @keyframes jpFramerProgress{from{width:0}}
  @keyframes jpFramerFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
  @media(max-width:767px){.jp-framer-row{min-width:560px}.jp-framer-table-wrap{overflow-x:auto}}
  @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.jp-framer-reveal{opacity:1!important;transform:none!important;transition:none!important}.jp-framer-card:hover,.jp-framer-float{transform:none!important;animation:none!important}.jp-framer-screen:after,.jp-framer-progress span,.jp-framer-shine:after{animation:none!important;transition:none!important}}

/* jsme-editor */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-jsme {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-emerald: #059669;
    --jp-teal: #0f766e;
    --jp-cyan: #0891b2;
    --jp-indigo: #4f46e5;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-jsme a,
  .jp-jsme button,
  .jp-jsme h1,
  .jp-jsme h2,
  .jp-jsme h3,
  .jp-jsme h4,
  .jp-jsme summary {
    font-weight: 600;
  }

  .jp-jsme p,
  .jp-jsme span,
  .jp-jsme li,
  .jp-jsme input,
  .jp-jsme textarea {
    font-weight: 500;
  }

  .jp-jsme-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .14) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .14) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-jsme-gradient-text {
    background: linear-gradient(90deg, #059669, #0891b2, #4f46e5);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-jsme-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-jsme-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(5, 150, 105, .13),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-jsme-card:hover::before {
    opacity: 1;
  }

  .jp-jsme-card:hover {
    transform: translateY(-6px);
    border-color: rgba(5, 150, 105, .30);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-jsme-content {
    position: relative;
    z-index: 1;
  }

  .jp-jsme-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-jsme-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-jsme-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-jsme-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-jsme-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-jsme-browser {
    position: relative;
    overflow: hidden;
  }

  .jp-jsme-browser::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(5, 150, 105, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(79, 70, 229, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-jsme-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-jsme-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(5, 150, 105, .12), transparent);
    animation: jpJsmeScan 4.2s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-jsme-molecule {
    position: relative;
    min-height: 245px;
  }

  .jp-jsme-molecule svg {
    width: 100%;
    height: 245px;
  }

  .jp-jsme-node {
    filter: drop-shadow(0 14px 22px rgba(15, 23, 42, .12));
  }

  .jp-jsme-node-a {
    animation: jpJsmePulse 4s ease-in-out infinite;
  }

  .jp-jsme-node-b {
    animation: jpJsmePulse 4s ease-in-out infinite .4s;
  }

  .jp-jsme-node-c {
    animation: jpJsmePulse 4s ease-in-out infinite .8s;
  }

  .jp-jsme-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #059669, #0891b2, #4f46e5);
    animation: jpJsmeProgress 1.4s ease both;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #059669;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #6ee7b7 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(110, 231, 183, .28) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #059669 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(5, 150, 105, .18);
  }

  .jp-jsme details summary {
    list-style: none;
  }

  .jp-jsme details summary::-webkit-details-marker {
    display: none;
  }

  .jp-jsme details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpJsmeScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpJsmePulse {
    0%, 100% {
      transform: scale(1);
      opacity: 1;
    }

    50% {
      transform: scale(1.08);
      opacity: .84;
    }
  }

  @keyframes jpJsmeProgress {
    from {
      width: 0;
    }
  }

  @media (max-width: 767px) {
    .jp-jsme-row {
      min-width: 560px;
    }

    .jp-jsme-table-wrap {
      overflow-x: auto;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-jsme-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-jsme-card:hover {
      transform: none !important;
    }

    .jp-jsme-screen::after,
    .jp-jsme-progress span,
    .jp-jsme-shine::after,
    .jp-jsme-node-a,
    .jp-jsme-node-b,
    .jp-jsme-node-c {
      animation: none !important;
      transition: none !important;
    }
  }

/* portfolio */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-portfolio {
    background: #f8fafc;
    color: #0f172a;
  }

  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-filter-btn.is-active {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #ffffff;
  }

  .jp-project-card.is-hidden {
    display: none;
  }

  .jp-search-wrap {
    position: relative;
  }

  .jp-search-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 14px;
    pointer-events: none;
    z-index: 2;
  }

  .jp-search-input {
    width: 100%;
    height: 52px;
    padding-left: 48px !important;
    padding-right: 18px !important;
    border-radius: 18px !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    outline: none !important;
    box-shadow: none !important;
  }

  .jp-search-input::placeholder {
    color: #94a3b8 !important;
    opacity: 1;
  }

  .jp-search-input:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
  }

  .jp-portfolio h1,
  .jp-portfolio h2,
  .jp-portfolio h3,
  .jp-portfolio h4,
  .jp-portfolio a,
  .jp-portfolio button {
    font-weight: 600;
  }

  .jp-portfolio p,
  .jp-portfolio span,
  .jp-portfolio input {
    font-weight: 500;
  }


  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #4f46e5;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #4f46e5 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
  }

  .jp-elementor-contact-form .elementor-message {
    margin-top: 14px;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 500;
  }

  .jp-elementor-contact-form .elementor-message-success {
    background: #ecfdf5;
    color: #047857;
  }

  .jp-elementor-contact-form .elementor-message-danger {
    background: #fef2f2;
    color: #b91c1c;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* ratemint */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-ratemint {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-indigo: #4f46e5;
    --jp-gold: #b8860b;
    --jp-gold-2: #d4a017;
    --jp-gold-3: #f5c542;
    --jp-cream: #fff8e7;
    --jp-cream-2: #fffdf5;
    --jp-line-gold: #e8d5a0;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-ratemint a,
  .jp-ratemint button,
  .jp-ratemint h1,
  .jp-ratemint h2,
  .jp-ratemint h3,
  .jp-ratemint h4,
  .jp-ratemint summary {
    font-weight: 600;
  }

  .jp-ratemint p,
  .jp-ratemint span,
  .jp-ratemint li,
  .jp-ratemint label,
  .jp-ratemint input,
  .jp-ratemint select {
    font-weight: 500;
  }

  .jp-ratemint-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .14) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .14) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-ratemint-gold-text {
    background: linear-gradient(90deg, #9a681b, #d4a017, #f5c542);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-ratemint-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-ratemint-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(212, 160, 23, .16),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-ratemint-card:hover::before {
    opacity: 1;
  }

  .jp-ratemint-card:hover {
    transform: translateY(-6px);
    border-color: rgba(212, 160, 23, .45);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-ratemint-content {
    position: relative;
    z-index: 1;
  }

  .jp-ratemint-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-ratemint-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-ratemint-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-ratemint-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-ratemint-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-dashboard {
    position: relative;
    overflow: hidden;
  }

  .jp-dashboard::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(212, 160, 23, .25), transparent 34%),
      radial-gradient(circle at bottom right, rgba(79, 70, 229, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-dash-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-dash-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(212, 160, 23, .14), transparent);
    animation: jpRateMintScan 3.5s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #b8860b, #d4a017, #f5c542);
    animation: jpRateMintProgress 1.4s ease both;
  }

  .jp-calc-item {
    margin-bottom: 28px;
  }

  .jp-calc-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
  }

  .jp-calc-label {
    color: #475569;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-value-box {
    display: flex;
    align-items: center;
    min-width: 120px;
    border: 1px solid #e8d5a0;
    border-radius: 12px;
    background: #fff8e7;
    padding: 8px 12px;
  }

  .jp-value-box input,
  .jp-value-box select {
    width: 100%;
    border: 0;
    background: transparent;
    color: #b8860b;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700 !important;
    outline: none;
  }

  .jp-value-box input {
    text-align: right;
  }

  .jp-value-box span {
    color: #b8860b;
    font-size: 13px;
    font-weight: 700 !important;
    margin-left: 4px;
  }

  .jp-value-box input::-webkit-outer-spin-button,
  .jp-value-box input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .jp-slider {
    width: 100%;
    height: 4px;
    border-radius: 999px;
    background: #e8d5a0;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
  }

  .jp-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 21px;
    height: 21px;
    border: 2px solid #b8860b;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .15);
  }

  .jp-slider::-moz-range-thumb {
    width: 21px;
    height: 21px;
    border: 2px solid #b8860b;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .15);
  }

  .jp-tab-btn {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    color: #64748b;
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 700 !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  }

  .jp-tab-btn.active {
    border-color: #0f172a;
    background: #0f172a;
    color: #ffffff;
  }

  .jp-code-panel {
    display: none;
  }

  .jp-code-panel.active {
    display: block;
  }

  .jp-code-block {
    overflow-x: auto;
    border-radius: 24px;
    background: #0f172a;
    padding: 24px;
    color: #e2e8f0;
    font-family: "Courier New", Courier, monospace;
    font-size: 13px;
    line-height: 1.7;
  }

  .jp-code-block pre {
    margin: 0;
  }

  .jp-code-comment { color: #94a3b8; font-style: italic; }
  .jp-code-key { color: #c4b5fd; }
  .jp-code-fn { color: #93c5fd; }
  .jp-code-num { color: #fbbf24; }
  .jp-code-string { color: #86efac; }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #b8860b;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #d4a017 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(212, 160, 23, .22) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #b8860b !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(184, 134, 11, .18);
  }

  .jp-ratemint details summary {
    list-style: none;
  }

  .jp-ratemint details summary::-webkit-details-marker {
    display: none;
  }

  .jp-ratemint details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpRateMintScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpRateMintProgress {
    from {
      width: 0;
    }
  }

  @media (max-width: 767px) {
    .jp-calc-header {
      align-items: flex-start;
      flex-direction: column;
    }

    .jp-value-box {
      width: 100%;
    }

    .jp-dash-table {
      overflow-x: auto;
    }

    .jp-dash-row {
      min-width: 560px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-ratemint-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-ratemint-card:hover {
      transform: none !important;
    }

    .jp-dash-screen::after,
    .jp-progress span,
    .jp-ratemint-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* react-next-js-developer */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-react {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-border: #e2e8f0;
    --jp-blue: #2563eb;
    --jp-cyan: #06b6d4;
    --jp-indigo: #4f46e5;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-react h1,
  .jp-react h2,
  .jp-react h3,
  .jp-react h4,
  .jp-react a,
  .jp-react button,
  .jp-react summary {
    font-weight: 600;
  }

  .jp-react p,
  .jp-react span,
  .jp-react li,
  .jp-react input,
  .jp-react textarea {
    font-weight: 500;
  }

  .jp-react-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .15) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .15) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-react-accent {
    background: linear-gradient(90deg, #2563eb, #06b6d4, #4f46e5);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-react-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-react-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(37, 99, 235, .13),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-react-card:hover::before {
    opacity: 1;
  }

  .jp-react-card:hover {
    transform: translateY(-6px);
    border-color: rgba(37, 99, 235, .30);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-react-content {
    position: relative;
    z-index: 1;
  }

  .jp-react-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-react-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-react-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-react-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-react-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-react-browser {
    position: relative;
    overflow: hidden;
  }

  .jp-react-browser::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(37, 99, 235, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(6, 182, 212, .20), transparent 36%);
    pointer-events: none;
  }

  .jp-react-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-react-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(37, 99, 235, .12), transparent);
    animation: jpReactScan 4.2s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-react-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb, #06b6d4, #4f46e5);
    animation: jpReactProgress 1.4s ease both;
  }

  .jp-react-float {
    animation: jpReactFloat 5s ease-in-out infinite;
  }

  .jp-react-float:nth-child(2) {
    animation-delay: .5s;
  }

  .jp-react-float:nth-child(3) {
    animation-delay: 1s;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #2563eb;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #93c5fd !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, .34) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #2563eb !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(37, 99, 235, .18);
  }

  .jp-react details summary {
    list-style: none;
  }

  .jp-react details summary::-webkit-details-marker {
    display: none;
  }

  .jp-react details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpReactScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpReactProgress {
    from {
      width: 0;
    }
  }

  @keyframes jpReactFloat {
    0%, 100% {
      transform: translateY(0);
    }

    50% {
      transform: translateY(-8px);
    }
  }

  @media (max-width: 767px) {
    .jp-react-row {
      min-width: 560px;
    }

    .jp-react-table-wrap {
      overflow-x: auto;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-react-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-react-card:hover,
    .jp-react-float {
      transform: none !important;
      animation: none !important;
    }

    .jp-react-screen::after,
    .jp-react-progress span,
    .jp-react-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* secure-scope */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-securescope {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-indigo: #4f46e5;
    --jp-cyan: #0891b2;
    --jp-cyan-2: #06b6d4;
    --jp-emerald: #10b981;
    --jp-line: #dbeafe;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-securescope a,
  .jp-securescope button,
  .jp-securescope h1,
  .jp-securescope h2,
  .jp-securescope h3,
  .jp-securescope h4,
  .jp-securescope summary {
    font-weight: 600;
  }

  .jp-securescope p,
  .jp-securescope span,
  .jp-securescope li,
  .jp-securescope label,
  .jp-securescope input {
    font-weight: 500;
  }

  .jp-securescope-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .14) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .14) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-securescope-accent-text {
    background: linear-gradient(90deg, #4f46e5, #0891b2, #10b981);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-securescope-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-securescope-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(8, 145, 178, .14),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-securescope-card:hover::before {
    opacity: 1;
  }

  .jp-securescope-card:hover {
    transform: translateY(-6px);
    border-color: rgba(79, 70, 229, .28);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-securescope-content {
    position: relative;
    z-index: 1;
  }

  .jp-securescope-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-securescope-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-securescope-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-securescope-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-securescope-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-console {
    position: relative;
    overflow: hidden;
  }

  .jp-console::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(79, 70, 229, .22), transparent 34%),
      radial-gradient(circle at bottom right, rgba(16, 185, 129, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(8, 145, 178, .14), transparent);
    animation: jpSecureScopeScan 3.8s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #4f46e5, #0891b2, #10b981);
    animation: jpSecureScopeProgress 1.4s ease both;
  }

  .jp-dot-pulse {
    animation: jpDotPulse 1.6s ease-in-out infinite;
  }

  .jp-dot-pulse:nth-child(2) {
    animation-delay: .2s;
  }

  .jp-dot-pulse:nth-child(3) {
    animation-delay: .4s;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #0891b2;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #67e8f9 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(103, 232, 249, .30) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #0891b2 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(8, 145, 178, .18);
  }

  .jp-securescope details summary {
    list-style: none;
  }

  .jp-securescope details summary::-webkit-details-marker {
    display: none;
  }

  .jp-securescope details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpSecureScopeScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpSecureScopeProgress {
    from {
      width: 0;
    }
  }

  @keyframes jpDotPulse {
    0%, 100% {
      opacity: .35;
      transform: translateY(0);
    }

    50% {
      opacity: 1;
      transform: translateY(-3px);
    }
  }

  @media (max-width: 767px) {
    .jp-log-table {
      overflow-x: auto;
    }

    .jp-log-row {
      min-width: 560px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-securescope-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-securescope-card:hover {
      transform: none !important;
    }

    .jp-screen::after,
    .jp-progress span,
    .jp-securescope-shine::after,
    .jp-dot-pulse {
      animation: none !important;
      transition: none !important;
    }
  }

/* shopify-development-services */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-shopify {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-shopify h1,
  .jp-shopify h2,
  .jp-shopify h3,
  .jp-shopify h4,
  .jp-shopify a,
  .jp-shopify button,
  .jp-shopify summary {
    font-weight: 600;
  }

  .jp-shopify p,
  .jp-shopify span,
  .jp-shopify li,
  .jp-shopify input,
  .jp-shopify textarea {
    font-weight: 500;
  }

  .jp-shopify details summary {
    list-style: none;
  }

  .jp-shopify details summary::-webkit-details-marker {
    display: none;
  }


  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #4f46e5;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #4f46e5 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
  }

  .jp-elementor-contact-form .elementor-message {
    margin-top: 14px;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 500;
  }

  .jp-elementor-contact-form .elementor-message-success {
    background: #ecfdf5;
    color: #047857;
  }

  .jp-elementor-contact-form .elementor-message-danger {
    background: #fef2f2;
    color: #b91c1c;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* webflow-development-services */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-webflow {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-blue: #146EF5;
    --jp-indigo: #4f46e5;
    --jp-cyan: #06b6d4;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-webflow h1,
  .jp-webflow h2,
  .jp-webflow h3,
  .jp-webflow h4,
  .jp-webflow a,
  .jp-webflow button,
  .jp-webflow summary {
    font-weight: 600;
  }

  .jp-webflow p,
  .jp-webflow span,
  .jp-webflow li,
  .jp-webflow input,
  .jp-webflow textarea {
    font-weight: 500;
  }

  .jp-webflow-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .15) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .15) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-webflow-accent {
    background: linear-gradient(90deg, #146EF5, #4f46e5, #06b6d4);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-webflow-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-webflow-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(20, 110, 245, .14),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-webflow-card:hover::before {
    opacity: 1;
  }

  .jp-webflow-card:hover {
    transform: translateY(-6px);
    border-color: rgba(20, 110, 245, .30);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-webflow-content {
    position: relative;
    z-index: 1;
  }

  .jp-webflow-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-webflow-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .44), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-webflow-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-webflow-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-webflow-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-webflow-browser {
    position: relative;
    overflow: hidden;
  }

  .jp-webflow-browser::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(20, 110, 245, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(6, 182, 212, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-webflow-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-webflow-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(20, 110, 245, .13), transparent);
    animation: jpWebflowScan 4.2s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-webflow-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #146EF5, #4f46e5, #06b6d4);
    animation: jpWebflowProgress 1.4s ease both;
  }

  .jp-webflow-float {
    animation: jpWebflowFloat 5s ease-in-out infinite;
  }

  .jp-webflow-float:nth-child(2) {
    animation-delay: .5s;
  }

  .jp-webflow-float:nth-child(3) {
    animation-delay: 1s;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #146EF5;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #93c5fd !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, .30) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #146EF5 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(20, 110, 245, .18);
  }

  .jp-webflow details summary {
    list-style: none;
  }

  .jp-webflow details summary::-webkit-details-marker {
    display: none;
  }

  .jp-webflow details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpWebflowScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpWebflowProgress {
    from {
      width: 0;
    }
  }

  @keyframes jpWebflowFloat {
    0%, 100% {
      transform: translateY(0);
    }

    50% {
      transform: translateY(-8px);
    }
  }

  @media (max-width: 767px) {
    .jp-webflow-row {
      min-width: 560px;
    }

    .jp-webflow-table-wrap {
      overflow-x: auto;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-webflow-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-webflow-card:hover,
    .jp-webflow-float {
      transform: none !important;
      animation: none !important;
    }

    .jp-webflow-screen::after,
    .jp-webflow-progress span,
    .jp-webflow-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* wordpress-development-services */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-wordpress {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-border: #e2e8f0;
    --jp-blue: #21759b;
    --jp-indigo: #4f46e5;
    --jp-sky: #0284c7;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-wordpress h1,
  .jp-wordpress h2,
  .jp-wordpress h3,
  .jp-wordpress h4,
  .jp-wordpress a,
  .jp-wordpress button,
  .jp-wordpress summary {
    font-weight: 600;
  }

  .jp-wordpress p,
  .jp-wordpress span,
  .jp-wordpress li,
  .jp-wordpress input,
  .jp-wordpress textarea {
    font-weight: 500;
  }

  .jp-wordpress-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .15) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .15) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-wordpress-accent {
    background: linear-gradient(90deg, #21759b, #4f46e5, #0284c7);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-wordpress-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-wordpress-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(33, 117, 155, .13),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-wordpress-card:hover::before {
    opacity: 1;
  }

  .jp-wordpress-card:hover {
    transform: translateY(-6px);
    border-color: rgba(33, 117, 155, .30);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-wordpress-content {
    position: relative;
    z-index: 1;
  }

  .jp-wordpress-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-wordpress-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-wordpress-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-wordpress-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-wordpress-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-wordpress-browser {
    position: relative;
    overflow: hidden;
  }

  .jp-wordpress-browser::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(33, 117, 155, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(79, 70, 229, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-wordpress-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-wordpress-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(33, 117, 155, .12), transparent);
    animation: jpWordPressScan 4.2s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-wordpress-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #21759b, #4f46e5, #0284c7);
    animation: jpWordPressProgress 1.4s ease both;
  }

  .jp-wordpress-float {
    animation: jpWordPressFloat 5s ease-in-out infinite;
  }

  .jp-wordpress-float:nth-child(2) {
    animation-delay: .5s;
  }

  .jp-wordpress-float:nth-child(3) {
    animation-delay: 1s;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #21759b;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #7dd3fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(125, 211, 252, .34) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #21759b !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(33, 117, 155, .18);
  }

  .jp-wordpress details summary {
    list-style: none;
  }

  .jp-wordpress details summary::-webkit-details-marker {
    display: none;
  }

  .jp-wordpress details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpWordPressScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpWordPressProgress {
    from {
      width: 0;
    }
  }

  @keyframes jpWordPressFloat {
    0%, 100% {
      transform: translateY(0);
    }

    50% {
      transform: translateY(-8px);
    }
  }

  @media (max-width: 767px) {
    .jp-wordpress-row {
      min-width: 560px;
    }

    .jp-wordpress-table-wrap {
      overflow-x: auto;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-wordpress-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-wordpress-card:hover,
    .jp-wordpress-float {
      transform: none !important;
      animation: none !important;
    }

    .jp-wordpress-screen::after,
    .jp-wordpress-progress span,
    .jp-wordpress-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* wordpress-monthly-maintenance */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-maintenance {
    background: #f8fafc;
    color: #0f172a;
  }


  .jp-bg-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .65s ease, transform .65s ease;
  }

  .jp-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-glow-card {
    position: relative;
    overflow: hidden;
  }

  .jp-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(99, 102, 241, .24), transparent 34%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .18), transparent 34%);
    pointer-events: none;
  }

  .jp-maintenance h1,
  .jp-maintenance h2,
  .jp-maintenance h3,
  .jp-maintenance h4,
  .jp-maintenance a,
  .jp-maintenance button,
  .jp-maintenance summary {
    font-weight: 600;
  }

  .jp-maintenance p,
  .jp-maintenance span,
  .jp-maintenance li {
    font-weight: 500;
  }

  .jp-maintenance details summary {
    list-style: none;
  }

  .jp-maintenance details summary::-webkit-details-marker {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

  }

/* home */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-v3-loader {
    display: none !important;
  }

  .jp-v3 {
    --ink: #0f172a;
    --ink-2: #334155;
    --muted: #64748b;
    --bg: #f8fafc;
    --card: #ffffff;
    --border: #e2e8f0;
    --indigo: #4f46e5;
    --indigo-dark: #3730a3;
    --sky: #0ea5e9;
    --cyan: #0891b2;
    --violet: #7c3aed;
    --emerald: #16a34a;
    --amber: #d97706;
    --rose: #e11d48;
    --radius-xl: 32px;
    --jp-ease-out: cubic-bezier(.23, 1, .32, 1);
    --jp-ease-in-out: cubic-bezier(.77, 0, .175, 1);
    --shadow-soft: 0 24px 70px rgba(15, 23, 42, .10);
    --shadow-strong: 0 30px 100px rgba(15, 23, 42, .16);
    position: relative;
    overflow: hidden;
    background: var(--bg);
    color: var(--ink);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  .jp-v3,
  .jp-v3 *,
  .jp-v3 *::before,
  .jp-v3 *::after,
  .jp-v3-floating-whatsapp {
    box-sizing: border-box;
  }

  .jp-v3 img,
  .jp-v3 svg {
    max-width: 100%;
  }


  .jp-v3 a {
    text-decoration: none;
  }

  .jp-v3 h1,
  .jp-v3 h2,
  .jp-v3 h3,
  .jp-v3 h4,
  .jp-v3 a,
  .jp-v3 button {
    font-weight: 600;
  }

  .jp-v3 p,
  .jp-v3 li,
  .jp-v3 span,
  .jp-v3 input,
  .jp-v3 textarea {
    font-weight: 500;
  }

  .jp-v3-bg-grid {
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .15) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .15) 1px, transparent 1px);
    background-size: 34px 34px;
    opacity: .58;
    pointer-events: none;
  }

  .jp-v3-blob {
    position: absolute;
    border-radius: 999px;
    filter: blur(74px);
    opacity: .58;
    pointer-events: none;
  }

  .jp-v3-blob-1 {
    width: 640px;
    height: 640px;
    left: 50%;
    top: -210px;
    transform: translateX(-50%);
    background: #dbeafe;
  }

  .jp-v3-blob-2 {
    width: 430px;
    height: 430px;
    right: -140px;
    top: 680px;
    background: #ede9fe;
  }

  .jp-v3-blob-3 {
    width: 430px;
    height: 430px;
    left: -170px;
    top: 1450px;
    background: #dcfce7;
  }

  .jp-v3-blob-4 {
    width: 390px;
    height: 390px;
    right: -150px;
    bottom: 430px;
    background: #fef3c7;
  }

  .jp-v3-wrap {
    width: min(1180px, calc(100% - 48px));
    margin-inline: auto;
    position: relative;
    z-index: 1;
  }

  .jp-v3-section {
    position: relative;
    z-index: 1;
    padding: 144px 0;
  }

  .jp-v3-contact-section {
    padding-bottom: 144px;
  }

  .jp-v3-hero {
    position: relative;
    z-index: 1;
    padding: 144px 0 96px;
  }

  .jp-v3-grid {
    display: grid;
    gap: 72px;
  }

  .jp-v3-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(365px, .72fr);
    align-items: center;
  }

  .jp-v3-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    color: #475569;
    padding: 10px 16px;
    font-size: 14px;
    line-height: 1;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, .16);
    backdrop-filter: blur(16px);
  }

  .jp-v3-live-dot {
    width: 11px;
    height: 11px;
    border-radius: 999px;
    background: #16a34a;
    box-shadow: 0 0 0 6px rgba(22, 163, 74, .14);
  }

  .jp-v3-hero h1 {
    max-width: 780px;
    margin: 30px 0 0;
    color: #020617;
    font-size: clamp(44px, 6.15vw, 78px);
    line-height: 1;
    letter-spacing: -.058em;
  }

  .jp-v3-gradient-text {
    background: linear-gradient(90deg, var(--indigo), var(--sky));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-v3-lead {
    max-width: 620px;
    margin: 36px 0 0;
    color: var(--muted);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.74;
  }

  .jp-v3-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 44px;
  }

  .jp-v3-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 56px;
    border-radius: 18px;
    padding: 15px 22px;
    line-height: 1.1;
    transition: transform .16s var(--jp-ease-out), box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
    cursor: pointer;
  }

  .jp-v3-btn:hover {
    transform: translateY(-2px);
  }

  .jp-v3-btn:active {
    transform: scale(.97);
  }

  .jp-v3-btn-primary {
    background: var(--indigo);
    color: #fff !important;
    box-shadow: 0 24px 70px rgba(79, 70, 229, .22);
  }

  .jp-v3-btn-primary:hover {
    background: #4338ca;
    box-shadow: 0 28px 80px rgba(79, 70, 229, .28);
  }

  .jp-v3-btn-dark {
    background: #0f172a;
    color: #fff !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .15);
  }

  .jp-v3-btn-dark:hover {
    background: var(--indigo);
  }

  .jp-v3-btn-light {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--ink) !important;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, .16);
  }

  .jp-v3-btn-light:hover {
    border-color: #c7d2fe;
    color: var(--indigo) !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, .09);
  }

  .jp-v3-btn-wa {
    background: #16a34a;
    color: #fff !important;
    box-shadow: 0 24px 70px rgba(22, 163, 74, .18);
  }

  .jp-v3-btn-wa:hover {
    background: #15803d;
  }

  .jp-v3-shine {
    position: relative;
    overflow: hidden;
  }

  .jp-v3-shine::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 70%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .38), transparent);
    transform: translateX(-180%) skewX(-18deg);
    transition: transform .55s var(--jp-ease-in-out);
    pointer-events: none;
  }

  .jp-v3-shine:hover::after {
    transform: translateX(200%) skewX(-18deg);
  }

  .jp-v3-link-arrow i {
    transition: transform .16s var(--jp-ease-out);
  }

  .jp-v3-link-arrow:hover i {
    transform: translateX(4px);
  }

  .jp-v3-pills {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 52px;
    max-width: 720px;
  }

  .jp-v3-pill,
  .jp-v3-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 0 0 1px rgba(148, 163, 184, .12);
    transition: transform .2s var(--jp-ease-out), border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
  }

  .jp-v3-pill {
    border-radius: 20px;
    padding: 18px;
    color: #475569;
    backdrop-filter: blur(16px);
  }

  .jp-v3-pill small {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    color: #64748b;
  }

  .jp-v3-card {
    border-radius: var(--radius-xl);
    padding: 38px;
  }

  .jp-v3-card::before,
  .jp-v3-pill::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(460px circle at var(--mx, 50%) var(--my, 50%), rgba(99, 102, 241, .15), transparent 42%);
    opacity: 0;
    transition: opacity .18s ease;
    pointer-events: none;
  }

  .jp-v3-card:hover::before,
  .jp-v3-pill:hover::before {
    opacity: 1;
  }

  .jp-v3-card:hover,
  .jp-v3-pill:hover {
    transform: translateY(-3px);
    border-color: rgba(99, 102, 241, .34);
    box-shadow: 0 28px 80px rgba(15, 23, 42, .13);
  }

  .jp-v3-card-content {
    position: relative;
    z-index: 1;
  }

  .jp-v3-icon {
    display: inline-flex;
    width: 58px;
    height: 58px;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    font-size: 24px;
  }

  .jp-v3-icon-indigo { background: #eef2ff; color: var(--indigo); }
  .jp-v3-icon-sky { background: #e0f2fe; color: #0369a1; }
  .jp-v3-icon-violet { background: #f3e8ff; color: var(--violet); }
  .jp-v3-icon-emerald { background: #dcfce7; color: #15803d; }
  .jp-v3-icon-amber { background: #fef3c7; color: var(--amber); }
  .jp-v3-icon-cyan { background: #cffafe; color: var(--cyan); }

  .jp-v3-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 7px 12px;
    font-size: 12px;
    line-height: 1;
    background: #f1f5f9;
    color: #475569;
  }

  .jp-v3-badge-indigo { background: #eef2ff; color: var(--indigo-dark); }
  .jp-v3-badge-sky { background: #e0f2fe; color: #0369a1; }
  .jp-v3-badge-violet { background: #f3e8ff; color: #6d28d9; }
  .jp-v3-badge-emerald { background: #dcfce7; color: #15803d; }
  .jp-v3-badge-amber { background: #fef3c7; color: #b45309; }
  .jp-v3-badge-cyan { background: #cffafe; color: #0e7490; }

  .jp-v3-glow-card {
    position: relative;
    overflow: hidden;
    border-radius: 36px;
    background: #fff;
    padding: 1px;
    box-shadow: var(--shadow-strong);
  }

  .jp-v3-glow-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(79, 70, 229, .32), transparent 34%),
      radial-gradient(circle at center right, rgba(14, 165, 233, .26), transparent 34%),
      radial-gradient(circle at bottom left, rgba(22, 163, 74, .16), transparent 34%);
    pointer-events: none;
  }

  .jp-v3-glow-inner {
    position: relative;
    border-radius: 34px;
    background: #fff;
    padding: 28px;
  }

  .jp-v3-preview-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 22px;
  }

  .jp-v3-preview-tab {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: #f8fafc;
    color: #64748b;
    padding: 13px 14px;
    text-align: left;
    font-size: 14px;
    transition: transform .14s var(--jp-ease-out), border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease;
    cursor: pointer;
  }

  .jp-v3-preview-tab:active {
    transform: scale(.97);
  }

  .jp-v3-preview-tab.jp-active {
    background: var(--indigo);
    border-color: var(--indigo);
    color: #fff;
    box-shadow: 0 18px 42px rgba(79, 70, 229, .18);
  }

  .jp-v3-preview-panel {
    display: none;
    margin-top: 18px;
  }

  .jp-v3-preview-panel.jp-active {
    display: block;
  }

  .jp-v3-browser {
    border: 1px solid var(--border);
    border-radius: 28px;
    background: #f8fafc;
    padding: 14px;
  }

  .jp-v3-browser-window {
    border-radius: 22px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, .18);
  }

  .jp-v3-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 48px;
    align-items: end;
    margin-bottom: 72px;
  }

  .jp-v3-kicker {
    margin: 0 0 14px;
    color: var(--indigo);
    font-size: 13px;
    letter-spacing: .26em;
    text-transform: uppercase;
  }

  .jp-v3-title {
    max-width: 890px;
    margin: 0;
    color: #020617;
    font-size: clamp(34px, 4.5vw, 56px);
    line-height: 1.04;
    letter-spacing: -.048em;
  }

  .jp-v3-copy {
    max-width: 820px;
    margin: 26px 0 0;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.75;
  }

  .jp-v3-service-grid,
  .jp-v3-product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
  }

  .jp-v3-core-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jp-v3-card h3 {
    margin: 24px 0 0;
    color: #020617;
    font-size: 22px;
    line-height: 1.22;
  }

  .jp-v3-card p {
    margin: 14px 0 0;
    color: var(--muted);
    line-height: 1.72;
  }

  .jp-v3-card-visual {
    margin-top: 24px;
    border-radius: 24px;
    background: #f8fafc;
    padding: 16px;
  }

  .jp-v3-project-placeholder {
    display: grid;
    min-height: 190px;
    place-items: center;
    gap: 10px;
    margin: 0 0 26px;
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    color: #64748b;
    text-align: center;
  }

  .jp-v3-project-placeholder i {
    font-size: 28px;
  }

  .jp-v3-project-placeholder figcaption {
    font-size: 13px;
  }

  .jp-v3-project-placeholder-emerald {
    background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  }

  .jp-v3-project-placeholder-cyan {
    background: linear-gradient(135deg, #ecfeff, #e0f2fe);
  }


  .jp-v3-bar {
    display: block;
    height: 12px;
    border-radius: 999px;
    background: #e2e8f0;
  }

  .jp-v3-technology-panel {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgba(199, 210, 254, .72);
    border-radius: 42px;
    background:
      radial-gradient(circle at 50% -15%, rgba(99, 102, 241, .18), transparent 38%),
      linear-gradient(145deg, rgba(238, 242, 255, .95), rgba(240, 249, 255, .9));
    padding: clamp(38px, 5vw, 64px);
    box-shadow: 0 30px 90px rgba(79, 70, 229, .1);
  }

  .jp-v3-technology-panel::before,
  .jp-v3-technology-panel::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    filter: blur(20px);
    pointer-events: none;
  }

  .jp-v3-technology-panel::before {
    top: -120px;
    left: -80px;
    background: rgba(14, 165, 233, .12);
  }

  .jp-v3-technology-panel::after {
    right: -100px;
    bottom: -140px;
    background: rgba(124, 58, 237, .12);
  }

  .jp-v3-technology-head {
    max-width: 720px;
    margin: 0 auto 52px;
    text-align: center;
  }

  .jp-v3-technology-head .jp-v3-title,
  .jp-v3-technology-head .jp-v3-copy {
    margin-inline: auto;
  }

  .jp-v3-technology-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }

  .jp-v3-tech-capability {
    position: relative;
    display: grid;
    min-width: 0;
    justify-items: center;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 28px;
    background: linear-gradient(180deg, var(--tech-soft), rgba(255, 255, 255, .96) 62%);
    padding: 26px 16px 24px;
    text-align: center;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .07);
  }

  .jp-v3-tech-capability::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: var(--tech-color);
    opacity: .8;
  }

  .jp-v3-tech-mark {
    display: grid;
    width: 86px;
    height: 86px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .92);
    border-radius: 28px;
    background: rgba(255, 255, 255, .9);
    color: var(--tech-color);
    font-size: 36px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .09);
  }

  .jp-v3-tech-wordmark {
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.06em;
  }

  .jp-v3-tech-wordmark-next {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 34px;
    font-style: italic;
    font-weight: 700;
  }

  .jp-v3-tech-capability h3 {
    margin: 18px 0 0;
    color: #0f172a;
    font-size: 19px;
    letter-spacing: -.025em;
  }

  .jp-v3-tech-capability p {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
  }

  .jp-v3-clients-section {
    padding-top: 72px;
    padding-bottom: 128px;
  }

  .jp-v3-clients-head {
    max-width: 720px;
    margin: 0 auto 58px;
    text-align: center;
  }

  .jp-v3-clients-head .jp-v3-title,
  .jp-v3-clients-head .jp-v3-copy {
    margin-inline: auto;
  }

  .jp-v3-client-slider {
    position: relative;
    overflow: hidden;
    padding: 12px 0 22px;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  }

  .jp-v3-client-track {
    display: flex;
    width: max-content;
    animation: jpV3ClientMarquee 54s linear infinite;
    will-change: transform;
  }

  .jp-v3-client-group {
    display: flex;
    flex: none;
    gap: 24px;
    padding-right: 24px;
  }

  .jp-v3-client-logo-card {
    display: grid;
    flex: 0 0 205px;
    width: 205px;
    height: 108px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .96);
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    padding: 22px;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .07);
    transition: transform .2s var(--jp-ease-out), border-color .2s ease, box-shadow .2s ease;
  }

  .jp-v3-client-logo-card img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 62px;
    object-fit: contain;
    filter: saturate(.9);
    transition: filter .2s ease, transform .2s var(--jp-ease-out);
  }

  .jp-v3-client-logo-dark {
    border-color: rgba(51, 65, 85, .82);
    background:
      radial-gradient(circle at top right, rgba(79, 70, 229, .32), transparent 42%),
      #0f172a;
    box-shadow: 0 18px 50px rgba(15, 23, 42, .16);
  }

  .jp-v3-client-logo-card:hover {
    z-index: 1;
    border-color: rgba(99, 102, 241, .42);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .13);
    transform: translateY(-3px);
  }

  .jp-v3-client-logo-card:hover img {
    filter: saturate(1.08);
    transform: scale(1.04);
  }

  .jp-v3-client-slider:hover .jp-v3-client-track,
  .jp-v3-client-slider:focus-within .jp-v3-client-track {
    animation-play-state: paused;
  }

  .jp-v3-dark-panel {
    border-radius: 44px;
    background:
      radial-gradient(circle at top left, rgba(79, 70, 229, .42), transparent 30%),
      radial-gradient(circle at bottom right, rgba(14, 165, 233, .22), transparent 35%),
      #0f172a;
    color: #fff;
    padding: 72px;
    box-shadow: var(--shadow-strong);
  }

  .jp-v3-dark-panel .jp-v3-title,
  .jp-v3-dark-panel h3 {
    color: #fff;
  }

  .jp-v3-dark-panel .jp-v3-copy,
  .jp-v3-dark-panel p {
    color: #cbd5e1;
  }

  .jp-v3-dark-grid {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    gap: 64px;
    align-items: center;
  }

  .jp-v3-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }

  .jp-v3-category-card {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 28px;
    background: rgba(255, 255, 255, .08);
    color: #fff !important;
    padding: 32px;
    transition: background .18s ease, transform .18s var(--jp-ease-out), color .18s ease;
  }

  .jp-v3-category-card:hover {
    background: #fff;
    color: #0f172a !important;
    transform: translateY(-3px);
  }

  .jp-v3-category-card:active,
  .jp-v3-pill:active {
    transform: scale(.98);
  }

  .jp-v3-product-card {
    border-color: var(--product-border, var(--border));
  }

  .jp-v3-product-card:hover {
    border-color: var(--product-color, var(--indigo));
  }

  .jp-v3-product-card .jp-v3-btn-dark:hover {
    background: var(--product-color, var(--indigo));
  }

  .jp-v3-capability-grid,
  .jp-v3-experience-grid,
  .jp-v3-contact-grid {
    display: grid;
    gap: 72px;
    align-items: center;
  }

  .jp-v3-capability-grid {
    grid-template-columns: .75fr 1.25fr;
  }

  .jp-v3-experience-grid {
    grid-template-columns: .55fr .95fr;
    align-items: start;
  }

  .jp-v3-contact-grid {
    grid-template-columns: 1.1fr .75fr;
  }

  .jp-v3-stack-box {
    border: 1px solid var(--border);
    border-radius: 38px;
    background: #fff;
    padding: 24px;
    box-shadow: var(--shadow-soft);
  }

  .jp-v3-stack-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .jp-v3-stack-card {
    border: 1px solid var(--border);
    border-radius: 28px;
    background: #f8fafc;
    padding: 28px;
  }

  .jp-v3-stack-card.featured {
    background: linear-gradient(135deg, var(--indigo), #0f172a);
    color: #fff;
    border-color: #4338ca;
  }

  .jp-v3-stack-card.featured p {
    color: #e0e7ff;
  }

  .jp-v3-timeline {
    position: relative;
    display: grid;
    gap: 30px;
  }

  .jp-v3-timeline::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 18px;
    bottom: 18px;
    width: 1px;
    background: linear-gradient(to bottom, #a5b4fc, #e2e8f0, #7dd3fc);
  }

  .jp-v3-timeline-card {
    margin-left: 60px;
    border: 1px solid var(--border);
    border-radius: 30px;
    background: #fff;
    padding: 38px;
    position: relative;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, .14);
  }

  .jp-v3-timeline-dot {
    position: absolute;
    left: -60px;
    top: 26px;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: var(--indigo);
    color: #fff;
    box-shadow: 0 18px 42px rgba(79, 70, 229, .25);
  }

  .jp-v3-contact-panel {
    border-radius: 44px;
    background: linear-gradient(135deg, var(--indigo), #0f172a);
    color: #fff;
    padding: 72px;
    box-shadow: var(--shadow-strong);
  }

  .jp-v3-contact-panel .jp-v3-title {
    color: #fff;
  }

  .jp-v3-contact-panel .jp-v3-copy {
    color: #e0e7ff;
  }

  .jp-v3-contact-links {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 38px;
    max-width: 480px;
  }

  .jp-v3-contact-link {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .10);
    color: #fff !important;
    padding: 16px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .10);
    transition: background .22s ease, color .22s ease;
  }

  .jp-v3-contact-link:hover {
    background: #fff;
    color: #0f172a !important;
  }

  .jp-v3-form-card {
    border-radius: 32px;
    background: #fff;
    padding: 32px;
    color: #0f172a;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .14);
  }

  .jp-v3-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-v3-form-empty i {
    color: var(--indigo);
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #a5b4fc !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: var(--indigo) !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
  }

  .jp-elementor-contact-form .elementor-button:active {
    transform: scale(.97);
  }

  .jp-v3-floating-whatsapp {
    position: fixed;
    right: auto;
    left: 20px;
    bottom: 22px;
    z-index: 90;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    border-radius: 999px;
    background: #16a34a;
    color: #fff !important;
    padding: 14px 18px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 18px 55px rgba(22, 163, 74, .32);
    transition:
      transform .16s cubic-bezier(.23, 1, .32, 1),
      background-color .18s ease,
      box-shadow .18s ease;
  }

  .jp-v3-floating-whatsapp:hover {
    transform: translateY(-2px);
    background: #15803d;
    box-shadow: 0 20px 58px rgba(22, 163, 74, .38);
  }

  .jp-v3-floating-whatsapp:active {
    transform: scale(.97);
  }

  .jp-v3-floating-whatsapp:focus-visible {
    outline: 3px solid rgba(34, 197, 94, .36);
    outline-offset: 5px;
  }

  .jp-v3-scroll-cue {
    position: fixed;
    right: 24px;
    bottom: 92px;
    z-index: 88;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #475569 !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .18em;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none !important;
    transition:
      color .18s var(--jp-ease-out),
      opacity .2s var(--jp-ease-out),
      transform .16s var(--jp-ease-out);
  }

  .jp-v3-scroll-cue-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 1px solid rgba(148, 163, 184, .3);
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
    color: #0f172a;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .14);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    animation: jpV3ScrollCueFloat 1.8s cubic-bezier(.77, 0, .175, 1) infinite;
    transition:
      background-color .18s var(--jp-ease-out),
      border-color .18s var(--jp-ease-out),
      color .18s var(--jp-ease-out),
      box-shadow .18s var(--jp-ease-out);
  }

  .jp-v3-scroll-cue:hover {
    color: var(--indigo) !important;
  }

  .jp-v3-scroll-cue:hover .jp-v3-scroll-cue-icon {
    border-color: var(--indigo);
    background: var(--indigo);
    color: #fff;
    box-shadow: 0 16px 42px rgba(79, 70, 229, .28);
  }

  .jp-v3-scroll-cue:active {
    transform: scale(.97);
  }

  .jp-v3-scroll-cue:focus-visible {
    border-radius: 999px;
    outline: 3px solid rgba(99, 102, 241, .35);
    outline-offset: 5px;
  }

  .jp-v3-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-v3-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  @keyframes jpV3ClientMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }

  @keyframes jpV3ScrollCueFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(6px); }
  }

  @media (max-width: 1080px) {
    .jp-v3-hero-grid,
    .jp-v3-dark-grid,
    .jp-v3-capability-grid,
    .jp-v3-experience-grid,
    .jp-v3-contact-grid {
      grid-template-columns: 1fr;
    }

    .jp-v3-service-grid,
    .jp-v3-product-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jp-v3-technology-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jp-v3-section-head {
      grid-template-columns: 1fr;
    }

    .jp-v3-hero-grid,
    .jp-v3-experience-grid,
    .jp-v3-contact-grid {
      gap: 48px;
    }
  }

  @media (max-width: 760px) {
    .jp-v3-wrap {
      width: min(100% - 24px, 1280px);
    }

    .jp-v3-hero {
      padding: 68px 0 44px;
    }

    .jp-v3-grid,
    .jp-v3-experience-grid,
    .jp-v3-contact-grid {
      gap: 40px;
    }

    .jp-v3-section {
      padding: 72px 0;
    }

    .jp-v3-contact-section {
      padding-bottom: 104px;
    }

    .jp-v3-clients-section {
      padding-top: 56px;
      padding-bottom: 88px;
    }

    .jp-v3-clients-head {
      margin-bottom: 38px;
    }

    .jp-v3-client-group {
      gap: 16px;
      padding-right: 16px;
    }

    .jp-v3-client-logo-card {
      flex-basis: 170px;
      width: 170px;
      height: 94px;
      border-radius: 22px;
      padding: 18px;
    }

    .jp-v3-client-logo-card img {
      max-height: 54px;
    }

    .jp-v3-hero h1 {
      letter-spacing: -.045em;
    }

    .jp-v3-lead {
      margin-top: 26px;
      line-height: 1.62;
    }

    .jp-v3-section-head {
      gap: 24px;
      margin-bottom: 44px;
    }

    .jp-v3-actions {
      flex-direction: column;
      gap: 12px;
      margin-top: 34px;
    }

    .jp-v3-btn {
      width: 100%;
    }

    .jp-v3-pills,
    .jp-v3-service-grid,
    .jp-v3-product-grid,
    .jp-v3-category-grid,
    .jp-v3-stack-grid,
    .jp-v3-contact-links {
      grid-template-columns: 1fr;
    }

    .jp-v3-technology-panel {
      border-radius: 32px;
      padding: 30px 18px;
    }

    .jp-v3-technology-head {
      margin-bottom: 36px;
    }

    .jp-v3-technology-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .jp-v3-tech-capability {
      border-radius: 22px;
      padding: 22px 10px 20px;
    }

    .jp-v3-tech-mark {
      width: 72px;
      height: 72px;
      border-radius: 23px;
      font-size: 30px;
    }

    .jp-v3-tech-wordmark {
      font-size: 21px;
    }

    .jp-v3-tech-wordmark-next {
      font-size: 30px;
    }

    .jp-v3-tech-capability h3 {
      font-size: 17px;
    }

    .jp-v3-tech-capability p {
      font-size: 12px;
    }

    .jp-v3-dark-panel,
    .jp-v3-contact-panel {
      border-radius: 32px;
      padding: 26px;
    }

    .jp-v3-card,
    .jp-v3-timeline-card {
      border-radius: 26px;
      padding: 26px;
    }

    .jp-v3-pills {
      gap: 12px;
      margin-top: 38px;
    }

    .jp-v3-glow-inner {
      padding: 18px;
    }

    .jp-v3-form-card {
      border-radius: 26px;
      padding: 22px;
    }

    .jp-v3-contact-link {
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .jp-v3-timeline::before {
      display: none;
    }

    .jp-v3-timeline-card {
      margin-left: 0;
    }

    .jp-v3-timeline {
      gap: 20px;
    }

    .jp-v3-timeline-dot {
      position: static;
      margin-bottom: 16px;
    }

    .jp-v3-floating-whatsapp {
      right: auto;
      left: 16px;
      bottom: 16px;
      min-height: 48px;
      padding: 13px 18px;
    }

    .jp-v3-scroll-cue {
      right: 16px;
      bottom: 78px;
    }

    .jp-v3-scroll-cue-label {
      display: none;
    }

    .jp-v3-scroll-cue-icon {
      width: 42px;
      height: 42px;
      background: rgba(255, 255, 255, .94);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

    .jp-v3 {
      padding-bottom: 72px;
    }

    /* Decorative layers are expensive on small GPUs and do not add information. */
    .jp-v3-blob-2,
    .jp-v3-blob-3,
    .jp-v3-blob-4 {
      display: none;
    }

    .jp-v3-eyebrow,
    .jp-v3-pill {
      backdrop-filter: none;
    }
  }

  @media (max-width: 480px) {
    .jp-v3-wrap {
      width: calc(100% - 32px);
    }

    .jp-v3-hero {
      padding-top: 52px;
    }

    .jp-v3-section {
      padding: 60px 0;
    }

    .jp-v3-eyebrow {
      max-width: 100%;
      padding: 9px 12px;
      font-size: 12px;
      line-height: 1.35;
    }

    .jp-v3-live-dot {
      flex: 0 0 10px;
      width: 10px;
      height: 10px;
    }

    .jp-v3-hero h1 {
      margin-top: 24px;
      font-size: clamp(38px, 12vw, 48px);
      line-height: 1.02;
    }

    .jp-v3-title {
      font-size: clamp(31px, 10vw, 40px);
      line-height: 1.08;
    }

    .jp-v3-copy {
      margin-top: 18px;
      font-size: 16px;
      line-height: 1.65;
    }

    .jp-v3-card,
    .jp-v3-timeline-card {
      padding: 22px;
    }

    .jp-v3-card h3 {
      font-size: 20px;
    }

    .jp-v3-timeline-card h3 {
      font-size: 20px !important;
    }

    .jp-v3-glow-card {
      border-radius: 28px;
    }

    .jp-v3-glow-inner {
      border-radius: 27px;
      padding: 15px;
    }

    .jp-v3-glow-inner > div:first-child {
      gap: 12px !important;
    }

    .jp-v3-glow-inner > div:first-child .jp-v3-icon {
      width: 48px;
      height: 48px;
      flex: 0 0 48px;
      border-radius: 16px;
      font-size: 20px;
    }

    .jp-v3-preview-tabs {
      gap: 8px;
    }

    .jp-v3-preview-tab {
      padding: 12px 8px;
      text-align: center;
      font-size: 13px;
    }

    .jp-v3-browser {
      border-radius: 22px;
      padding: 10px;
    }

    .jp-v3-browser-window {
      border-radius: 18px;
      padding: 12px;
    }

    #jp-panel-shopify .jp-v3-browser-window > div:first-child > div:first-child {
      width: 72px !important;
      height: 72px !important;
      flex: 0 0 72px;
      border-radius: 20px !important;
    }

    .jp-v3-client-logo-card {
      flex-basis: 152px;
      width: 152px;
      height: 88px;
      padding: 16px;
    }

    .jp-v3-client-logo-card img {
      max-height: 48px;
    }

    .jp-v3-form-empty {
      border-radius: 20px;
      padding: 20px;
    }

    .jp-v3-technology-panel {
      padding: 26px 14px;
    }

    .jp-v3-tech-capability {
      padding: 18px 8px;
    }

    .jp-v3-tech-mark {
      width: 64px;
      height: 64px;
      border-radius: 20px;
      font-size: 27px;
    }

    .jp-v3-tech-capability h3 {
      font-size: 15px;
    }

    .jp-v3-floating-whatsapp {
      right: auto;
      left: 16px;
      padding: 13px 16px;
    }
  }

  @media (hover: none), (pointer: coarse) {
    .jp-v3-card::before,
    .jp-v3-pill::before {
      display: none;
    }

    .jp-v3-card:hover,
    .jp-v3-pill:hover,
    .jp-v3-btn:hover,
    .jp-v3-category-card:hover,
    .jp-v3-client-logo-card:hover,
    .jp-v3-floating-whatsapp:hover,
    .jp-v3-scroll-cue:hover {
      transform: none;
    }

    .jp-v3-scroll-cue:hover {
      color: #475569 !important;
    }

    .jp-v3-scroll-cue:hover .jp-v3-scroll-cue-icon {
      border-color: rgba(148, 163, 184, .3);
      background: rgba(255, 255, 255, .94);
      color: #0f172a;
      box-shadow: 0 14px 36px rgba(15, 23, 42, .14);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .jp-v3-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
    .jp-v3-card:hover, .jp-v3-pill:hover, .jp-v3-btn:hover, .jp-v3-floating-whatsapp:hover { transform: none !important; }
    .jp-v3-shine::after { display: none !important; }
    .jp-v3-client-slider { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
    .jp-v3-client-track { animation: none !important; }
    .jp-v3-client-group[aria-hidden="true"] { display: none; }
    .jp-v3-scroll-cue-icon { animation: none !important; }
  }

/* kaarix */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  .jp-kaarix {
    --jp-ink: #0f172a;
    --jp-muted: #64748b;
    --jp-soft: #f8fafc;
    --jp-border: #e2e8f0;
    --jp-indigo: #4f46e5;
    --jp-gold: #b97816;
    --jp-gold-2: #d9a441;
    --jp-gold-3: #f0b638;
    --jp-cream: #fff8e8;
    --jp-cream-2: #fffbf2;
    --jp-line-gold: #efe4cc;
    background: #f8fafc;
    color: var(--jp-ink);
  }


  .jp-kaarix a,
  .jp-kaarix button,
  .jp-kaarix h1,
  .jp-kaarix h2,
  .jp-kaarix h3,
  .jp-kaarix h4,
  .jp-kaarix summary {
    font-weight: 600;
  }

  .jp-kaarix p,
  .jp-kaarix span,
  .jp-kaarix li {
    font-weight: 500;
  }

  .jp-kaarix-grid {
    background-image:
      linear-gradient(to right, rgba(148, 163, 184, .14) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(148, 163, 184, .14) 1px, transparent 1px);
    background-size: 34px 34px;
  }

  .jp-kaarix-gold-text {
    background: linear-gradient(90deg, #9a681b, #d9a441, #f0b638);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .jp-kaarix-card {
    position: relative;
    overflow: hidden;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background-color .24s ease;
  }

  .jp-kaarix-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      520px circle at var(--mx, 50%) var(--my, 50%),
      rgba(217, 164, 65, .16),
      transparent 45%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-kaarix-card:hover::before {
    opacity: 1;
  }

  .jp-kaarix-card:hover {
    transform: translateY(-6px);
    border-color: rgba(217, 164, 65, .45);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
    background: #ffffff;
  }

  .jp-kaarix-content {
    position: relative;
    z-index: 1;
  }

  .jp-kaarix-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .jp-kaarix-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-130%) skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transition: transform .7s ease;
    z-index: -1;
  }

  .jp-kaarix-shine:hover::after {
    transform: translateX(130%) skewX(-18deg);
  }

  .jp-kaarix-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
  }

  .jp-kaarix-reveal.jp-show {
    opacity: 1;
    transform: translateY(0);
  }

  .jp-dashboard {
    position: relative;
    overflow: hidden;
  }

  .jp-dashboard::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
      radial-gradient(circle at top left, rgba(217, 164, 65, .25), transparent 34%),
      radial-gradient(circle at bottom right, rgba(79, 70, 229, .18), transparent 36%);
    pointer-events: none;
  }

  .jp-dash-screen {
    position: relative;
    overflow: hidden;
  }

  .jp-dash-screen::after {
    content: "";
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 34%;
    background: linear-gradient(to bottom, transparent, rgba(217, 164, 65, .14), transparent);
    animation: jpKaarixScan 3.5s ease-in-out infinite;
    pointer-events: none;
  }

  .jp-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #b97816, #d9a441, #f0b638);
    animation: jpKaarixProgress 1.4s ease both;
  }

  .jp-form-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    background: #f8fafc;
    padding: 28px;
    text-align: center;
    color: #64748b;
  }

  .jp-form-empty i {
    color: #b97816;
    font-size: 26px;
  }

  .jp-elementor-contact-form .elementor-field-group {
    margin-bottom: 16px;
  }

  .jp-elementor-contact-form .elementor-field,
  .jp-elementor-contact-form .elementor-select-wrapper select {
    min-height: 56px;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .jp-elementor-contact-form textarea.elementor-field {
    min-height: 140px;
    resize: vertical;
  }

  .jp-elementor-contact-form .elementor-field:focus,
  .jp-elementor-contact-form .elementor-select-wrapper select:focus {
    border-color: #f0b638 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(240, 182, 56, .22) !important;
  }

  .jp-elementor-contact-form .elementor-field::placeholder {
    color: #94a3b8 !important;
  }

  .jp-elementor-contact-form .elementor-field-label {
    margin-bottom: 8px;
    color: #334155;
    font-size: 14px;
    font-weight: 600 !important;
  }

  .jp-elementor-contact-form .elementor-button {
    width: 100%;
    min-height: 56px;
    border-radius: 16px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
  }

  .jp-elementor-contact-form .elementor-button:hover {
    background: #b97816 !important;
    transform: translateY(-2px);
    box-shadow: 0 24px 70px rgba(185, 120, 22, .18);
  }

  .jp-kaarix details summary {
    list-style: none;
  }

  .jp-kaarix details summary::-webkit-details-marker {
    display: none;
  }

  .jp-kaarix details[open] .jp-faq-icon {
    transform: rotate(180deg);
  }

  .jp-faq-icon {
    transition: transform .2s ease;
  }

  @keyframes jpKaarixScan {
    0% {
      transform: translateY(-120%);
      opacity: 0;
    }

    20% {
      opacity: 1;
    }

    70% {
      opacity: 1;
    }

    100% {
      transform: translateY(360%);
      opacity: 0;
    }
  }

  @keyframes jpKaarixProgress {
    from {
      width: 0;
    }
  }

  @media (max-width: 767px) {
    .jp-dash-table {
      overflow-x: auto;
    }

    .jp-dash-row {
      min-width: 560px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    .jp-kaarix-reveal {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    .jp-kaarix-card:hover {
      transform: none !important;
    }

    .jp-dash-screen::after,
    .jp-progress span,
    .jp-kaarix-shine::after {
      animation: none !important;
      transition: none !important;
    }
  }

/* turfcrm */
  html { scroll-behavior: smooth; scroll-padding-top: 92px; }
  .jp-turf { --ink:#0f172a; --muted:#64748b; --border:#e2e8f0; --green:#16a34a; --emerald:#059669; --indigo:#4f46e5; background:#f8fafc; color:var(--ink); }
  .jp-turf a,.jp-turf button,.jp-turf h1,.jp-turf h2,.jp-turf h3,.jp-turf h4,.jp-turf summary { font-weight:600; }
  .jp-turf p,.jp-turf span,.jp-turf li,.jp-turf input,.jp-turf textarea { font-weight:500; }
  .jp-turf-grid { background-image:linear-gradient(to right, rgba(148,163,184,.14) 1px, transparent 1px),linear-gradient(to bottom, rgba(148,163,184,.14) 1px, transparent 1px); background-size:34px 34px; }
  .jp-turf-gradient-text { background:linear-gradient(90deg,#16a34a,#059669,#4f46e5); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .jp-turf-card { position:relative; overflow:hidden; transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background-color .24s ease; }
  .jp-turf-card::before { content:""; position:absolute; inset:0; background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(22,163,74,.13),transparent 45%); opacity:0; transition:opacity .25s ease; pointer-events:none; }
  .jp-turf-card:hover::before { opacity:1; }
  .jp-turf-card:hover { transform:translateY(-6px); border-color:rgba(22,163,74,.30); box-shadow:0 24px 70px rgba(15,23,42,.12); background:#fff; }
  .jp-turf-content { position:relative; z-index:1; }
  .jp-turf-shine { position:relative; overflow:hidden; isolation:isolate; }
  .jp-turf-shine::after { content:""; position:absolute; inset:0; transform:translateX(-130%) skewX(-18deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent); transition:transform .7s ease; z-index:-1; }
  .jp-turf-shine:hover::after { transform:translateX(130%) skewX(-18deg); }
  .jp-turf-reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s ease; }
  .jp-turf-reveal.jp-show { opacity:1; transform:translateY(0); }
  .jp-turf-browser { position:relative; overflow:hidden; }
  .jp-turf-browser::before { content:""; position:absolute; inset:-2px; background:radial-gradient(circle at top left,rgba(22,163,74,.24),transparent 34%),radial-gradient(circle at bottom right,rgba(79,70,229,.18),transparent 36%); pointer-events:none; }
  .jp-turf-screen { position:relative; overflow:hidden; }
  .jp-turf-screen::after { content:""; position:absolute; top:-20%; left:0; width:100%; height:34%; background:linear-gradient(to bottom,transparent,rgba(22,163,74,.12),transparent); animation:jpTurfScan 4.2s ease-in-out infinite; pointer-events:none; }
  .jp-turf-route { stroke-dasharray:12 10; animation:jpTurfRoute 7s linear infinite; }
  .jp-turf-pin { animation:jpTurfPin 4s ease-in-out infinite; transform-origin:center; }
  .jp-turf-pin:nth-child(2){ animation-delay:.5s; }
  .jp-turf-pin:nth-child(3){ animation-delay:1s; }
  .jp-turf-progress span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#16a34a,#059669,#4f46e5); animation:jpTurfProgress 1.4s ease both; }
  .jp-form-empty { border:1px dashed #cbd5e1; border-radius:24px; background:#f8fafc; padding:28px; text-align:center; color:#64748b; }
  .jp-form-empty i { color:#16a34a; font-size:26px; }
  .jp-elementor-contact-form .elementor-field-group { margin-bottom:16px; }
  .jp-elementor-contact-form .elementor-field,.jp-elementor-contact-form .elementor-select-wrapper select { min-height:56px; border:1px solid #e2e8f0!important; border-radius:16px!important; background:#f8fafc!important; color:#0f172a!important; padding:14px 18px!important; font-size:14px!important; font-weight:500!important; box-shadow:none!important; outline:none!important; }
  .jp-elementor-contact-form textarea.elementor-field { min-height:140px; resize:vertical; }
  .jp-elementor-contact-form .elementor-field:focus,.jp-elementor-contact-form .elementor-select-wrapper select:focus { border-color:#86efac!important; background:#fff!important; box-shadow:0 0 0 4px rgba(134,239,172,.28)!important; }
  .jp-elementor-contact-form .elementor-field::placeholder { color:#94a3b8!important; }
  .jp-elementor-contact-form .elementor-field-label { margin-bottom:8px; color:#334155; font-size:14px; font-weight:600!important; }
  .jp-elementor-contact-form .elementor-button { width:100%; min-height:56px; border-radius:16px!important; background:#0f172a!important; color:#fff!important; font-size:15px!important; font-weight:600!important; transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease; box-shadow:0 18px 42px rgba(15,23,42,.14); }
  .jp-elementor-contact-form .elementor-button:hover { background:#16a34a!important; transform:translateY(-2px); box-shadow:0 24px 70px rgba(22,163,74,.18); }
  .jp-turf details summary { list-style:none; }
  .jp-turf details summary::-webkit-details-marker { display:none; }
  .jp-turf details[open] .jp-faq-icon { transform:rotate(180deg); }
  .jp-faq-icon { transition:transform .2s ease; }
  @keyframes jpTurfScan { 0%{transform:translateY(-120%);opacity:0}20%{opacity:1}70%{opacity:1}100%{transform:translateY(360%);opacity:0} }
  @keyframes jpTurfRoute { from{stroke-dashoffset:0} to{stroke-dashoffset:-120} }
  @keyframes jpTurfPin { 0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)} }
  @keyframes jpTurfProgress { from{width:0} }
  @media (max-width:767px){ .jp-turf-row{min-width:620px}.jp-turf-table-wrap{overflow-x:auto} }
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto}.jp-turf-reveal{opacity:1!important;transform:none!important;transition:none!important}.jp-turf-card:hover{transform:none!important}.jp-turf-screen::after,.jp-turf-progress span,.jp-turf-shine::after,.jp-turf-route,.jp-turf-pin{animation:none!important;transition:none!important} }

/* zoe-ai-bot */
html{scroll-behavior:smooth;scroll-padding-top:92px}
.jp-zoe{background:#f8fafc;color:#0f172a;--violet:#7c3aed;--indigo:#4f46e5;--pink:#c026d3}
.jp-zoe h1,.jp-zoe h2,.jp-zoe h3,.jp-zoe h4,.jp-zoe a,.jp-zoe button,.jp-zoe summary{font-weight:600}
.jp-zoe p,.jp-zoe span,.jp-zoe li{font-weight:500}
.jp-zoe-grid{background-image:linear-gradient(to right,rgba(148,163,184,.14) 1px,transparent 1px),linear-gradient(to bottom,rgba(148,163,184,.14) 1px,transparent 1px);background-size:34px 34px}
.jp-zoe-text{background:linear-gradient(90deg,#4f46e5,#7c3aed,#c026d3);-webkit-background-clip:text;background-clip:text;color:transparent}
.jp-zoe-card{position:relative;overflow:hidden;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;background:#fff}
.jp-zoe-card:before{content:"";position:absolute;inset:0;background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(124,58,237,.14),transparent 45%);opacity:0;transition:opacity .25s ease;pointer-events:none}
.jp-zoe-card:hover:before{opacity:1}.jp-zoe-card:hover{transform:translateY(-6px);border-color:rgba(124,58,237,.34);box-shadow:0 24px 70px rgba(15,23,42,.12)}
.jp-zoe-content{position:relative;z-index:1}
.jp-zoe-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.jp-zoe-reveal.jp-show{opacity:1;transform:translateY(0)}
.jp-zoe-browser{position:relative;overflow:hidden}.jp-zoe-browser:before{content:"";position:absolute;inset:-2px;background:radial-gradient(circle at top left,rgba(124,58,237,.24),transparent 34%),radial-gradient(circle at bottom right,rgba(2,132,199,.18),transparent 36%);pointer-events:none}
.jp-zoe-screen{position:relative;overflow:hidden}.jp-zoe-screen:after{content:"";position:absolute;top:-20%;left:0;width:100%;height:34%;background:linear-gradient(to bottom,transparent,rgba(124,58,237,.12),transparent);animation:jpZoeScan 4.2s ease-in-out infinite;pointer-events:none}
.jp-zoe-chat{animation:jpZoeMessage .72s ease both}.jp-zoe-chat:nth-child(2){animation-delay:.16s}.jp-zoe-chat:nth-child(3){animation-delay:.32s}
.jp-zoe-shine{position:relative;overflow:hidden;isolation:isolate}.jp-zoe-shine:after{content:"";position:absolute;inset:0;transform:translateX(-130%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transition:transform .7s ease;z-index:-1}.jp-zoe-shine:hover:after{transform:translateX(130%) skewX(-18deg)}
.jp-form-empty{border:1px dashed #cbd5e1;border-radius:24px;background:#f8fafc;padding:28px;text-align:center;color:#64748b}.jp-form-empty i{color:#7c3aed;font-size:26px}
.jp-elementor-contact-form .elementor-field-group{margin-bottom:16px}
.jp-elementor-contact-form .elementor-field,.jp-elementor-contact-form .elementor-select-wrapper select{min-height:56px;border:1px solid #e2e8f0!important;border-radius:16px!important;background:#f8fafc!important;color:#0f172a!important;padding:14px 18px!important;font-size:14px!important;font-weight:500!important;box-shadow:none!important;outline:none!important}
.jp-elementor-contact-form textarea.elementor-field{min-height:140px;resize:vertical}.jp-elementor-contact-form .elementor-field:focus,.jp-elementor-contact-form .elementor-select-wrapper select:focus{border-color:#c4b5fd!important;background:#fff!important;box-shadow:0 0 0 4px rgba(196,181,253,.35)!important}
.jp-elementor-contact-form .elementor-button{width:100%;min-height:56px;border-radius:16px!important;background:#0f172a!important;color:#fff!important;font-size:15px!important;font-weight:600!important;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;box-shadow:0 18px 42px rgba(15,23,42,.14)}.jp-elementor-contact-form .elementor-button:hover{background:#7c3aed!important;transform:translateY(-2px)}
.jp-zoe details summary{list-style:none}.jp-zoe details summary::-webkit-details-marker{display:none}.jp-zoe details[open] .jp-faq-icon{transform:rotate(180deg)}.jp-faq-icon{transition:transform .2s ease}
@keyframes jpZoeScan{0%{transform:translateY(-120%);opacity:0}20%{opacity:1}70%{opacity:1}100%{transform:translateY(360%);opacity:0}}@keyframes jpZoeMessage{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:640px){.jp-zoe > div[class*="blur-3xl"]{display:none}.jp-zoe-screen:after{animation:none}}@media(hover:none),(pointer:coarse){.jp-zoe-card:before{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.jp-zoe-reveal{opacity:1!important;transform:none!important;transition:none!important}.jp-zoe-card:hover{transform:none!important}.jp-zoe-screen:after,.jp-zoe-chat,.jp-zoe-shine:after{animation:none!important;transition:none!important}}

/* header */
  #jp-header {
    --jp-indigo: #4f46e5;
    --jp-slate: #0f172a;
    --jp-muted: #64748b;
    --jp-border: #e2e8f0;
  }

  #jp-header * {
    box-sizing: border-box;
  }

  #jp-header a,
  #jp-header button {
    text-decoration: none;
    font-weight: 500;
  }

  #jp-header .jp-header-title,
  #jp-header .jp-header-cta,
  #jp-header .jp-menu-title {
    font-weight: 600;
  }

  #jp-header .jp-nav-link {
    position: relative;
  }

  #jp-header .jp-nav-link::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 2px;
    height: 2px;
    border-radius: 999px;
    background: var(--jp-indigo);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .2s ease;
  }

  #jp-header .jp-nav-link:hover::after,
  #jp-header .jp-dropdown:hover > .jp-nav-link::after,
  #jp-header .jp-dropdown:focus-within > .jp-nav-link::after {
    transform: scaleX(1);
  }

  #jp-header .jp-dropdown > button {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #475569 !important;
    min-height: 44px;
    padding: 0 14px !important;
    border-radius: 16px !important;
    cursor: pointer;
    font-size: 14px !important;
    line-height: 1 !important;
  }

  #jp-header .jp-dropdown > button:hover,
  #jp-header .jp-dropdown:hover > button,
  #jp-header .jp-dropdown:focus-within > button {
    background: #f8fafc !important;
    border-color: var(--jp-border) !important;
    color: var(--jp-slate) !important;
  }

  #jp-header .jp-dropdown > button:focus,
  #jp-header .jp-dropdown > button:focus-visible {
    outline: none !important;
    border-color: #c7d2fe !important;
    box-shadow: 0 0 0 4px rgba(199, 210, 254, .45) !important;
  }

  #jp-header .jp-dropdown > button i {
    color: #94a3b8;
    transition: transform .18s ease;
  }

  #jp-header .jp-dropdown:hover > button i,
  #jp-header .jp-dropdown:focus-within > button i {
    transform: rotate(180deg);
  }

  #jp-header .jp-dropdown-menu {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
  }

  #jp-header .jp-dropdown:hover .jp-dropdown-menu,
  #jp-header .jp-dropdown:focus-within .jp-dropdown-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  #jp-header .jp-dropdown-menu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -16px;
    height: 16px;
  }

  #jp-header .jp-mega-menu {
    width: min(64rem, calc(100vw - 2rem));
    left: 50%;
    transform: translate(-50%, 10px);
  }

  #jp-header .jp-dropdown:hover .jp-mega-menu,
  #jp-header .jp-dropdown:focus-within .jp-mega-menu {
    transform: translate(-50%, 0);
  }

  #jp-header .jp-simple-menu {
    width: min(40rem, calc(100vw - 2rem));
    right: 0;
    transform: translateY(10px);
  }

  #jp-header .jp-dropdown:hover .jp-simple-menu,
  #jp-header .jp-dropdown:focus-within .jp-simple-menu {
    transform: translateY(0);
  }

  #jp-header .jp-mobile-panel {
    max-height: calc(100vh - 76px);
    max-height: calc(100dvh - 76px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  #jp-header details summary {
    list-style: none;
  }

  #jp-header details summary::-webkit-details-marker {
    display: none;
  }

  #jp-header details[open] summary .jp-mobile-chevron {
    transform: rotate(180deg);
  }

  #jp-header .jp-mobile-chevron {
    transition: transform .18s ease;
  }

  @media (max-width: 1180px) {
    #jp-header .jp-desktop-nav {
      gap: 12px;
    }

    #jp-header .jp-dropdown > button {
      padding-left: 10px !important;
      padding-right: 10px !important;
    }

    #jp-header .jp-header-cta {
      padding-left: 16px !important;
      padding-right: 16px !important;
    }
  }

  @media (min-width: 768px) and (max-width: 1279px) {
    #jp-header .jp-desktop-nav,
    #jp-header .jp-desktop-nav + div {
      display: none !important;
    }

    #jp-header #jp-menu-button {
      display: flex !important;
    }

    #jp-header #jp-mobile-menu.hidden {
      display: none !important;
    }

    #jp-header #jp-mobile-menu:not(.hidden) {
      display: block !important;
    }

    #jp-header #jp-mobile-menu > div {
      display: grid;
      grid-template-columns: minmax(0, 1.5fr) minmax(220px, .7fr);
      align-items: start;
      gap: 16px;
    }

    #jp-header #jp-mobile-menu > div > div:last-child {
      grid-template-columns: minmax(0, 1fr);
      margin-top: 0 !important;
    }

    #jp-header #jp-mobile-menu details > div {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #jp-header #jp-mobile-menu > div > div:first-child > div:last-child {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  @media (max-width: 420px) {
    #jp-header .jp-logo-subtitle {
      display: none;
    }
  }

/* footer */
  .jp-footer-light {
    position: relative;
    overflow: hidden;
    background:
      radial-gradient(circle at 12% 12%, rgba(199, 210, 254, .55), transparent 30%),
      radial-gradient(circle at 88% 18%, rgba(186, 230, 253, .48), transparent 28%),
      linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #0f172a;
  }

  .jp-footer-light * {
    box-sizing: border-box;
  }

  .jp-footer-light-card {
    position: relative;
    overflow: hidden;
  }

  .jp-footer-light-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      420px circle at var(--mx, 50%) var(--my, 50%),
      rgba(99, 102, 241, .12),
      transparent 42%
    );
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }

  .jp-footer-light-card:hover::before {
    opacity: 1;
  }

  .jp-footer-light-content {
    position: relative;
    z-index: 1;
  }

  .jp-footer-light-link,
  .jp-footer-product-list-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #64748b;
    transition: color .2s ease, transform .2s ease;
  }

  .jp-footer-light-link::before {
    content: "";
    width: 0;
    height: 1px;
    background: #4f46e5;
    transition: width .2s ease;
  }

  .jp-footer-light-link:hover {
    color: #4f46e5;
    transform: translateX(4px);
  }

  .jp-footer-light-link:hover::before {
    width: 14px;
  }

  .jp-footer-product-list-link {
    gap: 10px;
    width: fit-content;
    text-decoration: none;
  }

  .jp-footer-product-list-link i {
    width: 18px;
    color: #4f46e5;
    font-size: 14px;
    text-align: center;
    transition: color .2s ease, transform .2s ease;
  }

  .jp-footer-product-list-link:hover {
    color: #4f46e5;
    transform: translateX(4px);
  }

  .jp-footer-product-list-link:hover i {
    color: #0f172a;
    transform: scale(1.08);
  }

  @media (prefers-reduced-motion: reduce) {
    .jp-footer-light-link:hover,
    .jp-footer-product-list-link:hover,
    .jp-footer-product-list-link:hover i {
      transform: none;
    }
  }

/* END SHARED STYLES */

/* Shared pointer and scrolling effects. */
.jp-v3-hero {
  perspective: 1400px;
}

.jp-v3-hero-visual {
  position: relative;
  isolation: isolate;
}

.jp-v3-hero-visual::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -34px;
  border: 1px dashed rgba(79, 70, 229, .22);
  border-radius: 44px;
  animation: jpV3OrbitSpin 28s linear infinite;
  pointer-events: none;
}

.jp-v3-float-token {
  position: absolute;
  z-index: 4;
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 18px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 50px rgba(15, 23, 42, .18);
  font-size: 22px;
  backdrop-filter: blur(14px);
  pointer-events: none;
}

.jp-v3-float-token-wordpress {
  top: -25px;
  left: -28px;
  color: #4f46e5;
}

.jp-v3-float-token-react {
  top: 19%;
  right: -32px;
  color: #0ea5e9;
}

.jp-v3-float-token-database {
  bottom: 18%;
  left: -30px;
  color: #d97706;
}

.jp-v3-float-token-ai {
  right: 18%;
  bottom: -28px;
  color: #7c3aed;
}

.jp-v3-bg-grid {
  will-change: transform, opacity;
}

.jp-v3-gradient-text {
  background-size: 100% auto;
}

.jp-v3-glow-card {
  transform-style: preserve-3d;
  will-change: transform;
}

.jp-v3-glow-inner {
  transform-style: preserve-3d;
  will-change: transform;
}

.jp-v3-process {
  overflow: visible;
}

.jp-v3-process .jp-v3-dark-panel {
  transform-origin: center center;
  will-change: transform;
}

.jp-v3-project-placeholder {
  overflow: hidden;
  will-change: clip-path, transform;
}

html.jp-gsap-home .jp-v3-reveal {
  transition: none;
}

html.jp-no-scroll-motion {
  scroll-behavior: auto !important;
}

html.jp-no-scroll-motion .jp-v3-reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.jp-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  width: 100%;
  height: 3px;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, #4f46e5, #0ea5e9, #16a34a);
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  html.jp-custom-pointer-active body,
  html.jp-custom-pointer-active body * {
    cursor: none !important;
  }
}

.jp-pointer-constellation {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99998;
  width: 52px;
  height: 52px;
  opacity: 0;
  pointer-events: none;
  will-change: transform;
  transition: opacity .18s ease;
}

.jp-pointer-constellation.jp-is-visible,
.jp-pointer-trail.jp-is-visible {
  opacity: 1;
}

.jp-pointer-ring,
.jp-pointer-core,
.jp-pointer-glyph,
.jp-pointer-ripple {
  position: absolute;
  top: 50%;
  left: 50%;
  pointer-events: none;
}

.jp-pointer-ring {
  width: 38px;
  height: 38px;
  margin: -19px 0 0 -19px;
  border: 1px solid rgba(79, 70, 229, .62);
  border-right-color: rgba(14, 165, 233, .18);
  border-bottom-color: rgba(22, 163, 74, .34);
  border-radius: 50%;
  box-shadow: 0 0 22px rgba(79, 70, 229, .16);
  animation: jpPointerOrbit 2.8s linear infinite;
  transition: width .28s ease, height .28s ease, margin .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.jp-pointer-ring::before,
.jp-pointer-ring::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.jp-pointer-ring::before {
  top: -3px;
  left: 8px;
  width: 6px;
  height: 6px;
  background: #4f46e5;
  box-shadow: 0 0 12px rgba(79, 70, 229, .72);
}

.jp-pointer-ring::after {
  right: 1px;
  bottom: 2px;
  width: 4px;
  height: 4px;
  background: #0ea5e9;
  box-shadow: 0 0 10px rgba(14, 165, 233, .75);
}

.jp-pointer-core {
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 9px;
  background: rgba(15, 23, 42, .92);
  box-shadow: 0 8px 24px rgba(15, 23, 42, .24);
  transform: rotate(calc(45deg + var(--jp-pointer-angle, 0deg)));
  transition: border-radius .28s ease, background .28s ease, transform .18s ease;
}

.jp-pointer-glyph {
  width: 30px;
  margin: -6px 0 0 -15px;
  color: #fff;
  font: 700 9px/12px ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: -.08em;
  text-align: center;
  text-shadow: 0 0 9px rgba(186, 230, 253, .8);
  transition: transform .28s ease, letter-spacing .28s ease;
}

.jp-pointer-ripple {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  border: 1px solid rgba(79, 70, 229, .7);
  border-radius: 50%;
  opacity: 0;
}

.jp-pointer-constellation.jp-is-interactive .jp-pointer-ring {
  width: 50px;
  height: 50px;
  margin: -25px 0 0 -25px;
  border-color: rgba(14, 165, 233, .68);
  box-shadow: 0 0 28px rgba(14, 165, 233, .2);
}

.jp-pointer-constellation.jp-is-interactive .jp-pointer-core {
  border-radius: 50%;
  background: #4f46e5;
}

.jp-pointer-constellation.jp-is-interactive .jp-pointer-glyph {
  letter-spacing: 0;
  transform: scale(1.08);
}

.jp-pointer-constellation.jp-is-clicked .jp-pointer-ripple {
  animation: jpPointerRipple .52s ease-out;
}

.jp-pointer-trail {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99997;
  width: var(--jp-trail-size, 6px);
  height: var(--jp-trail-size, 6px);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: 2px;
  opacity: 0;
  background: var(--jp-trail-color, #4f46e5);
  box-shadow: 0 0 12px var(--jp-trail-glow, rgba(79, 70, 229, .45));
  pointer-events: none;
  will-change: transform;
  transition: opacity .2s ease;
}

@keyframes jpV3GradientFlow {
  from { background-position: 0% 50%; }
  to { background-position: 100% 50%; }
}

@keyframes jpV3OrbitSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes jpPointerOrbit {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes jpPointerRipple {
  0% { opacity: .9; transform: scale(.55); }
  100% { opacity: 0; transform: scale(2.35); }
}

@media (max-width: 1080px) {
  .jp-v3-hero-visual::before,
  .jp-v3-float-token {
    display: none;
  }
}

@media (max-width: 639px) {
  :is(
    .jp-ca-crm,
    .jp-framer,
    .jp-jsme,
    .jp-ratemint,
    .jp-react,
    .jp-securescope,
    .jp-webflow,
    .jp-wordpress,
    .jp-kaarix
  ) > section:first-of-type > .grid {
    grid-template-columns: minmax(0, 1fr);
  }

  :is(
    .jp-ca-crm,
    .jp-framer,
    .jp-jsme,
    .jp-ratemint,
    .jp-react,
    .jp-securescope,
    .jp-webflow,
    .jp-wordpress,
    .jp-kaarix
  ) > section:first-of-type > .grid > * {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .jp-ratemint .jp-code-panel {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .jp-ratemint .jp-code-panel pre {
    min-width: max-content;
  }
}


@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .jp-pointer-constellation,
  .jp-pointer-trail {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .jp-v3-glow-card,
  .jp-v3-glow-inner,
  .jp-v3-process .jp-v3-dark-panel,
  .jp-v3-project-placeholder {
    will-change: auto;
  }

  .jp-v3-gradient-text {
    animation: none;
  }

  .jp-v3-hero-visual::before {
    animation: none;
  }
}
/* Font Awesome 6 compatibility: keep Elementor styles from overriding CDN icon fonts. */
.fa-solid,
.fas {
  font-family: "Font Awesome 6 Free" !important;
  font-style: normal !important;
  font-weight: 900 !important;
}

.fa-regular,
.far {
  font-family: "Font Awesome 6 Free" !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

.fa-brands,
.fab {
  font-family: "Font Awesome 6 Brands" !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

/* Refined technology section: clean icon grid inspired by the supplied reference. */
.jp-v3-technology-section {
  border-block: 1px solid rgba(203, 213, 225, .58);
  background: #eef3fb;
  padding: clamp(88px, 9vw, 124px) 0;
}

.jp-v3-technology-panel {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.jp-v3-technology-panel::before,
.jp-v3-technology-panel::after {
  display: none;
}

.jp-v3-technology-head {
  max-width: 760px;
  margin: 0 auto clamp(48px, 6vw, 70px);
}

.jp-v3-technology-head .jp-v3-title {
  font-size: clamp(40px, 5vw, 62px);
}

.jp-v3-technology-grid {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: clamp(16px, 1.8vw, 24px);
  align-items: start;
}

.jp-v3-tech-capability {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.jp-v3-tech-capability::before {
  display: none;
}

.jp-v3-tech-mark {
  width: clamp(88px, 7.5vw, 108px);
  height: clamp(88px, 7.5vw, 108px);
  border: 1px solid rgba(226, 232, 240, .82);
  border-radius: 50%;
  background: #fff;
  font-size: clamp(32px, 3vw, 42px);
  box-shadow:
    0 18px 40px rgba(15, 23, 42, .08),
    inset 0 1px 0 rgba(255, 255, 255, .94);
  transition:
    transform 220ms cubic-bezier(.23, 1, .32, 1),
    box-shadow 220ms ease;
}

.jp-v3-tech-wordmark {
  font-size: clamp(21px, 2vw, 27px);
}

.jp-v3-tech-wordmark-next {
  font-size: clamp(30px, 3vw, 40px);
}

.jp-v3-tech-capability h3 {
  margin: 18px 0 0;
  color: #1e293b;
  font-size: clamp(14px, 1.25vw, 17px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -.025em;
}

.jp-v3-tech-capability p {
  display: none;
}

@media (hover: hover) and (pointer: fine) {
  .jp-v3-tech-capability:hover .jp-v3-tech-mark {
    transform: translateY(-5px);
    box-shadow:
      0 24px 48px rgba(15, 23, 42, .12),
      inset 0 1px 0 rgba(255, 255, 255, .94);
  }
}

@media (max-width: 1100px) {
  .jp-v3-technology-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 34px 20px;
  }
}

@media (max-width: 640px) {
  .jp-v3-technology-section {
    padding: 72px 0 78px;
  }

  .jp-v3-technology-head {
    margin-bottom: 42px;
  }

  .jp-v3-technology-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 16px;
  }

  .jp-v3-tech-mark {
    width: 92px;
    height: 92px;
    font-size: 34px;
  }

  .jp-v3-tech-capability h3 {
    margin-top: 14px;
    font-size: 15px;
  }
}

/* Native WordPress blog */
.jp-blog {
  --jp-blog-ink: #0f172a;
  --jp-blog-muted: #64748b;
  --jp-blog-border: #e2e8f0;
  --jp-blog-indigo: #4f46e5;
  --jp-blog-violet: #7c3aed;
  --jp-blog-sky: #0ea5e9;
  min-height: 100vh;
  overflow: hidden;
  background: #f8fafc;
  color: var(--jp-blog-ink);
}

.jp-blog *,
.jp-blog *::before,
.jp-blog *::after {
  box-sizing: border-box;
}

.jp-blog a {
  color: inherit;
}

.jp-blog-shell {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 40px), 1180px);
  margin-inline: auto;
}

.jp-blog-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(88px, 10vw, 144px) 0 clamp(70px, 8vw, 112px);
  background:
    radial-gradient(circle at 70% 10%, rgba(14, 165, 233, .14), transparent 32%),
    radial-gradient(circle at 18% 30%, rgba(99, 102, 241, .14), transparent 30%),
    linear-gradient(145deg, #f8fafc, #eef2ff);
}

.jp-blog-grid-bg,
.jp-blog-article-header-bg {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .55;
  background-image:
    linear-gradient(to right, rgba(148, 163, 184, .16) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148, 163, 184, .16) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(to bottom, #000, transparent 92%);
}

.jp-blog-hero .jp-blog-shell {
  display: grid;
  grid-template-columns: minmax(0, 820px) auto;
  gap: 48px;
  align-items: end;
}

.jp-blog-kicker {
  margin: 0 0 16px;
  color: var(--jp-blog-indigo);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.jp-blog-hero h1,
.jp-blog-article-header h1 {
  margin: 0;
  color: #020617;
  font-size: clamp(46px, 6.2vw, 78px);
  font-weight: 700;
  line-height: .99;
  letter-spacing: -.06em;
}

.jp-blog-intro,
.jp-blog-article-deck {
  max-width: 760px;
  margin: 28px 0 0;
  color: var(--jp-blog-muted);
  font-size: clamp(18px, 2vw, 21px);
  line-height: 1.75;
}

.jp-blog-hero-cta,
.jp-blog-lead-cta > a {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 11px;
  border-radius: 18px;
  background: #0f172a;
  padding: 0 22px;
  color: #fff !important;
  font-size: 15px;
  font-weight: 750;
  text-decoration: none !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, .2);
  transition:
    transform 160ms cubic-bezier(.23, 1, .32, 1),
    background-color 180ms ease,
    box-shadow 180ms ease;
}

.jp-blog-hero-cta:active,
.jp-blog-lead-cta > a:active,
.jp-blog-read-link:active,
.jp-blog-empty > a:active {
  transform: scale(.97);
}

.jp-blog-hero-cta:focus-visible,
.jp-blog-lead-cta > a:focus-visible,
.jp-blog-read-link:focus-visible,
.jp-blog-categories a:focus-visible,
.jp-blog-empty > a:focus-visible,
.jp-blog-post-navigation a:focus-visible {
  outline: 3px solid rgba(99, 102, 241, .34);
  outline-offset: 4px;
}

.jp-blog-listing {
  padding: clamp(68px, 8vw, 112px) 0 clamp(96px, 10vw, 148px);
}

.jp-blog-categories {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 0 0 42px;
  overflow-x: auto;
  padding: 4px 4px 10px;
  scrollbar-width: none;
}

.jp-blog-categories::-webkit-scrollbar {
  display: none;
}

.jp-blog-categories a {
  flex: 0 0 auto;
  border: 1px solid var(--jp-blog-border);
  border-radius: 999px;
  background: #fff;
  padding: 10px 16px;
  color: #475569;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease,
    transform 160ms cubic-bezier(.23, 1, .32, 1);
}

.jp-blog-categories a.jp-active {
  border-color: #0f172a;
  background: #0f172a;
  color: #fff;
}

.jp-blog-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}

.jp-blog-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 30px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .08);
  transition:
    transform 220ms cubic-bezier(.23, 1, .32, 1),
    border-color 180ms ease,
    box-shadow 220ms ease;
}

.jp-blog-card-featured {
  display: grid;
  grid-column: span 2;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
}

.jp-blog-card-media {
  display: block;
  min-height: 230px;
  overflow: hidden;
  background: #eef2ff;
}

.jp-blog-card-featured .jp-blog-card-media {
  min-height: 100%;
}

.jp-blog-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(.23, 1, .32, 1);
}

.jp-blog-card-fallback {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 230px;
  place-items: center;
  background:
    radial-gradient(circle at 22% 18%, rgba(14, 165, 233, .28), transparent 28%),
    radial-gradient(circle at 78% 82%, rgba(124, 58, 237, .24), transparent 30%),
    linear-gradient(135deg, #eef2ff, #f8fafc);
  color: var(--jp-blog-indigo);
  font-size: 42px;
}

.jp-blog-card-content {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 28px;
}

.jp-blog-card-featured .jp-blog-card-content {
  justify-content: center;
  padding: clamp(30px, 4vw, 46px);
}

.jp-blog-card-meta,
.jp-blog-article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 14px;
  align-items: center;
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.jp-blog-card-meta a,
.jp-blog-article-meta a {
  color: var(--jp-blog-indigo);
  text-decoration: none;
}

.jp-blog-card h2 {
  margin: 18px 0 0;
  color: #0f172a;
  font-size: clamp(22px, 2.3vw, 29px);
  font-weight: 750;
  line-height: 1.16;
  letter-spacing: -.038em;
}

.jp-blog-card h2 a {
  text-decoration: none;
}

.jp-blog-card p {
  margin: 15px 0 0;
  color: var(--jp-blog-muted);
  font-size: 15px;
  line-height: 1.7;
}

.jp-blog-read-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  align-self: flex-start;
  margin-top: 24px;
  color: var(--jp-blog-indigo) !important;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none !important;
  transition:
    gap 180ms cubic-bezier(.23, 1, .32, 1),
    transform 160ms cubic-bezier(.23, 1, .32, 1);
}

.jp-blog-empty {
  display: grid;
  min-height: 390px;
  place-items: center;
  align-content: center;
  border: 1px solid var(--jp-blog-border);
  border-radius: 34px;
  background: #fff;
  padding: 44px 24px;
  text-align: center;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .07);
}

.jp-blog-empty-icon {
  display: grid;
  width: 70px;
  height: 70px;
  place-items: center;
  border-radius: 22px;
  background: #eef2ff;
  color: var(--jp-blog-indigo);
  font-size: 26px;
}

.jp-blog-empty h2 {
  margin: 22px 0 0;
  font-size: 30px;
  letter-spacing: -.04em;
}

.jp-blog-empty p {
  max-width: 570px;
  margin: 13px 0 0;
  color: var(--jp-blog-muted);
  line-height: 1.7;
}

.jp-blog-empty > a {
  margin-top: 24px;
  color: var(--jp-blog-indigo);
  font-weight: 800;
  text-decoration: none;
  transition: transform 160ms cubic-bezier(.23, 1, .32, 1);
}

.jp-blog-pagination {
  margin-top: 52px;
}

.jp-blog-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  justify-content: center;
}

.jp-blog-pagination .page-numbers {
  display: grid;
  min-width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--jp-blog-border);
  border-radius: 14px;
  background: #fff;
  color: #475569;
  padding-inline: 13px;
  font-weight: 750;
  text-decoration: none;
}

.jp-blog-pagination .page-numbers.current {
  border-color: #0f172a;
  background: #0f172a;
  color: #fff;
}

.jp-blog-article-header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(76px, 9vw, 126px) 0 clamp(64px, 8vw, 102px);
  background:
    radial-gradient(circle at 70% 5%, rgba(14, 165, 233, .12), transparent 32%),
    linear-gradient(145deg, #f8fafc, #eef2ff);
}

.jp-blog-article-narrow {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 40px), 820px);
  margin-inline: auto;
}

.jp-blog-back-link {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  margin-bottom: 42px;
  color: #475569 !important;
  font-size: 14px;
  font-weight: 750;
  text-decoration: none !important;
}

.jp-blog-article-meta {
  margin-bottom: 20px;
}

.jp-blog-article-header h1 {
  font-size: clamp(42px, 6vw, 72px);
}

.jp-blog-author-line {
  display: flex;
  gap: 13px;
  align-items: center;
  margin-top: 30px;
}

.jp-blog-author-line img,
.jp-blog-author-card img {
  border-radius: 50%;
  object-fit: cover;
}

.jp-blog-author-line span {
  display: grid;
  gap: 2px;
}

.jp-blog-author-line strong {
  color: #0f172a;
  font-size: 14px;
}

.jp-blog-author-line small {
  color: var(--jp-blog-muted);
  font-size: 12px;
}

.jp-blog-featured-image {
  overflow: hidden;
  margin: clamp(42px, 6vw, 76px) 0 0;
  border-radius: 32px;
  background: #e2e8f0;
  box-shadow: 0 26px 72px rgba(15, 23, 42, .13);
}

.jp-blog-featured-image img {
  display: block;
  width: 100%;
  height: auto;
}

.jp-blog-article-content {
  padding: clamp(52px, 7vw, 82px) 0 24px;
  color: #334155;
  font-size: 18px;
  line-height: 1.85;
}

.jp-blog-article-content > *:first-child {
  margin-top: 0;
}

.jp-blog-article-content h2,
.jp-blog-article-content h3,
.jp-blog-article-content h4 {
  color: #0f172a;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -.035em;
}

.jp-blog-article-content h2 {
  margin: 58px 0 18px;
  font-size: clamp(30px, 4vw, 40px);
}

.jp-blog-article-content h3 {
  margin: 42px 0 14px;
  font-size: 27px;
}

.jp-blog-article-content p,
.jp-blog-article-content ul,
.jp-blog-article-content ol {
  margin: 0 0 24px;
}

.jp-blog-article-content li + li {
  margin-top: 9px;
}

.jp-blog-article-content a {
  color: var(--jp-blog-indigo);
  font-weight: 700;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.jp-blog-article-content blockquote {
  margin: 38px 0;
  border-left: 4px solid var(--jp-blog-indigo);
  border-radius: 0 20px 20px 0;
  background: #eef2ff;
  padding: 24px 28px;
  color: #312e81;
  font-size: 20px;
  font-weight: 650;
}

.jp-blog-article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 22px;
}

.jp-blog-article-content pre,
.jp-blog-article-content table {
  max-width: 100%;
  overflow-x: auto;
}

.jp-blog-lead-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 34px;
  align-items: center;
  margin: 56px 0;
  border-radius: 32px;
  background:
    radial-gradient(circle at 90% 0, rgba(14, 165, 233, .22), transparent 34%),
    linear-gradient(135deg, #111827, #0f172a);
  padding: clamp(28px, 5vw, 48px);
  color: #fff;
  box-shadow: 0 30px 80px rgba(15, 23, 42, .22);
}

.jp-blog-lead-cta .jp-blog-kicker {
  color: #a5b4fc;
}

.jp-blog-lead-cta h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.12;
  letter-spacing: -.04em;
}

.jp-blog-lead-cta p:not(.jp-blog-kicker) {
  margin: 14px 0 0;
  color: #cbd5e1;
  line-height: 1.7;
}

.jp-blog-lead-cta > a {
  flex: 0 0 auto;
  background: #4f46e5;
  box-shadow: 0 18px 44px rgba(79, 70, 229, .32);
}

.jp-blog-author-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  margin: 48px 0;
  border: 1px solid var(--jp-blog-border);
  border-radius: 28px;
  background: #fff;
  padding: 28px;
}

.jp-blog-author-card span {
  color: var(--jp-blog-muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.jp-blog-author-card h2 {
  margin: 4px 0 0;
  font-size: 23px;
  letter-spacing: -.03em;
}

.jp-blog-author-card p {
  margin: 10px 0 0;
  color: var(--jp-blog-muted);
  line-height: 1.7;
}

.jp-blog-author-card a {
  display: inline-block;
  margin-top: 13px;
  color: var(--jp-blog-indigo);
  font-weight: 800;
  text-decoration: none;
}

.jp-blog-post-navigation {
  margin: 42px 0 100px;
}

.jp-blog-post-navigation .nav-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.jp-blog-post-navigation a {
  display: grid;
  height: 100%;
  gap: 5px;
  border: 1px solid var(--jp-blog-border);
  border-radius: 22px;
  background: #fff;
  padding: 22px;
  text-decoration: none;
}

.jp-blog-post-navigation small {
  color: var(--jp-blog-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.jp-blog-post-navigation strong {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.4;
}

@media (hover: hover) and (pointer: fine) {
  .jp-blog-hero-cta:hover,
  .jp-blog-lead-cta > a:hover {
    transform: translateY(-2px);
    background: var(--jp-blog-indigo);
    box-shadow: 0 22px 52px rgba(79, 70, 229, .28);
  }

  .jp-blog-card:hover {
    transform: translateY(-5px);
    border-color: rgba(99, 102, 241, .3);
    box-shadow: 0 28px 70px rgba(15, 23, 42, .12);
  }

  .jp-blog-card:hover .jp-blog-card-media img {
    transform: scale(1.035);
  }

  .jp-blog-read-link:hover {
    gap: 13px;
  }

  .jp-blog-categories a:hover:not(.jp-active) {
    border-color: #c7d2fe;
    background: #eef2ff;
    color: var(--jp-blog-indigo);
  }
}

@media (max-width: 960px) {
  .jp-blog-hero .jp-blog-shell {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .jp-blog-hero-cta {
    justify-self: start;
  }

  .jp-blog-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jp-blog-card-featured {
    grid-column: span 2;
  }
}

@media (max-width: 700px) {
  .jp-blog-shell,
  .jp-blog-article-narrow {
    width: min(calc(100% - 24px), 820px);
  }

  .jp-blog-hero {
    padding: 70px 0 62px;
  }

  .jp-blog-hero h1,
  .jp-blog-article-header h1 {
    font-size: clamp(40px, 12.5vw, 56px);
  }

  .jp-blog-intro,
  .jp-blog-article-deck {
    margin-top: 22px;
    font-size: 17px;
  }

  .jp-blog-hero-cta {
    width: 100%;
  }

  .jp-blog-listing {
    padding: 58px 0 96px;
  }

  .jp-blog-categories {
    margin-bottom: 30px;
  }

  .jp-blog-card-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .jp-blog-card-featured {
    display: block;
    grid-column: span 1;
  }

  .jp-blog-card,
  .jp-blog-featured-image {
    border-radius: 24px;
  }

  .jp-blog-card-content,
  .jp-blog-card-featured .jp-blog-card-content {
    padding: 24px;
  }

  .jp-blog-article-header {
    padding: 62px 0 58px;
  }

  .jp-blog-back-link {
    margin-bottom: 32px;
  }

  .jp-blog-article-content {
    padding-top: 48px;
    font-size: 17px;
    line-height: 1.78;
  }

  .jp-blog-lead-cta {
    grid-template-columns: 1fr;
    border-radius: 26px;
    padding: 28px 24px;
  }

  .jp-blog-lead-cta > a {
    width: 100%;
  }

  .jp-blog-author-card {
    grid-template-columns: 1fr;
    border-radius: 24px;
    padding: 24px;
  }

  .jp-blog-post-navigation .nav-links {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .jp-blog-card,
  .jp-blog-card-media img,
  .jp-blog-hero-cta,
  .jp-blog-lead-cta > a,
  .jp-blog-read-link,
  .jp-blog-categories a {
    transition: none;
  }

  .jp-blog-card:hover,
  .jp-blog-card:hover .jp-blog-card-media img,
  .jp-blog-hero-cta:hover,
  .jp-blog-lead-cta > a:hover {
    transform: none;
  }
}

/* END SHARED STYLES */