#frame-hero{background-color:#12131a;position:relative}#frame-hero .gradient-bg-purple-blue{z-index:0;background:linear-gradient(90deg,rgba(14,15,22,.95),rgba(14,15,22,.75) 10%,transparent 22%),linear-gradient(270deg,rgba(14,15,22,.95),rgba(14,15,22,.75) 10%,transparent 22%),linear-gradient(rgba(14,15,22,.4),transparent 15%),linear-gradient(transparent 85%,rgba(14,15,22,.5)),radial-gradient(700px 450px at 50% 20%,rgba(125,90,185,.85) 0,rgba(80,55,140,.45) 55%,transparent 80%),radial-gradient(650px 500px at 28% 105%,rgba(35,145,205,.85) 0,rgba(25,90,150,.4) 55%,transparent 75%),radial-gradient(650px 500px at 72% 100%,rgba(140,70,190,.75) 0,rgba(85,45,135,.35) 55%,transparent 75%),radial-gradient(1100px 700px,#463972 0,#302750 40%,#151622 85%);width:100%;height:100%;position:absolute;top:0;left:0}#frame-steps .gradient-bg-purple-blue,#frame-use-case .gradient-bg-purple-blue{z-index:0;background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.3) 8%,transparent 20%),linear-gradient(270deg,rgba(0,0,0,.6),rgba(0,0,0,.3) 8%,transparent 20%),radial-gradient(700px 700px at 0 0,rgba(0,0,0,.9) 0,rgba(20,0,10,.85) 10%,rgba(50,10,30,.8) 20%,rgba(100,30,70,.7) 30%,rgba(139,50,88,.5) 40%,rgba(140,55,95,.3) 50%,transparent 65%),radial-gradient(900px 900px at 100% 0,rgba(0,200,255,.9) 0,rgba(0,180,230,.7) 20%,rgba(0,150,200,.4) 45%,transparent 70%),radial-gradient(850px 850px at 0 100%,rgba(75,0,130,.95) 0,rgba(60,0,110,.75) 25%,rgba(50,0,90,.5) 50%,transparent 75%),radial-gradient(800px 800px at 100% 100%,rgba(30,30,120,.9) 0,rgba(20,20,100,.7) 25%,rgba(10,10,80,.5) 50%,transparent 75%),radial-gradient(1000px 600px,rgba(100,50,150,.3) 0,transparent 60%),linear-gradient(135deg,rgba(139,50,88,.6),rgba(100,40,120,.5) 20%,rgba(0,180,230,.4) 40%,rgba(75,0,130,.5) 60%,rgba(30,30,120,.6) 80%,rgba(20,20,100,.5));width:100%;height:100%;position:absolute;top:0;left:0}#frame-best-practices .gradient-bg-purple-blue{z-index:0;background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.3) 8%,transparent 20%),linear-gradient(270deg,rgba(0,0,0,.6),rgba(0,0,0,.3) 8%,transparent 20%),radial-gradient(800px 800px at 100% 0,rgba(35,145,205,.85) 0,rgba(25,90,150,.5) 25%,transparent 65%),radial-gradient(850px 850px at 0 100%,rgba(140,70,190,.85) 0,rgba(85,45,135,.45) 30%,transparent 70%),radial-gradient(1000px 600px,rgba(100,50,150,.35) 0,transparent 60%),linear-gradient(135deg,rgba(20,20,100,.6),rgba(75,0,130,.5) 30%,rgba(0,150,200,.4) 60%,rgba(139,50,88,.55));width:100%;height:100%;position:absolute;top:0;left:0}#frame-samples{background-color:#f6f5f4}#frame-samples .gradient-bg-light{background-image:url(/assets/images/pages/features/qr-code-frame-samples-bg.webp);background-position:top}#frame-samples .gradient-bg-light,#frame-samples .grainy-effect-light{z-index:0;pointer-events:none;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;position:absolute;top:0;left:0}#frame-samples .grainy-effect-light{opacity:.2;background-image:url(/assets/images/pages/features/qr-code-frame-samples-grunge.webp);background-position:50%}#frame-samples .frame-sample-card{background:linear-gradient(#fcfbfa,#f2f1ef);border-radius:20px;transition:transform .25s,box-shadow .25s;box-shadow:0 0 0 1.5px #fff,0 2px 5px rgba(15,23,42,.03),0 10px 20px -6px rgba(15,23,42,.07),0 24px 40px -16px rgba(15,23,42,.1)}#frame-samples .frame-sample-card:hover{transform:translateY(-3px);box-shadow:0 0 0 1.5px #fff,0 2px 5px rgba(15,23,42,.04),0 14px 26px -6px rgba(15,23,42,.1),0 28px 48px -16px rgba(15,23,42,.13)}#frame-samples .frame-sample-card img{filter:drop-shadow(0 3px 6px rgba(15,23,42,.08))drop-shadow(0 16px 28px rgba(15,23,42,.16))drop-shadow(0 34px 46px rgba(15,23,42,.1))}#frame-best-practices .grid-overlay,#frame-hero .grid-overlay,#frame-steps .grid-overlay,#frame-use-case .grid-overlay{z-index:1;pointer-events:none;background-image:radial-gradient(5px at 0 0,rgba(255,255,255,.08) 0,rgba(255,255,255,.05) 40%,transparent 45%),radial-gradient(5px at 100% 0,rgba(255,255,255,.08) 0,rgba(255,255,255,.05) 40%,transparent 45%),radial-gradient(5px at 0 100%,rgba(255,255,255,.08) 0,rgba(255,255,255,.05) 40%,transparent 45%),radial-gradient(5px at 100% 100%,rgba(255,255,255,.08) 0,rgba(255,255,255,.05) 40%,transparent 45%),linear-gradient(rgba(255,255,255,.04) 1px,transparent 0),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 0);background-position:0 0,0 0,0 0,0 0,0 0,0 0;background-size:80px 80px,80px 80px,80px 80px,80px 80px,80px 80px,80px 80px;width:100%;height:100%;position:absolute;top:0;left:0}#frame-best-practices .grainy-effect-dark,#frame-hero .grainy-effect-dark,#frame-steps .grainy-effect-dark,#frame-use-case .grainy-effect-dark{z-index:1;opacity:.6;mix-blend-mode:overlay;pointer-events:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='1.2' numOctaves='4' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:150px 150px;width:100%;height:100%;position:absolute;top:0;left:0}#frame-features{background-color:#fff;position:relative}#frame-features .gradient-bg-light{z-index:0;opacity:.35;pointer-events:none;background-image:url(/assets/images/pages/features/qr-code-frame-samples-bg.webp);background-position:top;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;position:absolute;top:0;left:0}