https://jewlx.ai/assets/ComparisonTable-CqfkOHqq.js

1import{u as p,j as e,r as l}from"./index-7WVUoGvM.js";function d(r=.15){const i=l.useRef(null),[s,a]=l.useState(!1);return l.useEffect(()=>{const o=i.current;if(!o)return;const t=new IntersectionObserver(([n])=>{n.isIntersecting&&(a(!0),t.disconnect())},{threshold:r});return t.observe(o),()=>t.disconnect()},[r]),[i,s]}const m=[["Launch speed","Quick launch","Weeks or months to onboard"],["Deposit collection","Built in","Lead capture only"],["AI","Built for jewelry designs","Generic AI"],["Branding & questions","Adjustable to your brand and flow","Static"],["Shopify","Direct connection","Manual setup"],["Catalog","600+ rings included","Build your own"],["Renders","3,000 renders included","Costs $30,000+"],["CAD support","Base CAD files included","Not included"],["Widget design","Premium and customizable","Generic"],["Conversion rate","5× higher with JEWLX","1× baseline"]],c="1fr 1.1fr 1fr";function f(){const[r,i]=d(.08),[s,a]=d(.1),{open:o}=p();return e.jsxs("section",{ref:r,className:"ct-section",style:{width:"100%",background:"#f8f8f6",borderBottom:"1px solid #e5e5e0",fontFamily:"'Plus Jakarta Sans', sans-serif",WebkitFontSmoothing:"antialiased"},children:[e.jsx("style",{children:`
2        .ct-section {
3          padding: 60px 0;
4        }
5        @keyframes ct-fadeUp {
6          from { opacity: 0; transform: translateY(28px); }
7          to   { opacity: 1; transform: translateY(0); }
8        }
9        @keyframes ct-rowIn {
10          from { opacity: 0; transform: translateX(-10px); }
11          to   { opacity: 1; transform: translateX(0); }
12        }
13        @keyframes ct-tableReveal {
14          from { opacity: 0; transform: translateY(36px) scale(0.985); }
15          to   { opacity: 1; transform: translateY(0)   scale(1); }
16        }
17        @keyframes ct-shimmer {
18          0%   { transform: translateX(-100%); }
19          100% { transform: translateX(400%); }
20        }
21        .ct-join-btn:hover {
22          background: #0a0a0a !important;
23          color: #fff !important;
24        }
25        .ct-row-item:hover .ct-cell-jewlx-inner {
26          background: rgba(80,200,120,.12) !important;
27        }
28        .ct-scroll-wrap {
29          overflow-x: auto;
30          -webkit-overflow-scrolling: touch;
31        }
32        .ct-scroll-wrap::-webkit-scrollbar { height: 6px; }
33        .ct-scroll-wrap::-webkit-scrollbar-thumb { background: #d0d0c8; border-radius: 100px; }
34
35        /* Mobile: stack headline + stats, allow horizontal table scroll, scale down spacing */
36        @media (max-width: 768px) {
37          .ct-section { padding: 44px 0 !important; }
38          .ct-wrap { padding: 0 20px !important; }
39          .ct-top-grid {
40            grid-template-columns: 1fr !important;
41            align-items: flex-start !important;
42            gap: 20px !important;
43            margin-bottom: 32px !important;
44          }
45          .ct-stats { gap: 28px !important; padding-bottom: 0 !important; }
46          .ct-table-min { min-width: 560px; }
47          .ct-scroll-hint {
48            position: relative;
49          }
50          .ct-scroll-hint::after {
51            content: "";
52            position: absolute;
53            top: 0; right: 0; bottom: 0;
54            width: 32px;
55            background: linear-gradient(to left, rgba(248,248,246,1), rgba(248,248,246,0));
56            pointer-events: none;
57          }
58        }
59      `}),e.jsxs("div",{className:"ct-wrap",style:{maxWidth:1100,margin:"0 auto",padding:"0 48px"},children:[e.jsxs("div",{className:"ct-top-grid",style:{display:"grid",gridTemplateColumns:"1fr auto",gap:40,alignItems:"end",marginBottom:48,opacity:i?1:0,animation:i?"ct-fadeUp .75s cubic-bezier(.22,1,.36,1) forwards":"none"},children:[e.jsxs("h2",{style:{fontFamily:"'Syne', sans-serif",fontSize:"clamp(26px, 3.4vw, 48px)",fontWeight:700,lineHeight:1,letterSpacing:"-0.00em",color:"#0a0a0a",margin:0},children:["Jewelry sales",e.jsx("br",{}),"online has never",e.jsx("br",{}),"been easier."]}),e.jsx("div",{className:"ct-stats",style:{display:"flex",gap:48,alignItems:"flex-end",paddingBottom:8,opacity:i?1:0,animation:i?"ct-fadeUp .85s .15s cubic-bezier(.22,1,.36,1) both":"none"},children:[{value:"100+",label:"HOURS SAVED"},{value:"3–5×",label:"QUALIFIED INQUIRIES"}].map(({value:t,label:n})=>e.jsxs("div",{children:[e.jsx("div",{style:{fontFamily:"'Syne', sans-serif",fontSize:"clamp(34px, 4.2vw, 60px)",fontWeight:700,color:"#0a0a0a",letterSpacing:"-0.035em",lineHeight:1},children:t}),e.jsx("div",{style:{fontSize:10,fontWeight:700,letterSpacing:"0.14em",textTransform:"uppercase",color:"#888",marginTop:8},children:n})]},n))})]}),e.jsx("div",{ref:s,className:"ct-scroll-wrap ct-scroll-hint",style:{width:"100%",opacity:a?1:0,animation:a?"ct-tableReveal .9s .1s cubic-bezier(.22,1,.36,1) both":"none"},children:e.jsxs("div",{className:"ct-table-min",children:[e.jsxs("div",{style:{display:"grid",gridTemplateColumns:c},children:[e.jsx("div",{}),e.jsxs("div",{style:{textAlign:"center",padding:"12px 18px",fontSize:11,fontWeight:700,letterSpacing:"0.12em",textTransform:"uppercase",color:"#50C878",background:"rgba(80,200,120,.08)",border:"1px solid rgba(80,200,120,.25)",borderBottom:"none",borderRadius:"14px 14px 0 0",position:"relative",overflow:"hidden"},children:[e.jsx("span",{style:{position:"absolute",top:0,left:0,width:"25%",height:"100%",background:"linear-gradient(90deg, transparent, rgba(80,200,120,.25), transparent)",animation:"ct-shimmer 2.8s 1.2s ease-in-out infinite",pointerEvents:"none"}}),"JEWLX PRODUCTS"]}),e.jsx("div",{style:{textAlign:"center",padding:"12px 18px",fontSize:11,fontWeight:700,letterSpacing:"0.12em",textTransform:"uppercase",color:"#aaa"},children:"OTHER SaaS"})]}),e.jsx("div",{style:{border:"1px solid #e5e5e0",background:"#fff"},children:m.map((t,n)=>e.jsxs("div",{className:"ct-row-item",style:{display:"grid",gridTemplateColumns:c,borderTop:n===0?"none":"1px solid #e5e5e0",opacity:a?1:0,animation:a?`ct-rowIn .5s ${.18+n*.06}s cubic-bezier(.22,1,.36,1) both`:"none"},children:[e.jsx("div",{style:{padding:"14px 20px",fontSize:13,color:"#666",display:"flex",alignItems:"center"},children:t[0]}),e.jsx("div",{className:"ct-cell-jewlx-inner",style:{padding:"14px 18px",fontSize:13,color:"#0a0a0a",fontWeight:500,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center",background:"rgba(80,200,120,.06)",borderLeft:"1px solid rgba(80,200,120,.2)",borderRight:"1px solid rgba(80,200,120,.2)",transition:"background .2s"},children:t[1]}),e.jsx("div",{style:{padding:"14px 18px",fontSize:13,color:"#bbb",display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center"},children:t[2]})]},n))}),e.jsxs("div",{style:{display:"grid",gridTemplateColumns:c},children:[e.jsx("div",{}),e.jsx("div",{style:{background:"rgba(80,200,120,.06)",border:"1px solid rgba(80,200,120,.25)",borderTop:"none",borderRadius:"0 0 14px 14px",padding:20,display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx("button",{type:"button",className:"ct-join-btn",onClick:o,style:{background:"transparent",border:"1.5px solid #0a0a0a",color:"#0a0a0a",borderRadius:100,padding:"12px 32px",fontFamily:"inherit",fontSize:14,fontWeight:600,cursor:"pointer",transition:"background .22s, color .22s"},children:"Join Waitlist"})}),e.jsx("div",{})]})]})})]})]})}export{f as ComparisonTable};