.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding-top:5rem;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:-30%;right:-20%;width:60vw;height:60vw;background:radial-gradient(circle,var(--clk-glow) 0%,transparent 70%);pointer-events:none}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;width:100%}.hero-text{position:relative;z-index:1}.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .8rem;border-radius:99px;border:1px solid var(--clk-border);font-size:.75rem;font-weight:500;color:var(--clk-text-muted);margin-bottom:2rem;background:var(--clk-surface)}.hero-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--clk-accent);box-shadow:0 0 8px var(--clk-accent)}h1{font-family:var(--font-display);font-size:clamp(2.8rem,5vw,4.2rem);font-weight:800;line-height:1.05;letter-spacing:-.03em;margin-bottom:1.5rem}h1 em{font-style:normal;color:var(--clk-accent)}.hero-sub{font-size:1.15rem;color:var(--clk-text-2);line-height:1.7;max-width:520px;margin-bottom:2.5rem}.hero-actions{display:flex;gap:1rem;align-items:center}.hero-visual{position:relative;display:flex;align-items:center;justify-content:center}.loop-container{width:100%;max-width:480px;aspect-ratio:1;position:relative}.loop-ring{position:absolute;inset:0;border:1px solid var(--clk-border);border-radius:50%}.loop-ring-glow{position:absolute;inset:-2px;border-radius:50%;border:2px solid transparent;background-image:conic-gradient(from 0deg,var(--clk-accent),var(--clk-cyan),transparent 40%,transparent 60%,var(--clk-accent-dim),var(--clk-accent));background-origin:border-box;background-clip:border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:exclude;mask-composite:exclude;animation:loop-rotate 6s linear infinite}.loop-ring-glow-2{position:absolute;inset:-6px;border-radius:50%;border:4px solid transparent;background-image:conic-gradient(from 180deg,rgba(16,185,129,.3),rgba(6,182,212,.2),transparent 30%,transparent 70%,rgba(16,185,129,.15),rgba(6,182,212,.3));background-origin:border-box;background-clip:border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:exclude;mask-composite:exclude;animation:loop-rotate-reverse 10s linear infinite;filter:blur(3px)}.loop-ring-ambient{position:absolute;inset:-20px;border-radius:50%;background:conic-gradient(from 90deg,rgba(16,185,129,.06),transparent 25%,rgba(6,182,212,.04),transparent 50%,rgba(16,185,129,.06),transparent 75%);animation:loop-rotate 15s linear infinite;filter:blur(20px)}@keyframes loop-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loop-rotate-reverse{0%{transform:rotate(360deg)}to{transform:rotate(0)}}.loop-dot-track{position:absolute;inset:0;animation:loop-rotate 6s linear infinite}.loop-dot-track:nth-child(2){animation-delay:-1.5s}.loop-dot-track:nth-child(3){animation-delay:-3s}.loop-dot-track:nth-child(4){animation-delay:-4.5s}.loop-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--clk-accent);box-shadow:0 0 12px var(--clk-accent),0 0 4px var(--clk-accent);top:-3px;left:50%;transform:translate(-50%)}.loop-dot-track:nth-child(2) .loop-dot{background:var(--clk-cyan);box-shadow:0 0 12px var(--clk-cyan),0 0 4px var(--clk-cyan);width:4px;height:4px;top:-2px}.loop-dot-track:nth-child(3) .loop-dot{width:5px;height:5px;top:-2.5px;opacity:.7}.loop-dot-track:nth-child(4) .loop-dot{background:var(--clk-cyan);box-shadow:0 0 10px var(--clk-cyan);width:3px;height:3px;top:-1.5px;opacity:.5}.arrow-path{stroke-dasharray:6 8;animation:dash-flow 2s linear infinite}@keyframes dash-flow{to{stroke-dashoffset:-28}}@keyframes node-pulse{0%,to{border-color:var(--clk-border);background:var(--clk-surface);box-shadow:none;transform:scale(1)}20%,30%{border-color:var(--clk-accent);background:linear-gradient(135deg,#10b9812e,#06b6d41f);box-shadow:0 0 32px #10b9818c,0 0 12px #06b6d466,inset 0 0 8px #10b98126;transform:scale(1.08)}}@keyframes node-icon-flash{0%,to{color:var(--clk-accent);filter:drop-shadow(0 0 0 transparent)}20%,30%{color:#fff;filter:drop-shadow(0 0 6px rgba(16,185,129,.9))}}@keyframes node-label-flash{0%,to{color:var(--clk-text-muted)}20%,30%{color:var(--clk-accent)}}.loop-node .loop-node-icon{animation:node-pulse 6s ease-in-out infinite;transition:none}.loop-node .loop-node-icon svg{animation:node-icon-flash 6s ease-in-out infinite}.loop-node .loop-node-label{animation:node-label-flash 6s ease-in-out infinite}.loop-node.top .loop-node-icon,.loop-node.top .loop-node-icon svg,.loop-node.top .loop-node-label{animation-delay:0s}.loop-node.right .loop-node-icon,.loop-node.right .loop-node-icon svg,.loop-node.right .loop-node-label{animation-delay:-4.5s}.loop-node.bottom .loop-node-icon,.loop-node.bottom .loop-node-icon svg,.loop-node.bottom .loop-node-label{animation-delay:-3s}.loop-node.left .loop-node-icon,.loop-node.left .loop-node-icon svg,.loop-node.left .loop-node-label{animation-delay:-1.5s}@keyframes center-breathe{0%,to{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}}.loop-center{animation:center-breathe 4s ease-in-out infinite}.loop-node{position:absolute;width:120px;text-align:center;transform:translate(-50%,-50%)}.loop-node-icon{width:48px;height:48px;border-radius:12px;background:var(--clk-surface);border:1px solid var(--clk-border);display:flex;align-items:center;justify-content:center;margin:0 auto .5rem;font-size:1.2rem;color:var(--clk-accent);transition:border-color .3s,box-shadow .3s}.loop-node:hover .loop-node-icon{border-color:var(--clk-accent);box-shadow:0 0 20px var(--clk-glow)}.loop-node-label{font-family:var(--font-mono);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--clk-text-muted)}.loop-node-sub{font-size:.65rem;color:var(--clk-text-muted);opacity:.6;margin-top:.15rem}.loop-node.top{top:0%;left:50%}.loop-node.right{top:50%;left:100%}.loop-node.bottom{top:100%;left:50%}.loop-node.left{top:50%;left:0%}.loop-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.loop-center-label{font-family:var(--font-mono);font-size:.65rem;font-weight:600;color:var(--clk-accent);text-transform:uppercase;letter-spacing:.1em}.loop-center-sub{font-size:.55rem;color:var(--clk-text-muted);margin-top:.25rem}.loop-arrows{position:absolute;inset:0}.loop-arrows svg{position:absolute;inset:0;width:100%;height:100%}.problem{padding:8rem 0;border-top:1px solid var(--clk-border)}.problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}.problem-text{color:var(--clk-text-2);font-size:1.05rem;line-height:1.8}.problem-tools{display:flex;flex-direction:column;gap:1rem}.tool-row{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--clk-surface);border:1px solid var(--clk-border);border-radius:10px;transition:border-color .2s}.tool-row:hover{border-color:var(--clk-accent)}.tool-name{font-family:var(--font-mono);font-size:.8rem;font-weight:600;min-width:100px}.tool-what{font-size:.8rem;color:var(--clk-text-muted)}.tool-arrow{margin-left:auto;color:var(--clk-text-muted);font-size:.75rem}.tool-row.clkam{border-color:var(--clk-accent);background:linear-gradient(135deg,#10b9810d,#06b6d408)}.tool-row.clkam .tool-name,.tool-row.clkam .tool-arrow{color:var(--clk-accent)}.pillars{padding:8rem 0;border-top:1px solid var(--clk-border)}.pillars-header{text-align:center;max-width:700px;margin:0 auto 5rem}.pillar-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}.pillar-card{padding:2rem 1.5rem;background:var(--clk-surface);border:1px solid var(--clk-border);border-radius:16px;position:relative;overflow:hidden;transition:border-color .3s,transform .2s}.pillar-card:hover{border-color:var(--clk-accent);transform:translateY(-2px)}.pillar-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--clk-accent),var(--clk-cyan));opacity:0;transition:opacity .3s}.pillar-card:hover:before{opacity:1}.pillar-number{font-family:var(--font-mono);font-size:.65rem;font-weight:600;color:var(--clk-text-muted);margin-bottom:1.25rem;text-transform:uppercase;letter-spacing:.1em}.pillar-icon{width:44px;height:44px;border-radius:10px;background:var(--clk-glow);display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem;color:var(--clk-accent)}.pillar-title{font-family:var(--font-display);font-size:1.3rem;font-weight:700;margin-bottom:.75rem}.pillar-desc{font-size:.85rem;color:var(--clk-text-2);line-height:1.7;margin-bottom:1.25rem}.pillar-features{list-style:none;display:flex;flex-direction:column;gap:.4rem}.pillar-features li{font-family:var(--font-mono);font-size:.7rem;color:var(--clk-text-muted);padding-left:1rem;position:relative}.pillar-features li:before{content:"";position:absolute;left:0;top:.45em;width:4px;height:4px;border-radius:50%;background:var(--clk-accent)}.products{padding:8rem 0;border-top:1px solid var(--clk-border)}.products-header{text-align:center;max-width:600px;margin:0 auto 4rem}.product-cards{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.product-card{padding:2.5rem;background:var(--clk-surface);border:1px solid var(--clk-border);border-radius:20px;position:relative}.product-badge{font-family:var(--font-mono);font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--clk-accent);margin-bottom:1rem}.product-name{font-family:var(--font-display);font-size:1.8rem;font-weight:800;margin-bottom:.5rem}.product-desc{color:var(--clk-text-2);font-size:.95rem;line-height:1.7;margin-bottom:2rem}.product-price{display:flex;align-items:baseline;gap:.25rem;margin-bottom:.25rem}.product-price .from{font-size:.8rem;color:var(--clk-text-muted)}.product-price .amount{font-family:var(--font-display);font-size:2.2rem;font-weight:800}.product-price .period{font-size:.85rem;color:var(--clk-text-muted)}.product-free{font-size:.8rem;color:var(--clk-text-muted);margin-bottom:2rem}.product-features{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:2rem}.product-features li{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--clk-text-2)}.product-features li svg{flex-shrink:0;color:var(--clk-accent)}.product-cta{display:block;width:100%;text-align:center;padding:.85rem;border-radius:10px;font-family:var(--font-body);font-size:.9rem;font-weight:600;text-decoration:none;transition:filter .2s,transform .1s}.product-cta:active{transform:scale(.98)}.product-cta.primary{background:var(--clk-amber);color:#0c0c0f;border:none}.product-cta.primary:hover{filter:brightness(1.1)}.product-cta.secondary{background:transparent;color:var(--clk-text);border:1px solid var(--clk-border)}.product-cta.secondary:hover{border-color:var(--clk-accent);color:var(--clk-accent)}.code-section{padding:6rem 0;border-top:1px solid var(--clk-border)}.code-section .container{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.code-block{background:var(--clk-surface);border:1px solid var(--clk-border);border-radius:12px;overflow:hidden}.code-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-bottom:1px solid var(--clk-border);font-family:var(--font-mono);font-size:.7rem;color:var(--clk-text-muted)}.code-dot{width:8px;height:8px;border-radius:50%}.code-dot.r{background:#ef4444}.code-dot.y{background:#eab308}.code-dot.g{background:#22c55e}.code-body{padding:1.25rem;font-family:var(--font-mono);font-size:.8rem;line-height:1.7;color:var(--clk-text-2);overflow-x:auto}.code-body .comment{color:var(--clk-text-muted)}.code-body .cmd{color:var(--clk-accent)}.code-body .str{color:var(--clk-amber)}.code-body .key{color:var(--clk-cyan)}.comparison{padding:8rem 0;border-top:1px solid var(--clk-border)}.comparison-header{text-align:center;max-width:600px;margin:0 auto 4rem}.comparison-table{width:100%;border-collapse:collapse;font-size:.85rem}.comparison-table th{font-family:var(--font-mono);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--clk-text-muted);text-align:center;padding:1rem;border-bottom:1px solid var(--clk-border)}.comparison-table th:first-child{text-align:left}.comparison-table th.highlight{color:var(--clk-accent)}.comparison-table td{padding:.85rem 1rem;text-align:center;border-bottom:1px solid var(--clk-border);color:var(--clk-text-2)}.comparison-table td:first-child{text-align:left;font-weight:500;color:var(--clk-text)}.comparison-table tr:last-child td{border-bottom:none}.check{color:var(--clk-accent);font-weight:700}.cross{color:var(--clk-text-muted)}.partial{color:var(--clk-amber)}.comparison-caption{caption-side:top;text-align:left;font-size:.8rem;color:var(--clk-text-2);padding:0 0 1rem;line-height:1.6}.comparison-summary{font-size:.8rem;font-style:italic;color:var(--clk-text-muted);text-align:left;padding:1rem;border-top:1px solid var(--clk-border);line-height:1.6}.final-cta{padding:10rem 0;text-align:center;position:relative}.final-cta:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50vw;height:50vw;background:radial-gradient(circle,var(--clk-glow) 0%,transparent 60%);pointer-events:none}.final-cta h2{position:relative;z-index:1;margin-bottom:1rem}.final-cta .sub{color:var(--clk-text-2);font-size:1.1rem;margin-bottom:3rem;position:relative;z-index:1}.final-cta .hero-actions{justify-content:center;position:relative;z-index:1}.platform-note{text-align:center;padding:3rem 0;margin-top:2rem}.platform-pill{display:inline-flex;align-items:center;gap:.75rem;padding:.6rem 1.5rem;border-radius:99px;border:1px solid rgba(16,185,129,.2);background:linear-gradient(135deg,#10b9810d,#06b6d408);font-size:.8rem;color:var(--clk-text-2)}.platform-pill strong{color:var(--clk-accent);font-weight:600}@media(prefers-reduced-motion:reduce){.loop-ring-glow,.loop-ring-glow-2,.loop-ring-ambient,.loop-dot,.loop-center,.loop-node .loop-node-icon,.arrow-path{animation:none}}@media(max-width:1024px){.pillar-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.hero-grid{grid-template-columns:1fr;gap:3rem;text-align:center}.hero-sub{margin-left:auto;margin-right:auto}.hero-actions{justify-content:center}.hero-visual{order:-1}.loop-container{max-width:320px}.problem-grid,.pillar-cards,.product-cards,.code-section .container{grid-template-columns:1fr}.comparison-table{font-size:.75rem}}
