primocode 9.8.0-beta.8 → 9.8.0-beta.9

package/kits/landing/script.js

@@ -1,199 +0,0 @@
-(function(){
-  var d=document, root=d.documentElement;
-  root.classList.add('js');
-  var reduce=matchMedia('(prefers-reduced-motion: reduce)').matches;
-  var fine=matchMedia('(hover: hover) and (pointer: fine)').matches;
-
-  // Título que sobe palavra por palavra
-  d.querySelectorAll('.split').forEach(function(el){
-    var i=0;
-    function wrap(content){
-      var w=d.createElement('span'); w.className='w';
-      var s=d.createElement('span'); s.style.setProperty('--i',i++);
-      s.appendChild(content); w.appendChild(s); return w;
-    }
-    Array.from(el.childNodes).forEach(function(n){
-      if(n.nodeType===3){
-        var frag=d.createDocumentFragment();
-        n.textContent.split(/(\s+)/).forEach(function(part){
-          if(!part) return;
-          if(/^\s+$/.test(part)){ frag.appendChild(d.createTextNode(' ')); return; }
-          frag.appendChild(wrap(d.createTextNode(part)));
-        });
-        n.replaceWith(frag);
-      } else if(n.nodeType===1){
-        var holder=d.createElement('span');
-        n.replaceWith(holder);
-        holder.replaceWith(wrap(n));
-      }
-    });
-  });
-
-  // Aparecer ao rolar
-  var io=new IntersectionObserver(function(es){
-    es.forEach(function(e){
-      if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target); }
-    });
-  },{threshold:.15,rootMargin:'0px 0px -8% 0px'});
-  d.querySelectorAll('.reveal').forEach(function(el){ io.observe(el); });
-
-  // Contadores
-  function count(el){
-    var to=+el.dataset.count, t0=null, dur=1600;
-    if(reduce){ el.textContent=to; return; }
-    function step(t){
-      if(!t0) t0=t;
-      var p=Math.min((t-t0)/dur,1);
-      el.textContent=Math.round(to*(1-Math.pow(1-p,3)));
-      if(p<1) requestAnimationFrame(step);
-    }
-    requestAnimationFrame(step);
-  }
-  var co=new IntersectionObserver(function(es){
-    es.forEach(function(e){
-      if(e.isIntersecting){ setTimeout(function(){ count(e.target); },400); co.unobserve(e.target); }
-    });
-  },{threshold:.5});
-  d.querySelectorAll('[data-count]').forEach(function(el){ co.observe(el); });
-
-  // Barra de progresso e nav que encolhe e se esconde
-  var nav=d.getElementById('nav'), bar=d.getElementById('progress'), last=0, ticking=false;
-  function onScroll(){
-    var y=scrollY, h=root.scrollHeight-innerHeight;
-    bar.style.setProperty('--p',h>0?y/h:0);
-    nav.classList.toggle('scrolled',y>40);
-    nav.classList.toggle('hidden',y>last&&y>500);
-    last=y; ticking=false;
-  }
-  addEventListener('scroll',function(){
-    if(!ticking){ ticking=true; requestAnimationFrame(onScroll); }
-  },{passive:true});
-  onScroll();
-
-  // Brilho que segue o cursor
-  var glow=d.getElementById('glow');
-  if(fine&&!reduce&&glow){
-    var gx=innerWidth/2, gy=innerHeight/2, tx=gx, ty=gy;
-    addEventListener('mousemove',function(e){ tx=e.clientX; ty=e.clientY; });
-    (function loop(){
-      gx+=(tx-gx)*.12; gy+=(ty-gy)*.12;
-      glow.style.setProperty('--gx',gx+'px');
-      glow.style.setProperty('--gy',gy+'px');
-      requestAnimationFrame(loop);
-    })();
-  }
-
-  // Botões magnéticos
-  if(fine&&!reduce){
-    d.querySelectorAll('.magnetic').forEach(function(b){
-      var s=b.querySelector('span');
-      b.addEventListener('mousemove',function(e){
-        var r=b.getBoundingClientRect(), x=e.clientX-r.left-r.width/2, y=e.clientY-r.top-r.height/2;
-        b.style.transform='translate('+x*.25+'px,'+y*.35+'px)';
-        if(s) s.style.transform='translate('+x*.12+'px,'+y*.18+'px)';
-      });
-      b.addEventListener('mouseleave',function(){
-        b.style.transform='';
-        if(s) s.style.transform='';
-      });
-    });
-  }
-
-  // Cards com inclinação 3D e luz que segue o mouse
-  d.querySelectorAll('.tilt').forEach(function(c){
-    c.addEventListener('mouseenter',function(){
-      c.style.transition='transform .15s ease-out,box-shadow .4s,opacity .9s,filter .9s';
-    });
-    c.addEventListener('mousemove',function(e){
-      var r=c.getBoundingClientRect(), px=(e.clientX-r.left)/r.width, py=(e.clientY-r.top)/r.height;
-      c.style.setProperty('--mx',px*100+'%');
-      c.style.setProperty('--my',py*100+'%');
-      if(fine&&!reduce){
-        c.style.setProperty('--ry',((px-.5)*14)+'deg');
-        c.style.setProperty('--rx',((.5-py)*14)+'deg');
-      }
-    });
-    c.addEventListener('mouseleave',function(){
-      c.style.transition='transform .7s cubic-bezier(.2,.8,.2,1),box-shadow .4s,opacity .9s,filter .9s';
-      c.style.setProperty('--rx','0deg');
-      c.style.setProperty('--ry','0deg');
-    });
-  });
-
-  // Órbita: um ponto por produto no ar
-  var od=d.getElementById('orbitDots');
-  if(od){
-    var colors=['var(--cyan)','var(--orange)','#ffffff','#6f8cff'], rings=[.30,.42,.54], dots=[];
-    for(var k=0;k<9;k++){
-      var dot=d.createElement('i');
-      dot.style.setProperty('--a',(k*40+(k%3)*13)+'deg');
-      dot.style.setProperty('--c',colors[k%4]);
-      dot.dataset.f=rings[k%3];
-      od.appendChild(dot); dots.push(dot);
-    }
-    var sizeDots=function(){
-      var w=od.offsetWidth;
-      dots.forEach(function(i){ i.style.setProperty('--r',(w*i.dataset.f)+'px'); });
-    };
-    sizeDots();
-    addEventListener('resize',sizeDots);
-  }
-
-  // Rede de partículas no hero
-  var cv=d.getElementById('net');
-  if(cv&&cv.getContext){
-    var ctx=cv.getContext('2d'), hero=cv.parentElement, W=0, H=0, pts=[], mouse={x:-9999,y:-9999}, visible=true, raf=0;
-    var resize=function(){
-      var dpr=Math.min(devicePixelRatio||1,2);
-      W=hero.offsetWidth; H=hero.offsetHeight;
-      cv.width=W*dpr; cv.height=H*dpr;
-      ctx.setTransform(dpr,0,0,dpr,0,0);
-      var n=Math.round(Math.min(90,W*H/16000));
-      pts=[];
-      for(var k=0;k<n;k++) pts.push({x:Math.random()*W,y:Math.random()*H,vx:(Math.random()-.5)*.35,vy:(Math.random()-.5)*.35,r:Math.random()*1.6+.6});
-    };
-    hero.addEventListener('mousemove',function(e){
-      var r=cv.getBoundingClientRect(); mouse.x=e.clientX-r.left; mouse.y=e.clientY-r.top;
-    });
-    hero.addEventListener('mouseleave',function(){ mouse.x=mouse.y=-9999; });
-    var frame=function(){
-      ctx.clearRect(0,0,W,H);
-      var i,j,p,q,dx,dy,dist;
-      for(i=0;i<pts.length;i++){
-        p=pts[i];
-        p.x+=p.vx; p.y+=p.vy;
-        if(p.x<0||p.x>W) p.vx*=-1;
-        if(p.y<0||p.y>H) p.vy*=-1;
-        dx=p.x-mouse.x; dy=p.y-mouse.y; dist=Math.sqrt(dx*dx+dy*dy)||1;
-        if(dist<150){
-          var f=(1-dist/150)*1.2;
-          p.x+=dx/dist*f; p.y+=dy/dist*f;
-          ctx.strokeStyle='rgba(249,115,22,'+((1-dist/150)*.5)+')';
-          ctx.lineWidth=1;
-          ctx.beginPath(); ctx.moveTo(p.x,p.y); ctx.lineTo(mouse.x,mouse.y); ctx.stroke();
-        }
-        for(j=i+1;j<pts.length;j++){
-          q=pts[j]; dx=p.x-q.x; dy=p.y-q.y;
-          var dd=dx*dx+dy*dy;
-          if(dd<16900){
-            ctx.strokeStyle='rgba(31,180,207,'+((1-Math.sqrt(dd)/130)*.3)+')';
-            ctx.lineWidth=.8;
-            ctx.beginPath(); ctx.moveTo(p.x,p.y); ctx.lineTo(q.x,q.y); ctx.stroke();
-          }
-        }
-        ctx.fillStyle='rgba(255,255,255,.75)';
-        ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2); ctx.fill();
-      }
-      if(visible&&!reduce) raf=requestAnimationFrame(frame);
-    };
-    new IntersectionObserver(function(es){
-      visible=es[0].isIntersecting;
-      cancelAnimationFrame(raf);
-      if(visible) raf=requestAnimationFrame(frame);
-    }).observe(hero);
-    var rt;
-    addEventListener('resize',function(){ clearTimeout(rt); rt=setTimeout(function(){ resize(); if(reduce) frame(); },150); });
-    resize();
-    if(reduce) frame();
-  }
-})();

package/kits/landing/style.css

@@ -1,219 +0,0 @@
-:root{
-  /* ── AS CORES DA MARCA ─────────────────────────────────────────────
-     Para mudar a cara da página inteira, troque SÓ estas três (e as
-     versões "-deep", um tom mais escuro de cada):
-       --blue    a cor principal (fundo do topo, faixas)
-       --orange  o destaque (botões, palavras em itálico)
-       --cyan    a cor de apoio (detalhes, brilhos)
-     O resto do arquivo usa estas variáveis — não precisa mexer nele. */
-  --ink:#0b0b12;
-  --ink-2:#12121a;
-  --muted:#9ca3af;
-  --paper:#ffffff;
-  --soft:#f4f5f8;
-  --blue:#1e3fae;
-  --blue-deep:#0f2470;
-  --orange:#f97316;
-  --orange-deep:#b4470a;
-  --cyan:#1fb4cf;
-  --cyan-deep:#0b6f85;
-  --orange-light:#ffb36b;
-  --sans:'Instrument Sans',system-ui,-apple-system,sans-serif;
-  --serif:'Instrument Serif',Georgia,serif;
-  --radius:18px;
-  --ease:cubic-bezier(.2,.8,.2,1);
-}
-*{margin:0;padding:0;box-sizing:border-box;}
-html{scroll-behavior:smooth;}
-body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
-img{display:block;}
-a{color:inherit;}
-h1,h2,h3{line-height:1.08;letter-spacing:-0.025em;font-weight:600;}
-h1 em,h2 em{font-family:var(--serif);font-style:italic;font-weight:400;}
-::selection{background:var(--orange);color:#fff;}
-
-/* Barra de progresso e brilho do cursor */
-.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--cyan),var(--blue),var(--orange));z-index:100;}
-.cursor-glow{position:fixed;top:0;left:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(249,115,22,.16),rgba(31,180,207,.08) 40%,transparent 70%);transform:translate3d(var(--gx,-999px),var(--gy,-999px),0);transition:opacity .4s;mix-blend-mode:screen;}
-
-/* Nav */
-.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 5vw;color:#fff;transition:padding .35s var(--ease),background .35s,backdrop-filter .35s,box-shadow .35s;}
-.nav.scrolled{padding:12px 5vw;background:rgba(11,11,18,.72);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 1px 0 rgba(255,255,255,.06);}
-.nav.hidden{transform:translateY(-100%);}
-.nav{transition:transform .4s var(--ease),padding .35s var(--ease),background .35s;}
-.brand{display:flex;align-items:center;gap:10px;font-weight:600;text-decoration:none;}
-.brand img{transition:transform .6s var(--ease);}
-.brand:hover img{transform:rotate(180deg) scale(1.1);}
-.nav-links{display:flex;align-items:center;gap:28px;}
-.nav-links a:not(.btn){position:relative;text-decoration:none;font-size:.95rem;opacity:.8;transition:opacity .2s;}
-.nav-links a:not(.btn)::after{content:'';position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease);}
-.nav-links a:not(.btn):hover{opacity:1;}
-.nav-links a:not(.btn):hover::after{transform:scaleX(1);transform-origin:left;}
-
-/* Botões */
-.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;padding:15px 28px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--orange),var(--orange-deep));color:#fff;font:600 1rem var(--sans);text-decoration:none;cursor:pointer;isolation:isolate;transition:box-shadow .3s,transform .25s var(--ease);will-change:transform;}
-.btn span{position:relative;z-index:2;display:inline-block;transition:transform .25s var(--ease);}
-.btn::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease);}
-.btn:hover::before{transform:translateX(120%);}
-.btn:hover{box-shadow:0 14px 34px -8px rgba(249,115,22,.6);}
-.btn:active{transform:scale(.97);}
-.btn-small{padding:9px 18px;font-size:.9rem;}
-.btn-ghost{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(6px);}
-.btn-ghost:hover{box-shadow:0 0 0 1px rgba(255,255,255,.6),0 14px 34px -10px rgba(31,180,207,.5);background:rgba(255,255,255,.1);}
-
-/* Hero */
-.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:140px 5vw 110px;overflow:hidden;background:var(--ink);color:#fff;text-align:center;}
-.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.7;}
-.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;z-index:0;animation:float 18s ease-in-out infinite;}
-.b1{width:560px;height:560px;left:-140px;top:-160px;background:var(--blue);}
-.b2{width:440px;height:440px;right:-120px;top:18%;background:var(--cyan);opacity:.35;animation-delay:-6s;animation-duration:22s;}
-.b3{width:380px;height:380px;left:38%;bottom:-220px;background:var(--orange);opacity:.3;animation-delay:-11s;animation-duration:26s;}
-@keyframes float{0%,100%{transform:translate(0,0) scale(1);}33%{transform:translate(60px,40px) scale(1.12);}66%{transform:translate(-40px,70px) scale(.92);}}
-.hero::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);}
-.hero-inner{position:relative;z-index:2;}
-.eyebrow{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;font-weight:600;color:var(--cyan);margin-bottom:22px;}
-.hero .eyebrow{padding:8px 16px;border:1px solid rgba(31,180,207,.35);border-radius:999px;background:rgba(31,180,207,.08);}
-.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 rgba(31,180,207,.7);animation:pulse 2s infinite;}
-@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(31,180,207,0);}100%{box-shadow:0 0 0 0 rgba(31,180,207,0);}}
-.hero h1{font-size:clamp(2.8rem,8vw,6.6rem);max-width:13ch;margin:0 auto 26px;}
-.hero h1 em,.section h2 em{background:linear-gradient(100deg,var(--orange),var(--orange-light) 30%,var(--cyan) 60%,var(--orange) 90%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 7s linear infinite;padding-right:.08em;}
-@keyframes shimmer{to{background-position:-250% 0;}}
-.lead{font-size:clamp(1.1rem,2vw,1.35rem);color:#c9cdd6;max-width:40ch;margin:0 auto 40px;}
-.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
-.stats{display:flex;justify-content:center;gap:clamp(32px,7vw,88px);flex-wrap:wrap;margin-top:80px;padding-top:40px;border-top:1px solid rgba(255,255,255,.1);}
-.stats dt{font-family:var(--serif);font-size:clamp(2.6rem,5vw,3.6rem);line-height:1;}
-.stats dd{color:var(--muted);font-size:.95rem;margin-top:8px;}
-.scroll-hint{position:absolute;left:50%;bottom:28px;z-index:2;width:26px;height:42px;margin-left:-13px;border:2px solid rgba(255,255,255,.35);border-radius:14px;}
-.scroll-hint span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:wheel 1.8s var(--ease) infinite;}
-@keyframes wheel{0%{opacity:0;transform:translateY(0);}30%{opacity:1;}100%{opacity:0;transform:translateY(14px);}}
-
-/* Título que sobe palavra por palavra */
-.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;}
-.split .w>span{display:inline-block;}
-.js .split .w>span{transform:translateY(110%) rotate(4deg);animation:rise 1s var(--ease) forwards;animation-delay:calc(.15s + var(--i) * .09s);}
-@keyframes rise{to{transform:translateY(0) rotate(0);}}
-
-/* Aparecer ao rolar */
-.js .reveal{opacity:0;transform:translateY(40px);filter:blur(6px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease);transition-delay:var(--d,0s);}
-.js .reveal.in{opacity:1;transform:none;filter:none;}
-
-/* Faixa que corre */
-.marquee{overflow:hidden;background:var(--orange);color:#fff;padding:18px 0;transform:rotate(-1.5deg) scale(1.04);margin:-24px 0;position:relative;z-index:3;box-shadow:0 20px 40px -20px rgba(249,115,22,.6);}
-.marquee-track{display:flex;gap:36px;width:max-content;align-items:center;animation:marquee 26s linear infinite;font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,3vw,2.2rem);white-space:nowrap;}
-.marquee-track i{font-style:normal;font-size:1rem;opacity:.7;}
-.marquee:hover .marquee-track{animation-play-state:paused;}
-@keyframes marquee{to{transform:translateX(-50%);}}
-
-/* Seções */
-.section{position:relative;padding:130px 5vw;}
-.section h2{font-size:clamp(2.2rem,5vw,3.8rem);max-width:18ch;margin-bottom:56px;}
-.section-lead{font-size:1.15rem;color:var(--muted);margin:-32px 0 36px;max-width:42ch;}
-.section-dark{background:var(--ink-2);color:#fff;overflow:hidden;}
-.section-dark::before{content:'';position:absolute;width:700px;height:700px;right:-200px;top:-200px;border-radius:50%;background:radial-gradient(circle,rgba(30,63,174,.45),transparent 65%);}
-
-/* Cards com inclinação 3D */
-.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:24px;perspective:1200px;}
-.card{position:relative;background:var(--soft);border-radius:var(--radius);padding:38px 34px;overflow:hidden;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease),box-shadow .4s;}
-.js .card.reveal.in{transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));}
-.card::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),rgba(249,115,22,.18),transparent 45%);opacity:0;transition:opacity .4s;}
-.card::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),var(--orange),transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s;}
-.card:hover{box-shadow:0 30px 60px -25px rgba(18,18,24,.35);}
-.card:hover::before,.card:hover::after{opacity:1;}
-.card>*{position:relative;transform:translateZ(30px);}
-.card h3{font-size:1.45rem;margin:22px 0 12px;}
-.card p{color:#4b5160;}
-.card-tag{display:inline-block;padding:5px 14px;border-radius:999px;font-size:.8rem;font-weight:600;color:#fff;}
-.tag-blue{background:linear-gradient(135deg,var(--blue),var(--blue-deep));}
-.tag-orange{background:linear-gradient(135deg,var(--orange),var(--orange-deep));}
-.tag-cyan{background:linear-gradient(135deg,var(--cyan),var(--cyan-deep));}
-
-/* Produtos: órbita */
-.products{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
-.orbit{position:relative;width:min(440px,80vw);aspect-ratio:1;margin:0 auto;}
-.orbit-core{position:absolute;inset:32%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 30%,var(--orange),var(--orange-deep));box-shadow:0 0 80px rgba(249,115,22,.55),inset 0 -10px 30px rgba(0,0,0,.25);animation:breathe 4s ease-in-out infinite;z-index:2;}
-.orbit-core strong{font-family:var(--serif);font-size:clamp(3rem,7vw,4.4rem);font-weight:400;line-height:1;}
-.orbit-core small{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;opacity:.9;}
-@keyframes breathe{50%{transform:scale(1.06);box-shadow:0 0 120px rgba(249,115,22,.7),inset 0 -10px 30px rgba(0,0,0,.25);}}
-.ring{position:absolute;border-radius:50%;border:1px dashed rgba(255,255,255,.18);}
-.r1{inset:20%;animation:spin 30s linear infinite;}
-.r2{inset:8%;border-style:solid;border-color:rgba(31,180,207,.22);animation:spin 45s linear infinite reverse;}
-.r3{inset:-4%;animation:spin 70s linear infinite;}
-@keyframes spin{to{transform:rotate(360deg);}}
-.orbit-dots{position:absolute;inset:0;animation:spin 40s linear infinite;}
-.orbit-dots i{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px;border-radius:50%;background:var(--c,var(--cyan));box-shadow:0 0 18px var(--c,var(--cyan));transform:rotate(var(--a)) translateX(var(--r)) rotate(calc(var(--a) * -1));}
-
-/* Imersão */
-.split-box{position:relative;display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;padding:64px;border-radius:28px;background:var(--soft);overflow:hidden;isolation:isolate;}
-.split-box::before{content:'';position:absolute;inset:-2px;z-index:-2;border-radius:inherit;background:conic-gradient(from var(--ang,0deg),var(--blue),var(--cyan),var(--orange),var(--blue));animation:rotateAng 6s linear infinite;}
-.split-box::after{content:'';position:absolute;inset:2px;z-index:-1;border-radius:26px;background:var(--soft);}
-@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false;}
-@keyframes rotateAng{to{--ang:360deg;}}
-.split-box h2{font-size:clamp(1.9rem,4vw,3rem);margin-bottom:16px;}
-.split-box p{max-width:52ch;color:#4b5160;}
-.split-box .eyebrow{color:var(--orange-deep);}
-.days{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap;}
-.days span{padding:8px 18px;border-radius:999px;background:#fff;border:1px solid #e3e5ec;font-weight:600;font-size:.9rem;transition:transform .3s var(--ease),background .3s,color .3s;}
-.days span:hover{transform:translateY(-4px);background:var(--ink);color:#fff;}
-.split-box.in .days span{animation:pop .6s var(--ease) backwards;}
-.split-box.in .days span:nth-child(2){animation-delay:.12s;}
-.split-box.in .days span:nth-child(3){animation-delay:.24s;}
-@keyframes pop{from{opacity:0;transform:scale(.6) translateY(10px);}}
-
-/* Newsletter */
-.section-accent{background:linear-gradient(135deg,var(--blue),var(--blue-deep));color:#fff;text-align:center;overflow:hidden;}
-.section-accent h2{margin:0 auto 12px;position:relative;}
-.section-accent p{position:relative;color:#c9d3f5;font-size:1.2rem;}
-.section-accent h2 em{background:none;color:var(--orange-light);-webkit-text-fill-color:var(--orange-light);animation:none;}
-.accent-grid{position:absolute;inset:-50%;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:48px 48px;transform:perspective(600px) rotateX(60deg);animation:gridMove 3s linear infinite;mask-image:linear-gradient(transparent,#000 60%);-webkit-mask-image:linear-gradient(transparent,#000 60%);}
-@keyframes gridMove{to{background-position:0 48px;}}
-.news{position:relative;display:grid;grid-template-columns:7fr 5fr;gap:64px;align-items:start;text-align:left;max-width:1200px;margin:0 auto;}
-.section-accent .news h2{margin:0 0 16px;max-width:16ch;text-wrap:balance;}
-.section-accent .news-lead{font-size:1.15rem;line-height:1.6;max-width:44ch;margin:0;}
-.news-list{list-style:none;padding:0;margin:44px 0 0;display:grid;gap:26px;}
-.news-list li{display:flex;gap:20px;align-items:flex-start;}
-.news-num{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.05rem;color:var(--orange-light);min-width:2.4em;padding-top:2px;letter-spacing:.04em;}
-.news-list strong{display:block;font-size:1.15rem;color:#fff;}
-.section-accent .news-list p{font-size:1rem;line-height:1.55;margin:4px 0 0;max-width:40ch;}
-.news-form{position:relative;max-width:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:32px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 1px 2px rgba(0,0,0,.08),0 18px 40px rgba(5,12,40,.35);}
-.section-accent .news-form-title{color:#fff;font-weight:600;font-size:1.25rem;margin:0 0 4px;}
-.btn-light{background:#fff;color:var(--blue-deep);}
-.btn-light:hover{background:var(--orange-light);color:var(--ink);}
-.section-accent .news-note{font-size:.9rem;margin:0;color:#c9d3f5;}
-.section-accent .news-form .form-ok{font-size:1rem;color:#fff;margin:0;}
-@media (max-width:860px){.news{grid-template-columns:1fr;gap:40px;}.news-form{padding:24px;}}
-
-/* Formulário */
-#contato{background:var(--soft);}
-form{max-width:620px;display:flex;flex-direction:column;gap:16px;}
-.field{position:relative;display:block;}
-.field input,.field textarea{width:100%;padding:24px 18px 10px;border:1px solid #d9dce3;border-radius:14px;font:1rem var(--sans);background:#fff;resize:vertical;transition:border-color .25s,box-shadow .25s;}
-.field span{position:absolute;left:18px;top:17px;color:#7b8190;pointer-events:none;transition:transform .25s var(--ease),color .25s,font-size .25s;transform-origin:0 0;}
-.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(30,63,174,.12);}
-.field input:focus+span,.field input:not(:placeholder-shown)+span,.field textarea:focus+span,.field textarea:not(:placeholder-shown)+span{transform:translateY(-10px) scale(.78);color:var(--blue);}
-form .btn{align-self:flex-start;}
-.form-ok{color:var(--cyan-deep);font-weight:600;animation:pop .5s var(--ease);}
-
-/* Rodapé */
-.footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:36px 5vw;background:var(--ink);color:var(--muted);font-size:.9rem;}
-.footer a{text-decoration:none;transition:color .2s;}
-.footer a:hover{color:#fff;}
-
-/* Responsivo */
-@media(max-width:860px){
-  .products{grid-template-columns:1fr;}
-}
-@media(max-width:720px){
-  .nav-links a:not(.btn){display:none;}
-  .hero{padding:120px 6vw 90px;}
-  .section{padding:90px 6vw;}
-  .split-box{padding:36px 28px;}
-  .cursor-glow{display:none;}
-}
-@media(hover:none){.cursor-glow{display:none;}}
-@media(prefers-reduced-motion:reduce){
-  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
-  html{scroll-behavior:auto;}
-}
-
-/* A marca sem imagem: a inicial num quadrado com as cores da marca. */
-.brand-mark{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;font-weight:700;font-size:.95rem;color:#fff;background:linear-gradient(135deg,var(--blue),var(--orange));}

package/kits/premium/index.html

@@ -1,83 +0,0 @@
-<!DOCTYPE html>
-<html lang='pt-BR'>
-<head>
-  <meta charset='UTF-8'>
-  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
-  <!-- TROQUE: título e descrição com o nome e a promessa -->
-  <title>Sua Marca, o que você faz</title>
-  <meta name='description' content='Uma frase que diz o que o negócio faz e para quem.'>
-  <link rel='preconnect' href='https://fonts.googleapis.com'>
-  <link rel='preconnect' href='https://fonts.gstatic.com' crossorigin>
-  <!-- TROQUE (se quiser): as fontes. Se trocar aqui, troque --fonte-titulo e --fonte-texto no topo do style.css -->
-  <link href='https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;1,6..96,400&family=Manrope:wght@400;500;600&display=swap' rel='stylesheet'>
-  <link rel='stylesheet' href='style.css'>
-  <script src='script.js' defer></script>
-</head>
-<body>
-  <a class='pular' href='#conteudo'>Pular para o conteúdo</a>
-
-  <!-- TROQUE: o nome e os links -->
-  <header class='topo'>
-    <a href='#' class='marca'>Sua Marca</a>
-    <nav class='menu' aria-label='Principal'>
-      <a href='#trabalho'>O trabalho</a>
-      <a href='#contato'>Agendar</a>
-    </nav>
-  </header>
-
-  <main id='conteudo'>
-    <!-- TROQUE: a frase de abertura (curta e calma) e a linha de baixo. O arco é o elemento marcante: não coloque mais nada em volta dele. -->
-    <section class='abertura'>
-      <div class='arco' id='arco' aria-hidden='true'><span class='arco-luz'></span></div>
-      <h1>Uma frase calma que diz o que vocês fazem.</h1>
-      <p class='abertura-texto'>Para quem é, e em que cidade. Uma linha só.</p>
-      <a href='#contato' class='botao'>Agendar uma conversa</a>
-    </section>
-
-    <!-- TROQUE: o manifesto, um parágrafo que diz o que vocês acreditam e fazem diferente -->
-    <section class='manifesto'>
-      <p>Um parágrafo curto sobre o jeito de trabalhar: o cuidado que ninguém vê, o tempo que cada projeto leva e por que isso muda o resultado para quem contrata.</p>
-    </section>
-
-    <!-- TROQUE: três frentes de trabalho (títulos curtos, textos de duas linhas) -->
-    <section id='trabalho' class='trabalho' aria-label='O trabalho'>
-      <div class='frente'>
-        <h2>Primeira frente</h2>
-        <p>O que é, e o que a pessoa recebe no fim. Duas linhas no máximo.</p>
-      </div>
-      <div class='frente'>
-        <h2>Segunda frente</h2>
-        <p>O que é, e o que a pessoa recebe no fim. Duas linhas no máximo.</p>
-      </div>
-      <div class='frente'>
-        <h2>Terceira frente</h2>
-        <p>O que é, e o que a pessoa recebe no fim. Duas linhas no máximo.</p>
-      </div>
-    </section>
-
-    <!-- TROQUE: uma frase de cliente (real; se não tiver, apague a seção) -->
-    <section class='depoimento' aria-label='Um cliente'>
-      <blockquote>
-        <p>“Uma frase de cliente, curta, que fala do resultado e do cuidado.”</p>
-        <footer>Nome do cliente, cidade</footer>
-      </blockquote>
-    </section>
-
-    <!-- TROQUE: como agendar, o endereço e os contatos -->
-    <section id='contato' class='contato'>
-      <h2>Atendimento com hora marcada</h2>
-      <div class='contato-grade'>
-        <p>Rua Exemplo, 100<br>Sua Cidade</p>
-        <p><a href='mailto:contato@suamarca.com.br'>contato@suamarca.com.br</a><br><a href='tel:+5500000000000'>(00) 0000-0000</a></p>
-        <p>Segunda a sexta<br>das 10h às 19h</p>
-      </div>
-      <a href='https://wa.me/5500000000000' class='botao botao-cheio'>Agendar pelo WhatsApp</a>
-    </section>
-  </main>
-
-  <!-- TROQUE: ano e nome -->
-  <footer class='rodape'>
-    <p>© 2026 Sua Marca</p>
-  </footer>
-</body>
-</html>

package/kits/premium/script.js

@@ -1,11 +0,0 @@
-// Premium: um só movimento, na abertura. O arco sobe devagar quando a página
-// carrega, e nada mais se mexe: animação em toda seção tira o ar de calma.
-(function(){
-  var d=document;
-  d.documentElement.classList.add('js');
-  var arco=d.getElementById('arco');
-  if(!arco) return;
-  // Dois quadros de espera: garante que o navegador pintou o estado inicial
-  // antes de ligar a transição (senão ele pula direto para o fim).
-  requestAnimationFrame(function(){ requestAnimationFrame(function(){ arco.classList.add('pronto'); }); });
-})();

package/kits/premium/style.css

@@ -1,87 +0,0 @@
-:root{
-  /* ── A MARCA ───────────────────────────────────────────────────────
-     Para mudar a cara da página inteira, troque SÓ estas linhas:
-       --primaria   a cor do arco e dos títulos (escura e sóbria)
-       --destaque   o fio de luz no arco e os detalhes (um metal: latão,
-                    cobre, prata)
-       --apoio      as linhas finas e o fundo do depoimento
-       --fundo      o fundo da página (claro e neutro)
-       --fonte-titulo / --fonte-texto   as duas fontes (e o link do
-                    Google Fonts no index.html)
-     O resto do arquivo usa estas variáveis: não precisa mexer nele. */
-  --primaria:#1f3a34;
-  --destaque:#b8955a;
-  --apoio:#dcd9d2;
-  --fundo:#f4f4f1;
-  --fonte-titulo:'Bodoni Moda',Georgia,serif;
-  --fonte-texto:'Manrope',system-ui,sans-serif;
-
-  --tinta:#1c1c1b;
-  --suave:#66655f;
-}
-
-/* Premium: muito espaço vazio e um único elemento marcante (o arco).
-   Tudo o mais é fino, calmo e centrado. O luxo aqui é o que NÃO tem. */
-*{margin:0;padding:0;box-sizing:border-box;}
-html{scroll-behavior:smooth;}
-body{font-family:var(--fonte-texto);font-size:1.02rem;line-height:1.75;color:var(--tinta);background:var(--fundo);-webkit-font-smoothing:antialiased;}
-a{color:inherit;}
-:focus-visible{outline:2px solid var(--destaque);outline-offset:4px;}
-h1,h2{font-family:var(--fonte-titulo);font-weight:400;line-height:1.12;color:var(--primaria);letter-spacing:-.01em;}
-.pular{position:absolute;left:-9999px;top:8px;background:var(--tinta);color:var(--fundo);padding:8px 14px;z-index:10;}
-.pular:focus{left:8px;}
-
-.topo{display:flex;align-items:center;justify-content:space-between;padding:28px clamp(20px,5vw,64px);}
-.marca{font-family:var(--fonte-titulo);font-size:1.6rem;font-weight:500;text-decoration:none;color:var(--primaria);}
-.menu{display:flex;gap:32px;font-size:.95rem;}
-.menu a{text-decoration:none;color:var(--suave);transition:color .3s;}
-.menu a:hover{color:var(--tinta);}
-
-.botao{display:inline-block;padding:14px 32px;border:1px solid var(--primaria);color:var(--primaria);font:500 .98rem var(--fonte-texto);text-decoration:none;letter-spacing:.01em;transition:background .35s,color .35s;}
-.botao:hover{background:var(--primaria);color:var(--fundo);}
-.botao-cheio{background:var(--primaria);color:var(--fundo);}
-.botao-cheio:hover{background:transparent;color:var(--primaria);}
-
-/* O arco: uma janela alta, com um fio de metal por dentro e um sol baixo */
-.abertura{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(24px,5vw,56px) 24px clamp(90px,12vw,160px);}
-.arco{position:relative;width:min(380px,70vw);aspect-ratio:3/4.2;border-radius:999px 999px 0 0;background:var(--primaria);overflow:hidden;margin-bottom:clamp(40px,6vw,72px);transform-origin:50% 100%;}
-.arco::before{content:'';position:absolute;inset:18px 18px 0;border:1px solid var(--destaque);border-bottom:0;border-radius:999px 999px 0 0;opacity:.8;}
-.arco-luz{position:absolute;left:50%;bottom:-18%;width:64%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 50% 40%,var(--destaque),color-mix(in srgb,var(--destaque) 30%,var(--primaria)) 70%);opacity:.95;}
-.abertura h1{font-size:clamp(2.2rem,4.8vw,4.1rem);max-width:18ch;margin-bottom:22px;}
-.abertura-texto{color:var(--suave);font-size:1.1rem;margin-bottom:40px;}
-
-/* Entrada: só o arco sobe, uma vez, ao abrir a página */
-.js .arco{opacity:0;transform:scaleY(.86);}
-.js .arco.pronto{opacity:1;transform:none;transition:opacity 1.4s ease,transform 1.6s cubic-bezier(.2,.7,.1,1);}
-
-.manifesto{padding:clamp(80px,12vw,160px) 24px;border-top:1px solid var(--apoio);}
-.manifesto p{max-width:30ch;margin:0 auto;text-align:center;font-family:var(--fonte-titulo);font-weight:400;font-size:clamp(1.5rem,2.7vw,2.2rem);line-height:1.4;color:var(--tinta);}
-
-/* O trabalho: três colunas de texto com um fio em cima, sem caixa */
-.trabalho{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(32px,5vw,80px);max-width:1160px;margin:0 auto;padding:clamp(60px,8vw,120px) clamp(24px,5vw,64px);}
-.frente{border-top:1px solid var(--destaque);padding-top:28px;}
-.frente h2{font-size:clamp(1.45rem,2vw,1.8rem);font-weight:400;margin-bottom:12px;}
-.frente p{color:var(--suave);max-width:34ch;}
-
-.depoimento{background:var(--apoio);padding:clamp(80px,11vw,150px) 24px;text-align:center;}
-.depoimento p{font-family:var(--fonte-titulo);font-style:italic;font-weight:400;font-size:clamp(1.4rem,2.6vw,2.1rem);line-height:1.3;max-width:28ch;margin:0 auto;color:var(--primaria);}
-.depoimento footer{margin-top:24px;color:var(--suave);font-size:.95rem;}
-
-.contato{text-align:center;padding:clamp(90px,12vw,160px) 24px;}
-.contato h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:48px;}
-.contato-grade{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;gap:clamp(28px,6vw,96px);margin-bottom:56px;color:var(--suave);}
-.contato-grade a{text-decoration:none;border-bottom:1px solid var(--apoio);transition:border-color .3s;}
-.contato-grade a:hover{border-color:var(--destaque);}
-
-.rodape{border-top:1px solid var(--apoio);padding:28px;text-align:center;font-size:.9rem;color:var(--suave);}
-
-@media (max-width:760px){
-  .trabalho{grid-template-columns:1fr;}
-  .contato-grade{grid-template-columns:1fr;gap:20px;}
-  .menu{gap:20px;}
-}
-@media (prefers-reduced-motion:reduce){
-  html{scroll-behavior:auto;}
-  *{transition:none!important;}
-  .js .arco{opacity:1;transform:none;}
-}