<!-- wp:greenshift-blocks/element {"id":"gsbp-3807794","tag":"section","type":"inner","localId":"gsbp-3807794","align":"full","dynamicAttributes":[{"name":"data-type","value":"section-component"}],"styleAttributes":{"display":["flex"],"justifyContent":["center"],"flexDirection":["column"],"alignItems":["center"],"paddingRight":["var(\u002d\u002dwp\u002d\u002dcustom\u002d\u002dspacing\u002d\u002dside, min(3vw, 20px))"],"paddingLeft":["var(\u002d\u002dwp\u002d\u002dcustom\u002d\u002dspacing\u002d\u002dside, min(3vw, 20px))"],"paddingTop":["100px"],"paddingBottom":["60px"],"marginTop":["0px"],"marginBottom":["0px"],"paddingLink_Extra":"lr","position":["relative"],"overflow":["clip"]},"isVariation":"contentcolumns"} -->
<section class="gsbp-3807794 alignfull" data-type="section-component"><!-- wp:greenshift-blocks/element {"id":"gsbp-3837c7b","metadata":{"name":"Content Area"},"type":"inner","localId":"gsbp-3837c7b","dynamicAttributes":[{"name":"data-type","value":"content-area-component"}],"styleAttributes":{"maxWidth":["100%"],"width":["var(\u002d\u002dwp\u002d\u002dstyle\u002d\u002dglobal\u002d\u002dwide-size, 1200px)"],"display":["flex"],"flexColumns_Extra":2,"flexWidths_Extra":{"desktop":{"name":"50/50","widths":[50,50]},"tablet":{"name":"100/100","widths":[100,100]},"mobile":{"name":"100/100","widths":[100,100]}},"flexDirection":["row"],"columnGap":["45px"],"rowGap":["45px"],"flexWrap":["wrap"]},"isVariation":"contentarea"} -->
<div class="gsbp-3837c7b" data-type="content-area-component"><!-- wp:greenshift-blocks/element {"id":"gsbp-e2e9e08","anchor":"visual-container","type":"inner","className":"clarity-visual-column","localId":"gsbp-e2e9e08"} -->
<div class="clarity-visual-column" id="visual-container"><!-- wp:greenshift-blocks/element {"id":"gsbp-c7efd66","type":"empty","className":"clarity-bg-circle c-circle-1","localId":"gsbp-c7efd66"} -->
<div class="clarity-bg-circle c-circle-1"></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-b94c0dc","type":"empty","className":"clarity-bg-circle c-circle-2","localId":"gsbp-b94c0dc"} -->
<div class="clarity-bg-circle c-circle-2"></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-19bb3c8","type":"inner","className":"clarity-blob-background","localId":"gsbp-19bb3c8"} -->
<div class="clarity-blob-background"><!-- wp:greenshift-blocks/element {"id":"gsbp-5983a56","anchor":"tilt-card","type":"inner","className":"clarity-summary-card","localId":"gsbp-5983a56"} -->
<div class="clarity-summary-card" id="tilt-card"><!-- wp:greenshift-blocks/element {"id":"gsbp-4fb2ad6","type":"inner","className":"clarity-card-header","localId":"gsbp-4fb2ad6"} -->
<div class="clarity-card-header"><!-- wp:greenshift-blocks/element {"id":"gsbp-2a3212c","type":"inner","className":"clarity-card-title","localId":"gsbp-2a3212c"} -->
<div class="clarity-card-title"><!-- wp:greenshift-blocks/element {"id":"gsbp-9c40f78","type":"empty","className":"clarity-status-dot","localId":"gsbp-9c40f78"} -->
<div class="clarity-status-dot"></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-7089f28","textContent":"Account Balance","tag":"span","localId":"gsbp-7089f28"} -->
<span>Account Balance</span>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-7653bce","type":"inner","className":"clarity-card-content","localId":"gsbp-7653bce"} -->
<div class="clarity-card-content"><!-- wp:greenshift-blocks/element {"id":"gsbp-bb94c3f","anchor":"balance-amount","textContent":"$34,500.00","className":"clarity-price-amount","localId":"gsbp-bb94c3f"} -->
<div class="clarity-price-amount" id="balance-amount">$34,500.00</div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-2063da4","anchor":"clarity-timer","textContent":"Live Updates","className":"clarity-price-updated","localId":"gsbp-2063da4"} -->
<div class="clarity-price-updated" id="clarity-timer">Live Updates</div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-8ffbdc1","type":"inner","className":"clarity-card-footer","localId":"gsbp-8ffbdc1"} -->
<div class="clarity-card-footer"><!-- wp:greenshift-blocks/element {"id":"gsbp-f6913f3","anchor":"pay-btn","tag":"button","type":"inner","className":"clarity-pay-btn","localId":"gsbp-f6913f3"} -->
<button class="clarity-pay-btn" id="pay-btn"><!-- wp:greenshift-blocks/element {"id":"gsbp-d569648","textContent":"Send a payment","tag":"span","className":"btn-text","localId":"gsbp-d569648"} -->
<span class="btn-text">Send a payment</span>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-7727522","type":"empty","className":"clarity-spinner","localId":"gsbp-7727522"} -->
<div class="clarity-spinner"></div>
<!-- /wp:greenshift-blocks/element --></button>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-da54c1f","type":"inner","className":"clarity-text-column","localId":"gsbp-da54c1f"} -->
<div class="clarity-text-column"><!-- wp:greenshift-blocks/element {"id":"gsbp-2156cf6","textContent":"GreenShift is here to make life easier.","tag":"h2","className":"clarity-main-headline","localId":"gsbp-2156cf6"} -->
<h2 class="clarity-main-headline">GreenShift is here to make life easier.</h2>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-484d30c","textContent":"Clarity gives you the blocks \u0026 components you need to create a truly professional website, landing page or admin panel for your SaaS.","tag":"p","className":"clarity-sub-description","localId":"gsbp-484d30c"} -->
<p class="clarity-sub-description">Clarity gives you the blocks & components you need to create a truly professional website, landing page or admin panel for your SaaS.</p>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-d9699df","type":"inner","className":"clarity-cta-container","localId":"gsbp-d9699df"} -->
<div class="clarity-cta-container"><!-- wp:greenshift-blocks/element {"id":"gsbp-c634138","anchor":"magnetic-btn","textContent":"Start using Greenshift","tag":"button","className":"clarity-cta-btn","localId":"gsbp-c634138"} -->
<button class="clarity-cta-btn" id="magnetic-btn">Start using Greenshift</button>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-31c7ee4","type":"empty","className":"clarity-section-divider","localId":"gsbp-31c7ee4"} -->
<div class="clarity-section-divider"></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-91c5787","type":"inner","className":"clarity-features-row","localId":"gsbp-91c5787"} -->
<div class="clarity-features-row"><!-- wp:greenshift-blocks/element {"id":"gsbp-02e3f8f","type":"inner","className":"clarity-feature-block","localId":"gsbp-02e3f8f"} -->
<div class="clarity-feature-block"><!-- wp:greenshift-blocks/element {"id":"gsbp-4acb0c1","textContent":"Unlimited Resources","className":"clarity-feature-title","localId":"gsbp-4acb0c1"} -->
<div class="clarity-feature-title">Unlimited Resources</div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-c0bef90","textContent":"Access a vast library of pre-built components designed to convert it.","tag":"p","className":"clarity-feature-text","localId":"gsbp-c0bef90"} -->
<p class="clarity-feature-text">Access a vast library of pre-built components designed to convert it.</p>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-4fe5bf2","tag":"a","type":"inner","className":"clarity-feature-link","localId":"gsbp-4fe5bf2","href":"#"} -->
<a class="clarity-feature-link" href="#"><!-- wp:greenshift-blocks/element {"id":"gsbp-973418b","textContent":"Explore Library","tag":"span","localId":"gsbp-973418b"} -->
<span>Explore Library</span>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-3fc6dec","textContent":"→","tag":"span","localId":"gsbp-3fc6dec"} -->
<span>→</span>
<!-- /wp:greenshift-blocks/element --></a>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-0e62522","type":"inner","className":"clarity-feature-block","localId":"gsbp-0e62522"} -->
<div class="clarity-feature-block"><!-- wp:greenshift-blocks/element {"id":"gsbp-7085fbb","textContent":"Figma Included","className":"clarity-feature-title","localId":"gsbp-7085fbb"} -->
<div class="clarity-feature-title">Figma Included</div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-c56210b","textContent":"Seamlessly transition from design to code with our pixel-perfect Figma kits.","tag":"p","className":"clarity-feature-text","localId":"gsbp-c56210b"} -->
<p class="clarity-feature-text">Seamlessly transition from design to code with our pixel-perfect Figma kits.</p>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-764fd89","tag":"a","type":"inner","className":"clarity-feature-link","localId":"gsbp-764fd89","href":"#"} -->
<a class="clarity-feature-link" href="#"><!-- wp:greenshift-blocks/element {"id":"gsbp-74a4613","textContent":"Get the Kit","tag":"span","localId":"gsbp-74a4613"} -->
<span>Get the Kit</span>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-626a195","textContent":"→","tag":"span","localId":"gsbp-626a195"} -->
<span>→</span>
<!-- /wp:greenshift-blocks/element --></a>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></div>
<!-- /wp:greenshift-blocks/element --></section>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:greenshift-blocks/element {"id":"gsbp-026b020","dynamicGClasses":[{"value":"clarity-visual-column","type":"local","label":"clarity-visual-column","localed":false,"css":".clarity-visual-column{display:flex;justify-content:center;align-items:center;position:relative;z-index:10;}","attributes":{"styleAttributes":{"display":["flex"],"justifyContent":["center"],"alignItems":["center"],"position":["relative"],"zIndex":["10"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-bg-circle","type":"local","label":"clarity-bg-circle","localed":false,"css":".clarity-bg-circle{position: absolute;\n border-radius: 50%;\n z-index: -1;\n pointer-events: none;\n filter: blur(40px);\n opacity: 0.6;}","attributes":{"styleAttributes":{"position":["absolute"],"borderRadius":["50%"],"zIndex":["-1"],"pointerEvents":["none"],"filter":["blur(40px)"],"opacity":["0.6"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"c-circle-1","type":"local","label":"c-circle-1","localed":false,"css":".c-circle-1{width: 300px;\n height: 300px;\n background-color: #DCE7FC;\n top: -10%;\n left: -10%;\n animation: clarityFloat 8s ease-in-out infinite;}","attributes":{"styleAttributes":{"width":["300px"],"height":["300px"],"backgroundColor":["#DCE7FC"],"top":["-10%"],"left":["-10%"],"animation":["clarityFloat 8s ease-in-out infinite"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"c-circle-2","type":"local","label":"c-circle-2","localed":false,"css":".c-circle-2{width: 250px;\n height: 250px;\n background-color: #E0E7FF;\n bottom: -5%;\n right: -10%;\n animation: clarityFloat 10s ease-in-out infinite reverse;}","attributes":{"styleAttributes":{"width":["250px"],"height":["250px"],"backgroundColor":["#E0E7FF"],"bottom":["-5%"],"right":["-10%"],"animation":["clarityFloat 10s ease-in-out infinite reverse"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-blob-background","type":"local","label":"clarity-blob-background","localed":false,"css":".clarity-blob-background{background: linear-gradient(135deg, #EFF4FF 0%, #E2EAF8 100%);\n border-radius: 48px;\n width: 100%;\n padding: 80px 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 520px;\n position: relative;\n box-shadow: inset 0 0 0 1px #FFFFFF, 0 20px 40px -20px rgba(67, 97, 238, 0.15);}@media (max-width: 1024px){.clarity-blob-background{min-height: auto;\n aspect-ratio: 1/1;\n max-width: 500px;}}@media (max-width: 640px){.clarity-blob-background{border-radius: 32px;\n padding: 40px 20px;}}","attributes":{"styleAttributes":{"background":["linear-gradient(135deg, #EFF4FF 0%, #E2EAF8 100%)"],"borderRadius":["48px"],"width":["100%"],"padding":["80px 40px"],"display":["flex"],"justifyContent":["center"],"alignItems":["center"],"minHeight":["520px"],"position":["relative"],"boxShadow":["inset 0 0 0 1px #FFFFFF, 0 20px 40px -20px rgba(67, 97, 238, 0.15)"],"customCSS_Extra":"@media (max-width: 1024px){.clarity-blob-background{min-height: auto;\n aspect-ratio: 1/1;\n max-width: 500px;}}@media (max-width: 640px){.clarity-blob-background{border-radius: 32px;\n padding: 40px 20px;}}"}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-summary-card","type":"local","label":"clarity-summary-card","localed":false,"css":".clarity-summary-card{background-color: #ffffff;\n border-radius: 24px;\n width: 100%;\n max-width: 360px;\n box-shadow: \n 0 25px 50px -12px rgba(0, 0, 0, 0.1),\n 0 0 0 1px rgba(0,0,0,0.02);\n overflow: hidden;\n display: flex;\n flex-direction: column;\n position: relative;\n transition: transform 0.3s ease, box-shadow 0.3s ease;}.clarity-summary-card:hover{transform: translateY(-5px);\n box-shadow: 0 35px 60px -12px rgba(0, 0, 0, 0.15);}@media (max-width: 640px){.clarity-summary-card{max-width: 100%;}}","attributes":{"styleAttributes":{"backgroundColor":["#ffffff"],"borderRadius":["24px"],"width":["100%"],"maxWidth":["360px"],"boxShadow":["0 25px 50px -12px rgba(0, 0, 0, 0.1),\n 0 0 0 1px rgba(0,0,0,0.02)"],"overflow":["hidden"],"display":["flex"],"flexDirection":["column"],"position":["relative"],"transition":["transform 0.3s ease, box-shadow 0.3s ease"],"transform_hover":["translateY(-5px)"],"boxShadow_hover":["0 35px 60px -12px rgba(0, 0, 0, 0.15)"],"customCSS_Extra":"@media (max-width: 640px){.clarity-summary-card{max-width: 100%;}}"}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-card-header","type":"local","label":"clarity-card-header","localed":false,"css":".clarity-card-header{padding: 24px;\n text-align: center;\n border-bottom: 1px solid #F3F4F6;}","attributes":{"styleAttributes":{"padding":["24px"],"textAlign":["center"],"borderBottom":["1px solid #F3F4F6"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-card-title","type":"local","label":"clarity-card-title","localed":false,"css":".clarity-card-title{font-size: 16px;\n font-weight: 700;\n color: #111827;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;}","attributes":{"styleAttributes":{"fontSize":["16px"],"fontWeight":["700"],"color":["#111827"],"display":["flex"],"alignItems":["center"],"justifyContent":["center"],"gap":["8px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-status-dot","type":"local","label":"clarity-status-dot","localed":false,"css":".clarity-status-dot{width: 8px;\n height: 8px;\n background-color: #10B981;\n border-radius: 50%;\n box-shadow: 0 0 0 2px #D1FAE5;}","attributes":{"styleAttributes":{"width":["8px"],"height":["8px"],"backgroundColor":["#10B981"],"borderRadius":["50%"],"boxShadow":["0 0 0 2px #D1FAE5"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-card-content","type":"local","label":"clarity-card-content","localed":false,"css":".clarity-card-content{padding: 48px 24px;\n text-align: center;}","attributes":{"styleAttributes":{"padding":["48px 24px"],"textAlign":["center"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-price-amount","type":"local","label":"clarity-price-amount","localed":false,"css":".clarity-price-amount{font-size:48px;font-weight:800;color:#111827;margin-bottom:8px;letter-spacing:-2px;transition:color 0.3s ease;}@media (max-width: 575.98px){.clarity-price-amount{font-size:38px;}}","attributes":{"styleAttributes":{"fontSize":["48px",null,null,"38px"],"fontWeight":["800"],"color":["#111827"],"marginBottom":["8px"],"letterSpacing":["-2px"],"transition":["color 0.3s ease"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-price-updated","type":"local","label":"clarity-price-updated","localed":false,"css":".clarity-price-updated{font-size: 14px;\n color: #6B7280;\n font-weight: 500;\n background: #F3F4F6;\n display: inline-block;\n padding: 4px 12px;\n border-radius: 20px;}","attributes":{"styleAttributes":{"fontSize":["14px"],"color":["#6B7280"],"fontWeight":["500"],"background":["#F3F4F6"],"display":["inline-block"],"padding":["4px 12px"],"borderRadius":["20px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-card-footer","type":"local","label":"clarity-card-footer","localed":false,"css":".clarity-card-footer{padding: 0 24px 32px 24px;}","attributes":{"styleAttributes":{"padding":["0 24px 32px 24px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-pay-btn","type":"local","label":"clarity-pay-btn","localed":false,"css":".clarity-pay-btn{background-color: #111827;\n color: #ffffff;\n width: 100%;\n padding: 18px;\n border: none;\n border-radius: 12px;\n font-size: 14px;\n font-weight: 600;\n letter-spacing: 0.5px;\n cursor: pointer;\n transition: all 0.2s ease;\n position: relative;\n overflow: hidden;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 8px;\n box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.2);}.clarity-pay-btn:hover{background-color: #000000;\n transform: translateY(-2px);}.clarity-pay-btn:active{transform: translateY(0);}","attributes":{"styleAttributes":{"backgroundColor":["#111827"],"color":["#ffffff"],"width":["100%"],"padding":["18px"],"border":["none"],"borderRadius":["12px"],"fontSize":["14px"],"fontWeight":["600"],"letterSpacing":["0.5px"],"cursor":["pointer"],"transition":["all 0.2s ease"],"position":["relative"],"overflow":["hidden"],"display":["flex"],"justifyContent":["center"],"alignItems":["center"],"gap":["8px"],"boxShadow":["0 10px 20px -5px rgba(0, 0, 0, 0.2)"],"backgroundColor_hover":["#000000"],"transform_hover":["translateY(-2px)"],"transform":["translateY(0)"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[{"value":".success","attributes":{"styleAttributes":{"backgroundColor":["#10B981"],"pointerEvents":["none"]}},"css":".clarity-pay-btn.success{background-color: #10B981;\n pointer-events: none;}"}]},{"value":"clarity-spinner","type":"local","label":"clarity-spinner","localed":false,"css":".clarity-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,0.3);border-top:2px solid #ffffff;border-radius:50%;animation:clarityspin 1s linear infinite;display:none;}","attributes":{"styleAttributes":{"width":["16px"],"height":["16px"],"border":["2px solid rgba(255,255,255,0.3)"],"borderTop":["2px solid #ffffff"],"borderRadius":["50%"],"animation":["clarityspin 1s linear infinite"],"display":["none"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-text-column","type":"local","label":"clarity-text-column","localed":false,"css":".clarity-text-column{display:flex;flex-direction:column;align-items:flex-start;}@media (max-width: 575.98px){.clarity-text-column{align-items:stretch;}}.clarity-text-column{flex:1}@media (max-width: 1024px){.clarity-text-column{width: 100%;\n align-items: center;\n text-align: center;}}","attributes":{"styleAttributes":{"display":["flex"],"flexDirection":["column"],"alignItems":["flex-start",null,null,"stretch"],"customCSS_Extra":"{CURRENT}{flex:1}@media (max-width: 1024px){.clarity-text-column{width: 100%;\n align-items: center;\n text-align: center;}}"}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-main-headline","type":"local","label":"clarity-main-headline","localed":false,"css":".clarity-main-headline{font-size:56px;line-height:1.1;font-weight:800;color:transparent;margin-bottom:0px;letter-spacing:-2px;background:linear-gradient(to right, #111827, #4B5563);background-image:linear-gradient(119deg,rgb(34,34,34) 0%,rgb(90,96,125) 39%,rgb(37,31,31) 100%);background-clip:text;margin-top:0px;}","attributes":{"styleAttributes":{"fontSize":["56px"],"lineHeight":["1.1"],"fontWeight":["800"],"color":["transparent"],"marginBottom":["0px"],"letterSpacing":["-2px"],"background":["linear-gradient(to right, #111827, #4B5563)"],"imageGradient_Extra":true,"backgroundImage":["linear-gradient(119deg,rgb(34,34,34) 0%,rgb(90,96,125) 39%,rgb(37,31,31) 100%)"],"backgroundClip":["text"],"marginTop":["0px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-sub-description","type":"local","label":"clarity-sub-description","localed":false,"css":".clarity-sub-description{font-size: 18px;\n line-height: 1.6;\n color: #4B5563;\n margin-bottom: 40px;\n max-width: 520px;}","attributes":{"styleAttributes":{"fontSize":["18px"],"lineHeight":["1.6"],"color":["#4B5563"],"marginBottom":["40px"],"maxWidth":["520px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-cta-container","type":"local","label":"clarity-cta-container","localed":false,"css":".clarity-cta-container{display:inline-block;margin-bottom:40px;}","attributes":{"styleAttributes":{"display":["inline-block"],"marginBottom":["40px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-cta-btn","type":"local","label":"clarity-cta-btn","localed":false,"css":".clarity-cta-btn{background-color: #4361EE;\n color: #ffffff;\n padding: 18px 40px;\n border-radius: 100px;\n font-size: 16px;\n font-weight: 600;\n border: none;\n cursor: pointer;\n transition: transform 0.2s ease, box-shadow 0.2s ease;\n box-shadow: 0 4px 6px -1px rgba(67, 97, 238, 0.2), 0 2px 4px -1px rgba(67, 97, 238, 0.1);\n position: relative;\n overflow: hidden;\n z-index: 1;}.clarity-cta-btn:hover{transform: translateY(-2px);\n box-shadow: 0 15px 25px -5px rgba(67, 97, 238, 0.3);}","attributes":{"styleAttributes":{"backgroundColor":["#4361EE"],"color":["#ffffff"],"padding":["18px 40px"],"borderRadius":["100px"],"fontSize":["16px"],"fontWeight":["600"],"border":["none"],"cursor":["pointer"],"transition":["transform 0.2s ease, box-shadow 0.2s ease"],"boxShadow":["0 4px 6px -1px rgba(67, 97, 238, 0.2), 0 2px 4px -1px rgba(67, 97, 238, 0.1)"],"position":["relative"],"overflow":["hidden"],"zIndex":["1"],"transform_hover":["translateY(-2px)"],"boxShadow_hover":["0 15px 25px -5px rgba(67, 97, 238, 0.3)"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-section-divider","type":"local","label":"clarity-section-divider","localed":false,"css":".clarity-section-divider{width:100%;height:1px;background:linear-gradient(to right, #E5E7EB, transparent);margin-bottom:30px;}","attributes":{"styleAttributes":{"width":["100%"],"height":["1px"],"background":["linear-gradient(to right, #E5E7EB, transparent)"],"marginBottom":["30px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-features-row","type":"local","label":"clarity-features-row","localed":false,"css":".clarity-features-row{display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 40px;\n width: 100%;}@media (max-width: 1024px){.clarity-features-row{text-align: left;}}@media (max-width: 640px){.clarity-features-row{grid-template-columns: 1fr;\n gap: 20px;}}","attributes":{"styleAttributes":{"display":["grid"],"gridTemplateColumns":["1fr 1fr"],"gap":["40px"],"width":["100%"],"customCSS_Extra":"@media (max-width: 1024px){.clarity-features-row{text-align: left;}}@media (max-width: 640px){.clarity-features-row{grid-template-columns: 1fr;\n gap: 20px;}}"}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-feature-block","type":"local","label":"clarity-feature-block","localed":false,"css":".clarity-feature-block{display: flex;\n flex-direction: column;\n align-items: flex-start;}","attributes":{"styleAttributes":{"display":["flex"],"flexDirection":["column"],"alignItems":["flex-start"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-feature-title","type":"local","label":"clarity-feature-title","localed":false,"css":".clarity-feature-title{font-size: 18px;\n font-weight: 700;\n color: #111827;\n margin-bottom: 8px;}","attributes":{"styleAttributes":{"fontSize":["18px"],"fontWeight":["700"],"color":["#111827"],"marginBottom":["8px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-feature-text","type":"local","label":"clarity-feature-text","localed":false,"css":".clarity-feature-text{font-size: 15px;\n line-height: 1.5;\n color: #6B7280;\n margin-bottom: 16px;}","attributes":{"styleAttributes":{"fontSize":["15px"],"lineHeight":["1.5"],"color":["#6B7280"],"marginBottom":["16px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]},{"value":"clarity-feature-link","type":"local","label":"clarity-feature-link","localed":false,"css":".clarity-feature-link{font-size: 14px;\n font-weight: 600;\n color: #4361EE;\n text-decoration: none;\n display: flex;\n align-items: center;\n gap: 4px;\n transition: gap 0.2s ease;}.clarity-feature-link:hover{gap: 8px;}","attributes":{"styleAttributes":{"fontSize":["14px"],"fontWeight":["600"],"color":["#4361EE"],"textDecoration":["none"],"display":["flex"],"alignItems":["center"],"gap":["4px"],"transition":["gap 0.2s ease"],"gap_hover":["8px"]}},"originalID":"gsbp-026b020","originalBlock":"greenshift-blocks/element","selectors":[]}],"metadata":{"name":"Design Control for Calculated Section"},"type":"no","className":"clarity-visual-column clarity-bg-circle c-circle-1 c-circle-2 clarity-blob-background clarity-summary-card clarity-card-header clarity-card-title clarity-status-dot clarity-card-content clarity-price-amount clarity-price-updated clarity-card-footer clarity-pay-btn clarity-spinner clarity-text-column clarity-main-headline clarity-sub-description clarity-cta-container clarity-cta-btn clarity-section-divider clarity-features-row clarity-feature-block clarity-feature-title clarity-feature-text clarity-feature-link","localId":"gsbp-026b020","isVariation":"stylemanager","customCss":"@keyframes clarityspin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }","customJs":"document.addEventListener('DOMContentLoaded', () =\u003e {\n \n // \u002d\u002d- PAYMENT SIMULATION INTERACTION \u002d\u002d-\n const payBtn = document.getElementById('pay-btn');\n const balanceEl = document.getElementById('balance-amount');\n const btnText = payBtn.querySelector('.btn-text');\n const spinner = payBtn.querySelector('.clarity-spinner');\n let currentBalance = 34500;\n\n payBtn.addEventListener('click', () =\u003e {\n if(payBtn.classList.contains('processing') || payBtn.classList.contains('success')) return;\n\n // 1. Loading State\n payBtn.classList.add('processing');\n btnText.textContent = 'Processing...';\n spinner.style.display = 'block';\n \n // Simulate Network Request\n setTimeout(() =\u003e {\n // 2. Success State\n spinner.style.display = 'none';\n payBtn.classList.remove('processing');\n payBtn.classList.add('success');\n btnText.textContent = 'Sent Successfully!';\n \n // 3. Update Balance Animation\n const randomDeduction = Math.floor(Math.random() * 500) + 100;\n const newBalance = currentBalance - randomDeduction;\n \n // Animate number countdown\n const duration = 1000;\n const start = currentBalance;\n const startTime = performance.now();\n\n function animateBalance(currentTime) {\n const elapsed = currentTime - startTime;\n const progress = Math.min(elapsed / duration, 1);\n \n // Ease out quart\n const ease = 1 - Math.pow(1 - progress, 4);\n \n const val = start - (randomDeduction * ease);\n balanceEl.textContent = '$' + val.toLocaleString('en-US', {minimumFractionDigits: 2, maximumFractionDigits: 2});\n\n if (progress \u003c 1) {\n requestAnimationFrame(animateBalance);\n } else {\n currentBalance = newBalance;\n }\n }\n requestAnimationFrame(animateBalance);\n\n // 4. Reset Button after delay\n setTimeout(() =\u003e {\n payBtn.classList.remove('success');\n btnText.textContent = 'Send another payment';\n payBtn.style.backgroundColor = ''; \n }, 3000);\n \n }, 1500);\n });\n });","customJsEnabled":true} -->
<div class="clarity-visual-column clarity-bg-circle c-circle-1 c-circle-2 clarity-blob-background clarity-summary-card clarity-card-header clarity-card-title clarity-status-dot clarity-card-content clarity-price-amount clarity-price-updated clarity-card-footer clarity-pay-btn clarity-spinner clarity-text-column clarity-main-headline clarity-sub-description clarity-cta-container clarity-cta-btn clarity-section-divider clarity-features-row clarity-feature-block clarity-feature-title clarity-feature-text clarity-feature-link"></div>
<!-- /wp:greenshift-blocks/element -->
<!-- wp:paragraph -->
<p></p>
<!-- /wp:paragraph -->Clarity gives you the blocks & components you need to create a truly professional website, landing page or admin panel for your SaaS.
Access a vast library of pre-built components designed to convert it.
Explore Library →Seamlessly transition from design to code with our pixel-perfect Figma kits.
Get the Kit →