/* Garcia Axis — folha compartilhada por todas as páginas.
   Hero e cabeçalho no padrão do prompt de referência (marketing/hero-spec-referencia.md), adaptados à marca. */
html,body{background:#000000 !important;color:#ffffff}
:root{
  --bg:#000000;
  --text:#ffffff;
  --muted:#9a9a9a;
  --stat:#d8d8d8;
  --border:rgba(255,255,255,.16);
  --border-soft:rgba(255,255,255,.12);
  --panel:#111114;
  --line:rgba(255,255,255,.10);
  --line-strong:rgba(255,255,255,.24);
  --accent:#315CFF;
  --accent-hover:#2749D1;
  --accent-muted:rgba(49,92,255,.18);
  --accent-glow:rgba(49,92,255,.45);
  --text-2:#9B9BA1;
  --font-d:'Sora',system-ui,sans-serif;
  --font-b:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-s:'Instrument Serif','Times New Roman',Times,serif;
  --font-m:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --wrap:1180px;
  /* tokens do hero (padrão ~1440px) */
  --logo:15.5px;--nav:14px;--nav-h:40px;--btn:13.5px;--btn-h:40px;--hero-btn-h:42px;
  --h1:48px;--lede:15.5px;--badge:12.5px;--stat-size:13.5px;
  --header-y:22px;--header-x:40px;--stats-x:72px;--stats-y:36px;--hero-gap:85px;--copy-max:860px;--lede-max:470px;
  --nav-pad:18px;--badge-mb:22px;--lede-mt:18px;--actions-mt:26px;--actions-gap:10px;--icon:20px;--icon-w:38px;--icon-h:21px;--btn-pad:16px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip;-webkit-text-size-adjust:100%}
html,body{background:#000000;background:var(--bg,#000000);color:#ffffff;color:var(--text,#ffffff)}
body{font:400 1rem/1.6 var(--font-b);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden;overflow-x:clip;position:relative}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3{font-family:var(--font-d);font-weight:700;letter-spacing:-.02em;line-height:1.08}
h2{font-size:clamp(2rem,4vw,3.2rem);max-width:18ch}
h3{font-size:1.35rem;font-weight:600}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:#fff}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--accent);color:#fff;padding:10px 14px;border-radius:8px;font-weight:500;transition:top .3s var(--ease-out)}
.skip:focus{top:12px}

/* ---------- grão (frente de tudo) e ambiente (atrás de tudo) ---------- */
.grain{position:fixed;inset:-50%;width:200%;height:200%;z-index:100;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 8s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-2%,1%)}40%{transform:translate(1%,-2%)}60%{transform:translate(-1%,2%)}80%{transform:translate(2%,-1%)}100%{transform:translate(0,0)}}
.env{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.env-band{position:absolute;left:-30vmax;width:150vmax;height:22vmax;top:26%;transform:rotate(-32deg);background:linear-gradient(90deg,transparent 0%,rgba(49,92,255,.08) 42%,rgba(49,92,255,.12) 50%,rgba(49,92,255,.08) 58%,transparent 100%);filter:blur(40px);animation:drift 70s ease-in-out -20s infinite alternate}
.env-band.b2{top:66%;height:16vmax;opacity:.7;animation-duration:90s;animation-delay:-55s}
.env-dust{position:absolute;inset:0;width:100%;height:100%;opacity:.8}
@keyframes drift{from{transform:rotate(-32deg) translateX(-4vmax)}to{transform:rotate(-30deg) translateX(6vmax)}}

/* ---------- cabeçalho: três colunas, pílulas de metal líquido ---------- */
.header{position:absolute;top:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:var(--header-y) var(--header-x) 10px}
.logo{display:inline-flex;align-items:center;gap:9px;justify-self:start;color:#fff}
.logo img{height:28px;width:auto}
.site-nav{display:flex;align-items:center;gap:8px;justify-self:center}
.pill{position:relative;display:inline-flex;align-items:center;gap:9px;height:var(--nav-h);padding:0 var(--nav-pad);border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);color:#d8d8d8;font-size:var(--nav);font-weight:500;letter-spacing:-.01em;white-space:nowrap;transition:color .3s,border-color .3s,background .3s,box-shadow .3s,transform .3s}
.pill::before{content:"";width:5px;height:5px;border-radius:1px;background:currentColor;opacity:.35;flex:none;transition:opacity .3s,background .3s,box-shadow .3s}
.pill:hover{color:#fff;border-color:rgba(49,92,255,.75);background:rgba(49,92,255,.14);box-shadow:0 0 20px rgba(49,92,255,.28);transform:translateY(-1px)}
.pill:hover::before,.pill.is-current::before{background:var(--accent);opacity:1;box-shadow:0 0 8px var(--accent)}
.pill.is-current{color:#fff;border-color:rgba(49,92,255,.6);background:rgba(49,92,255,.1)}
.header-cta{justify-self:end}
.burger{display:none;place-items:center;width:42px;height:42px;border-radius:6px;border:1px solid var(--border);background:rgba(8,8,8,.55);z-index:60;justify-self:end;transition:border-color .3s,background .3s}
.burger:hover{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.05)}
.burger i{display:block;width:16px;height:1.5px;background:#fff;border-radius:1px;transition:transform .25s ease,opacity .2s ease}
.burger i+i{margin-top:5px}
body.menu-open .burger i:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
body.menu-open .burger i:nth-child(2){opacity:0}
body.menu-open .burger i:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.menu-backdrop{display:none}

/* ---------- botões (vidro líquido) ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--btn-h);padding:0 var(--btn-pad);border-radius:9px;font-family:var(--font-b);font-size:var(--btn);font-weight:500;letter-spacing:-.02em;line-height:1;white-space:nowrap;cursor:pointer;transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,color .35s ease,transform .35s var(--ease-out)}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.34) 48%,transparent 76%);transform:translateX(-130%);transition:transform .65s ease;pointer-events:none;z-index:-1}
.btn:hover::after{transform:translateX(130%)}
.btn-solid{background:linear-gradient(180deg,#5C7EFF 0%,#315CFF 52%,#2646C9 100%);color:#fff;border:1px solid rgba(170,192,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 12px 30px -12px rgba(49,92,255,.75)}
.btn-solid:hover{background:linear-gradient(180deg,#7290FF 0%,#3F68FF 52%,#2C51DB 100%);border-color:rgba(210,222,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 0 30px rgba(49,92,255,.5),0 16px 36px -12px rgba(49,92,255,.85);transform:translateY(-1px)}
.btn-ghost{background:rgba(255,255,255,.04);color:#fff;border:1px solid rgba(255,255,255,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.btn-ghost:hover{border-color:rgba(49,92,255,.95);background:rgba(49,92,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 26px rgba(49,92,255,.38);transform:translateY(-1px)}
.btn-hero{height:var(--hero-btn-h);padding:0 22px;font-size:calc(var(--btn) + 1px)}
.btn-hero.btn-ghost{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.btn-accent{background:var(--accent);color:#fff;border:1px solid var(--accent)}
.btn-accent:hover{background:var(--accent-hover);box-shadow:0 12px 40px -14px var(--accent-glow)}
.btn-wide{width:100%}
@media (pointer:coarse){.btn,.pill,.faq-q,.tab{min-height:44px}}

/* ---------- hero da home ---------- */
.hero{position:relative;min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:1fr auto;background:#000;overflow:hidden;isolation:isolate}
.hero-field{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;opacity:0;transition:opacity 1.6s ease}
.hero-field.is-in{opacity:1}
.hero-fade{position:absolute;left:0;right:0;bottom:0;height:30%;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.8) 75%,#000)}
.hero h1 .hw,.phero h1 .hw{display:inline-block;transition:color .35s,text-shadow .35s}
.hero h1 .hw:hover,.phero h1 .hw:hover{color:var(--accent);text-shadow:0 0 26px rgba(49,92,255,.6)}
.hero h1 em:hover,.phero h1 em:hover{color:#fff;text-shadow:0 0 26px rgba(255,255,255,.5)}
.slogan{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 14px;margin-top:20px;font-family:var(--font-d);font-weight:600;font-size:clamp(1rem,1.45vw,1.3rem);letter-spacing:-.02em}
.slogan a{position:relative;display:inline-flex;padding:8px 6px 22px;color:rgba(245,245,242,.82);transition:color .3s,text-shadow .3s}
.slogan a::after{content:attr(data-sub);position:absolute;left:50%;bottom:2px;transform:translate(-50%,6px);font:400 .62rem var(--font-m);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);opacity:0;white-space:nowrap;transition:opacity .35s,transform .35s var(--ease-out);pointer-events:none}
.slogan a:hover,.slogan a:focus-visible,.slogan a.on{color:var(--accent);text-shadow:0 0 22px rgba(49,92,255,.65)}
.slogan a:hover::after,.slogan a:focus-visible::after,.slogan a.on::after{opacity:1;transform:translate(-50%,0)}
.hero-main{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:center;padding:calc(var(--header-y) + 90px) 24px var(--hero-gap);min-height:0}
.hero-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:var(--copy-max);width:100%}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.badge{position:relative;display:inline-flex;align-items:center;gap:10px;margin-bottom:var(--badge-mb);padding:10px 18px 10px 14px;border:0;border-radius:999px;background:rgba(8,10,22,.74);color:#F5F5F2;font-family:var(--font-b);font-size:var(--badge);font-weight:500;letter-spacing:.01em;line-height:1.2;isolation:isolate;cursor:default;transition:background .4s,color .4s,transform .4s var(--ease-out),box-shadow .4s}
.badge::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--ang),rgba(255,255,255,.14) 0%,rgba(255,255,255,.14) 58%,#315CFF 76%,#A9BDFF 86%,rgba(255,255,255,.14) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin-border 4.5s linear infinite;z-index:-1;pointer-events:none}
.badge::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(70% 120% at 18% 50%,rgba(49,92,255,.4),transparent 70%);opacity:0;transition:opacity .4s;z-index:-1;pointer-events:none}
.badge:hover{background:rgba(49,92,255,.92);color:#fff;transform:translateY(-1px);box-shadow:0 0 30px rgba(49,92,255,.45)}
.badge:hover::after{opacity:1}
.badge-star{width:16px;height:18px;color:var(--accent);filter:drop-shadow(0 0 6px rgba(49,92,255,.85));animation:in-star .9s cubic-bezier(.16,1,.3,1) .28s both,star-pulse 3.2s ease-in-out 1.5s infinite}
.badge:hover .badge-star{color:#fff;filter:drop-shadow(0 0 6px rgba(255,255,255,.8))}
@keyframes spin-border{to{--ang:360deg}}
@keyframes star-pulse{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.18) rotate(12deg)}}
.hero h1,.phero h1{display:flex;flex-direction:column;align-items:center;font:600 var(--h1)/1.12 var(--font-d);letter-spacing:-.045em;color:#fff}
.headline-line{display:block;overflow:hidden;padding:.06em .15em .14em}
.hero h1 em,.phero h1 em{font-family:var(--font-s);font-style:italic;font-weight:400;font-size:1.08em;letter-spacing:-.03em;color:var(--accent);animation:in-em 1.2s cubic-bezier(.16,1,.3,1) .72s both}
.hero-lede{max-width:var(--lede-max);margin-top:var(--lede-mt);color:var(--muted);font-size:var(--lede);font-weight:400;line-height:1.55;letter-spacing:-.015em}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--actions-gap);margin-top:var(--actions-mt)}
.stats{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--stats-x) var(--stats-y);padding-bottom:max(var(--stats-y),env(safe-area-inset-bottom));color:var(--stat)}
.stat{display:inline-flex;align-items:center;gap:14px;font-size:var(--stat-size);letter-spacing:-.015em;white-space:nowrap}
.stat svg{width:var(--icon);height:var(--icon);flex:none;color:#e8e8e8}
.stat svg.stat-icon-wide{width:var(--icon-w);height:var(--icon-h)}
.hero-scrim{position:absolute;left:0;right:0;bottom:0;height:46%;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.55));opacity:0}

/* cabeçalho de página interna */
.phero{position:relative;z-index:1;padding:calc(var(--header-y) + 140px) 24px 56px;display:flex;flex-direction:column;align-items:center;text-align:center}
.phero h1{font-size:clamp(2.1rem,4.6vw,4rem);max-width:20ch}
.phero .hero-lede{max-width:56ch}
.phero .hero-actions{margin-top:var(--actions-mt)}

/* ---------- coreografia de entrada ---------- */
.appear{opacity:1;animation-duration:var(--dur,1.05s);animation-fill-mode:both;animation-timing-function:cubic-bezier(.16,1,.3,1);animation-delay:var(--d,.08s)}
.appear--scale{animation-name:in-scale}
.appear--soft{animation-name:in-soft}
.appear--mask{animation-name:in-mask}
.appear--pop{animation-name:in-pop}
.appear--btn{animation-name:in-btn}
.appear--side{animation-name:in-side}
.appear--stat{animation-name:in-stat}
.appear.is-in{animation:none;opacity:1;transform:none;clip-path:none;filter:none}
@keyframes in-scale{from{opacity:0;transform:scale(.84)}to{opacity:1;transform:scale(1)}}
@keyframes in-soft{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes in-mask{from{opacity:0;transform:translateY(40%)}to{opacity:1;transform:translateY(0)}}
@keyframes in-pop{0%{opacity:0;transform:scale(.9)}70%{opacity:1;transform:scale(1.03)}100%{opacity:1;transform:scale(1)}}
@keyframes in-btn{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes in-side{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:translateX(0)}}
@keyframes in-stat{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes in-star{0%{transform:scale(.2) rotate(-50deg)}65%{transform:scale(1.2) rotate(8deg)}100%{transform:scale(1) rotate(0)}}
@keyframes in-em{from{opacity:.35;filter:blur(4px)}to{opacity:1;filter:blur(0)}}

/* ---------- responsivo do hero e do cabeçalho (do prompt) ---------- */
@media (min-width:1280px) and (max-width:1599px){:root{--h1:54px;--lede:16px;--header-x:48px;--stats-x:80px;--copy-max:900px}}
@media (min-width:1600px){:root{--logo:17px;--nav:15px;--nav-h:44px;--btn:15px;--btn-h:44px;--hero-btn-h:48px;--h1:64px;--lede:18px;--badge:13.5px;--stat-size:15px;--header-y:28px;--header-x:64px;--stats-x:96px;--stats-y:44px;--copy-max:980px;--lede-max:540px;--nav-pad:20px;--badge-mb:26px;--lede-mt:22px;--actions-mt:30px;--actions-gap:12px;--icon:22px;--icon-w:45px;--icon-h:24px}.logo img{height:30px}}
@media (min-width:1920px){:root{--logo:18px;--nav:16px;--nav-h:48px;--btn:16px;--btn-h:48px;--hero-btn-h:52px;--h1:76px;--lede:20px;--badge:14.5px;--stat-size:16px;--header-y:32px;--header-x:80px;--stats-x:120px;--stats-y:52px;--copy-max:1120px;--lede-max:620px;--nav-pad:22px;--btn-pad:22px;--icon-w:48px;--icon-h:26px}.site-nav{gap:10px}.badge{padding:10px 15px}.logo img{height:32px}}
@media (min-width:2560px){:root{--h1:88px;--lede:22px;--header-x:120px;--stats-x:160px;--copy-max:1280px;--lede-max:680px}}
@media (min-width:901px) and (max-width:1279px){:root{--logo:15px;--nav:13px;--nav-h:36px;--btn:13px;--btn-h:38px;--hero-btn-h:40px;--h1:42px;--lede:15px;--badge:12px;--stat-size:12.5px;--header-y:16px;--header-x:28px;--stats-x:36px;--stats-y:28px;--hero-gap:64px;--copy-max:760px;--lede-max:440px;--nav-pad:14px;--badge-mb:16px;--lede-mt:14px;--actions-mt:20px}}
@media (min-width:901px) and (max-height:850px){:root{--header-y:14px;--stats-y:24px;--hero-gap:48px;--h1:40px;--badge-mb:12px;--lede-mt:12px;--actions-mt:16px}}
@media (min-width:901px) and (max-height:720px){:root{--h1:34px;--lede:14px;--hero-gap:32px;--stats-y:18px;--nav-h:30px;--btn-h:34px;--hero-btn-h:36px;--badge-mb:8px}}
@media (max-width:900px){
  :root{--logo:16px;--btn:15px;--btn-h:46px;--hero-btn-h:48px;--h1:36px;--lede:16.5px;--badge:13.5px;--stat-size:15px;--header-y:16px;--header-x:18px;--stats-x:20px;--stats-y:28px;--hero-gap:36px;--copy-max:100%;--lede-max:100%}
  .header{grid-template-columns:1fr auto auto;gap:8px;padding-top:max(var(--header-y),env(safe-area-inset-top));padding-left:max(var(--header-x),env(safe-area-inset-left));padding-right:max(var(--header-x),env(safe-area-inset-right))}
  .logo,.header-cta,.burger{position:relative;z-index:80}
  .header-cta{display:none}
  .burger{display:grid}
  .menu-backdrop{display:block;position:fixed;inset:0;z-index:40;background:rgba(8,8,8,.42);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
  body.menu-open .menu-backdrop{opacity:1;visibility:visible;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
  .site-nav{position:fixed;inset:0;z-index:45;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:12px;padding:96px 22px 32px;padding-top:max(96px,calc(env(safe-area-inset-top) + 88px));background:transparent;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .28s ease,visibility .28s ease,transform .28s ease}
  body.menu-open .site-nav{opacity:1;visibility:visible;transform:none}
  .site-nav .pill{width:100%;height:56px;justify-content:center;font-size:19px;border-radius:10px}
  .site-nav .btn{width:100%;height:56px;font-size:17px;border-radius:10px;margin-top:8px}
  body.menu-open{overflow:hidden}
  .hero-main{padding:calc(var(--header-y) + 84px) 20px 64px;align-items:flex-end}
  .stats{flex-direction:column;align-items:center;gap:16px;padding:0 var(--stats-x) var(--stats-y)}
  .stat{white-space:normal;text-align:left}
  .phero{padding-top:calc(var(--header-y) + 110px)}
}
@media (max-width:560px){
  :root{--h1:34px;--lede:16px;--header-x:16px}
  .hero-actions{flex-direction:column;width:100%}
  .hero-actions .btn{width:100%}
}
@media (min-width:901px){.site-nav .btn{display:none}}

/* ---------- seções ---------- */
main{position:relative;z-index:1}
.sec{position:relative;padding:clamp(88px,11vw,150px) 0;overflow:hidden}
.sec.tight{padding-top:clamp(48px,6vw,80px)}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin:0 auto;position:relative}
.faixa{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.faixa path{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.6;stroke-dasharray:var(--len,2000);stroke-dashoffset:var(--len,2000);transition:stroke-dashoffset 2.4s var(--ease-out)}
.sec.in .faixa path{stroke-dashoffset:0}
.chip{display:inline-block;padding:8px 14px;border-radius:10px;background:rgba(8,8,15,.72);border:1px solid rgba(96,96,126,.3);font:400 .72rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2)}
.kicker{font:400 .74rem/1.4 var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2);display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:6px;height:6px;background:var(--accent);flex:none}
.kicker.center{justify-content:center}
.lede{color:var(--text-2);font-size:1.12rem;max-width:56ch;margin-top:18px}
.center{text-align:center}
.center h2,.center .lede{margin-left:auto;margin-right:auto}
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
.reveal.in.settled{transition-delay:0s}
.zoomin{opacity:0;transform:perspective(1400px) translateY(46px) scale(.86) rotateX(8deg);transform-origin:50% 60%;transition:opacity 1.1s var(--ease-out),transform 1.4s var(--ease-out);will-change:transform,opacity}
.zoomin.in{opacity:1;transform:perspective(1400px) translateY(0) scale(1) rotateX(0)}
.typed{white-space:nowrap;overflow:hidden}
.caret{display:inline-block;width:2px;height:1.05em;background:var(--accent);margin-left:2px;vertical-align:-.15em;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.sk i{display:block;height:10px;border-radius:5px;background:rgba(245,245,242,.09);margin:10px 0}
.tela .lede{margin-bottom:44px}
.tela-note{margin-top:28px;color:var(--text-2);font-size:1.02rem;max-width:60ch}
.tela-note a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.row-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.row-actions.center{justify-content:center}

/* pilares */
.pil-grid{display:grid;grid-template-columns:.9fr 1.4fr;gap:clamp(32px,5vw,72px);align-items:center;margin-top:56px}
.hold-wrap{display:flex;flex-direction:column;align-items:center;gap:18px;position:sticky;top:120px}
.hold{position:relative;width:200px;height:200px;border-radius:50%;display:grid;place-items:center;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:transform .5s var(--ease-out)}
.hold:active{transform:scale(.98)}
.hold img{width:84px;height:auto;position:relative;z-index:1;transition:filter .6s}
.hold-ring{position:absolute;inset:0;transform:rotate(-90deg)}
.hold-ring circle{fill:none;stroke-width:2}
.hold-ring .track{stroke:var(--line-strong)}
.hold-ring .fill{stroke:var(--accent);stroke-dasharray:578;stroke-dashoffset:calc(578*(1 - var(--hp,0)))}
.hold::after{content:"";position:absolute;inset:14px;border-radius:50%;background:radial-gradient(circle,var(--accent-muted),transparent 70%);opacity:var(--hp,0);transition:opacity .4s}
.hold.done img{filter:drop-shadow(0 0 14px var(--accent-glow))}
.hold-label{transition:opacity .5s}
.hold-done{opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);font:600 1rem var(--font-d);text-align:center;color:#fff}
.hold-wrap.done .hold-label{opacity:0}
.hold-wrap.done .hold-done{opacity:1;transform:none}
.pil-cards{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pil-line{position:absolute;inset:-8% -4%;width:108%;height:116%;pointer-events:none;z-index:0}
.pil-line path{fill:none;stroke:var(--accent);stroke-width:1.5;vector-effect:non-scaling-stroke;opacity:.7;stroke-dasharray:var(--len,1800);stroke-dashoffset:calc(var(--len,1800)*(1 - var(--lp,0)))}
.pil{position:relative;z-index:1;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:26px 26px 28px;overflow:hidden;transition:border-color .7s,box-shadow .7s,transform .8s var(--ease-out);display:flex;flex-direction:column}
.pil::after{content:"";position:absolute;right:-40%;top:-60%;width:80%;height:220%;transform:rotate(32deg);background:linear-gradient(90deg,transparent,var(--accent-muted),transparent);opacity:0;transition:opacity .9s;pointer-events:none}
.pil.lit{border-color:rgba(49,92,255,.6);box-shadow:0 0 0 1px rgba(49,92,255,.22),0 30px 70px -40px var(--accent-glow)}
.pil.lit::after{opacity:1}
.pil .num{font:700 2.6rem/1 var(--font-d);color:rgba(155,155,161,.35);margin:18px 0 10px;transition:color .7s}
.pil.lit .num{color:var(--accent)}
.pil h3{margin-bottom:8px}
.pil>p:not(.kicker):not(.num){color:var(--text-2)}
.pil.lit>p:not(.kicker):not(.num){color:#fff}
.pil-link{margin-top:auto;padding-top:16px;font:500 .9rem var(--font-b);color:var(--accent);position:relative;z-index:1}
.pil-link::after{content:" \2192"}
.pil-link:hover{text-decoration:underline}

/* tela 1: navegador */
.browser{background:#15151B;border:1px solid var(--line-strong);border-radius:14px;overflow:hidden;box-shadow:0 60px 120px -50px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.5);max-width:920px;margin:0 auto}
.browser-top{display:flex;align-items:center;gap:16px;padding:12px 14px 0;background:#101015}
.dots{display:flex;gap:6px;flex:none}
.dots i{width:10px;height:10px;border-radius:50%;background:rgba(245,245,242,.14)}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{padding:10px 16px;border-radius:10px 10px 0 0;font:500 .86rem var(--font-b);color:var(--text-2);background:transparent;transition:background .3s,color .3s;white-space:nowrap}
.tab.on{background:#1C1C24;color:#fff}
.tab:hover{color:#fff}
.urlbar{position:relative;display:flex;align-items:center;padding:10px 14px;background:#1C1C24;border-bottom:1px solid var(--line)}
.url{flex:1;display:flex;align-items:center;gap:10px;background:#0F0F14;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font:400 .9rem var(--font-m);color:#fff;min-height:36px}
.url svg{width:14px;height:14px;color:var(--text-2);flex:none}
.loadbar{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease-out),opacity .4s}
.loadbar.go{transform:scaleX(1)}
.loadbar.done{opacity:0}
.browser-body{position:relative;aspect-ratio:16/9;background:#0A0A0E;overflow:hidden}
.browser-body .page{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transform:translateY(28px) scale(1.02);transition:opacity .8s var(--ease-out),transform 1s var(--ease-out)}
.browser-body .page.on{opacity:1;transform:none}
.site-notes{max-width:920px;margin:26px auto 0;position:relative;min-height:140px}
.note{position:absolute;inset:0;opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);pointer-events:none}
.note.on{position:relative;opacity:1;transform:none;pointer-events:auto}
.note h3{font-size:1.5rem;margin-bottom:10px}
.note p{color:var(--text-2);max-width:60ch}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.tags span{font:400 .7rem var(--font-m);letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-strong);border-radius:999px;padding:7px 11px;color:var(--text-2)}

/* tela 2: busca */
.search{max-width:820px;margin:0 auto;background:#F5F5F2;color:#1B1B1F;border-radius:18px;padding:34px 32px 30px;box-shadow:0 60px 120px -50px rgba(0,0,0,.95)}
.search-box{display:flex;align-items:center;gap:12px;border:1px solid #DADCE0;border-radius:999px;padding:14px 20px;font:400 1.05rem var(--font-b);background:#fff;box-shadow:0 1px 6px rgba(32,33,36,.16);min-height:52px}
.search-box svg{width:20px;height:20px;color:#9AA0A6;flex:none}
.search .caret{background:#1B1B1F}
.results{margin-top:26px;display:flex;flex-direction:column;gap:22px}
.result{opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
.results.show .result{opacity:1;transform:none}
.results.show .result:nth-child(2){transition-delay:.15s}
.results.show .result:nth-child(3){transition-delay:.3s}
.results.show .result:nth-child(4){transition-delay:.45s}
.ad-tag{display:block;font:700 .8rem var(--font-b);color:#1B1B1F;margin-bottom:8px}
.r-site{display:flex;align-items:center;gap:10px;font:400 .86rem var(--font-b);color:#202124}
.r-site .fav{width:26px;height:26px;border-radius:50%;background:#0B0B0D url("../monograma-reversa.svg") center/15px no-repeat;border:1px solid #DADCE0;flex:none}
.result h3{font:400 1.25rem/1.3 var(--font-b);color:var(--accent);margin:6px 0 4px}
.result .desc{font:400 .94rem/1.5 var(--font-b);color:#4D5156;max-width:62ch}
.result.sk i{background:#E4E6EA;height:11px}

/* tela 3: feed */
.tela-insta-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,6vw,80px);align-items:center}
.tela-insta .lede{margin-bottom:0}
.tela-insta{padding-bottom:clamp(56px,7vw,96px)}
.phone-screen{width:min(340px,100%);margin:0 auto;background:#000;border:8px solid #1A1A21;border-radius:36px;overflow:hidden;box-shadow:0 60px 120px -50px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.6);color:#F5F5F2;font-family:var(--font-b)}
.ig-top{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 10px;font:600 1.1rem var(--font-d)}
.ig-icons{display:flex;gap:14px}
.ig-icons svg{width:22px;height:22px}
.stories{display:flex;gap:12px;padding:6px 14px 12px;overflow:hidden}
.story{width:58px;height:58px;border-radius:50%;padding:3px;background:linear-gradient(45deg,#315CFF,#8FB0FF);flex:none;opacity:0;transform:translateX(24px);transition:opacity .6s var(--ease-out),transform .7s var(--ease-out)}
.story:nth-child(2){transition-delay:.08s}.story:nth-child(3){transition-delay:.16s}.story:nth-child(4){transition-delay:.24s}.story:nth-child(5){transition-delay:.32s}.story:nth-child(6){transition-delay:.4s}
.phone-screen.in .story{opacity:1;transform:none}
.story i{display:block;width:100%;height:100%;border-radius:50%;background:#111;border:2px solid #000}
.story.me i{background:#0B0B0D url("../monograma-reversa.svg") center/58% no-repeat}
.story.sk{background:rgba(245,245,242,.16)}
.post{border-top:1px solid rgba(245,245,242,.08);opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease-out) .45s,transform 1s var(--ease-out) .45s}
.phone-screen.in .post{opacity:1;transform:none}
.post-head{display:flex;align-items:center;gap:10px;padding:10px 12px}
.post-head img{width:32px;height:32px;border-radius:50%;background:#0B0B0D;padding:7px;border:1px solid rgba(245,245,242,.2)}
.post-head b{display:block;font-size:.9rem}
.post-head span{font-size:.75rem;color:var(--text-2)}
.post-head .more{margin-left:auto;font-style:normal;letter-spacing:1px;color:var(--text-2)}
.post-media img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.post-cta{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;background:var(--accent);color:#fff;font:500 .9rem var(--font-b)}
.post-cta svg{width:16px;height:16px}
.post-actions{display:flex;gap:14px;padding:10px 12px}
.post-actions svg{width:22px;height:22px}
.post-actions .right{margin-left:auto}
.post-cap{padding:0 12px 16px;font-size:.88rem;line-height:1.45}
.post.sk{padding:0 0 14px;transition-delay:.7s}
.post.sk .av{width:32px;height:32px;border-radius:50%;background:rgba(245,245,242,.12)}
.post.sk .bar{width:40%;height:10px;border-radius:5px;background:rgba(245,245,242,.12)}
.post.sk .sq{height:120px;background:rgba(245,245,242,.06)}

/* planos (sem valores) */
.site-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px;margin-top:48px}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.plan,.full,.site-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:26px 24px;transition:border-color .5s,transform .7s var(--ease-out);display:flex;flex-direction:column;gap:12px}
.plan:hover,.site-card:hover{border-color:var(--line-strong)}
.plan h3,.full h3,.site-card h3{font-size:1.4rem;margin-top:8px}
.site-card.best{border-color:rgba(49,92,255,.65);box-shadow:0 30px 80px -50px var(--accent-glow);background:linear-gradient(160deg,var(--panel),#10142A)}
.site-card.best h3{font-size:1.7rem}
.plan.best{border-color:rgba(49,92,255,.6);box-shadow:0 30px 80px -50px var(--accent-glow)}
.tag{position:absolute;top:-12px;left:22px;background:var(--accent);color:#fff;font:400 .68rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:6px}
.plan-for{color:var(--text-2);min-height:3.2em}
.plan-list{display:flex;flex-direction:column;gap:7px;font-size:.94rem;flex:1}
.plan-list li{display:flex;gap:10px;align-items:baseline}
.plan-list li::before{content:"+";color:var(--accent);font-family:var(--font-m);flex:none}
.plan .btn,.site-card .btn{margin-top:14px;align-self:flex-start}
.sub-kicker{margin-top:64px}
.full{margin-top:16px;display:grid;grid-template-columns:1.1fr 1.4fr auto;gap:32px;align-items:center;border-color:rgba(49,92,255,.35);background:linear-gradient(120deg,var(--panel),#12152A)}
.plan-list.two{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px}
.note-line{margin-top:22px;color:var(--text-2);font-size:.92rem;max-width:64ch}
.value-line{display:inline-flex;align-items:center;gap:10px;margin-top:26px;padding:12px 16px;border:1px solid rgba(49,92,255,.4);border-radius:10px;background:var(--accent-muted);font-size:.95rem;color:#fff}
.value-line::before{content:"";width:6px;height:6px;background:var(--accent)}
.compare{width:100%;border-collapse:collapse;margin-top:40px;font-size:.96rem}
.compare th,.compare td{text-align:left;padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.compare th{font:400 .72rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2)}
.compare td:first-child{font-weight:600;white-space:nowrap}
.compare td{color:var(--text-2)}
.compare td:first-child{color:#fff}
.table-wrap{overflow-x:auto}

/* como funciona */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.step{position:relative;padding:28px 0 0;border-top:1px solid var(--line)}
.seg{position:absolute;right:0;top:-30px;width:120px;height:36px}
.seg path{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:210;stroke-dashoffset:210;transition:stroke-dashoffset 1.6s var(--ease-out) calc(var(--d,0s) + .3s)}
.step.in .seg path{stroke-dashoffset:0}
.step .num{font:700 2.2rem/1 var(--font-d);color:var(--accent);margin-bottom:14px}
.step h3{margin-bottom:8px}
.step p:last-child{color:var(--text-2);max-width:32ch}

/* perguntas */
.faq{max-width:780px;margin-top:40px;border-top:1px solid var(--line)}
.faq.center-block{margin-left:auto;margin-right:auto}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;text-align:left;padding:22px 0;font:600 1.12rem var(--font-d);letter-spacing:-.01em;transition:color .3s}
.faq-q:hover{color:var(--accent)}
.faq-q i{flex:none;width:12px;height:12px;position:relative;transition:transform .5s var(--ease-out)}
.faq-q i::before,.faq-q i::after{content:"";position:absolute;background:var(--accent);left:0;top:5px;width:12px;height:2px}
.faq-q i::after{transform:rotate(90deg);transition:transform .5s var(--ease-out)}
.faq-item.open .faq-q i::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease-out)}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-inner{overflow:hidden;color:var(--text-2)}
.faq-inner p{padding-bottom:22px;max-width:62ch}

/* chamada final e formulário */
.cta{background:#000}
.cta-bg{position:absolute;inset:0;background:#0A0B12 url("../hero-ending.jpg") center/cover no-repeat;opacity:.85}
.cta-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.35) 40%,rgba(0,0,0,.92))}
.cta .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.cta-text h2{margin-top:16px;max-width:16ch}
.cta-alt{margin-top:22px;color:var(--text-2)}
.cta-alt a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.form{background:rgba(17,17,20,.92);border:1px solid var(--line);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:400 .72rem var(--font-m);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.field input,.field select,.field textarea{background:rgba(0,0,0,.7);border:1px solid var(--line-strong);border-radius:8px;color:#fff;font:400 1rem var(--font-b);padding:12px 14px;transition:border-color .3s,box-shadow .3s;width:100%}
.field textarea{resize:vertical;min-height:96px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}
.field.bad input{border-color:var(--accent);animation:shake .5s var(--ease-out)}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.form-note{font-size:.84rem;color:var(--text-2)}
.form-ok{color:#fff;font-weight:500;padding:12px 14px;border:1px solid rgba(49,92,255,.5);border-radius:8px;background:var(--accent-muted)}
.form-ok[hidden]{display:none}
.cta .wrap.cta-simple{display:flex;flex-direction:column;align-items:center;text-align:center}
.cta-simple h2{margin:16px auto 0;max-width:20ch}
.cta-simple .lede{margin-left:auto;margin-right:auto}
.cta-simple .row-actions{justify-content:center}

/* rodapé */
.footer{position:relative;z-index:1;border-top:1px solid var(--line);padding:56px 0 40px;background:rgba(0,0,0,.85)}
.foot-grid{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:start}
.footer img{height:30px;width:auto}
.assin{font:600 1rem var(--font-d);margin-top:14px}
.foot-meta{color:var(--text-2);margin-top:8px}
.foot-meta a{color:#fff}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.94rem;color:var(--text-2)}
.foot-nav a:hover{color:#fff}
.foot-small{font-size:.8rem;color:var(--text-2);max-width:72ch;margin-top:28px}

/* cursor */
.dot{position:fixed;left:0;top:0;width:8px;height:8px;background:var(--accent);z-index:101;pointer-events:none;opacity:0;transform:translate(-50%,-50%);transition:width .3s var(--ease-out),height .3s var(--ease-out),opacity .3s;mix-blend-mode:screen}
.dot.big{width:28px;height:28px;opacity:.5}
@media (pointer:fine){.dot.show{opacity:1}}
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* ---------- responsivo das seções ---------- */
@media (max-width:1024px){
  .site-grid{grid-template-columns:1fr}
  .plan-grid{grid-template-columns:1fr 1fr}
  .full{grid-template-columns:1fr;gap:20px}
  .pil-grid{grid-template-columns:1fr;gap:40px}
  .hold-wrap{position:static}
  .tela-insta-grid{grid-template-columns:1fr;gap:40px}
  .foot-grid{grid-template-columns:1fr}
}
@media (max-width:820px){
  .cta .wrap{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:32px}
  .seg{width:100px}
  .search{padding:22px 18px}
  .result h3{font-size:1.1rem}
}
@media (max-width:600px){
  .plan-grid{grid-template-columns:1fr}
  .pil-cards{grid-template-columns:1fr}
  .plan-list.two{grid-template-columns:1fr}
  .form{padding:20px}
  h2{font-size:clamp(1.8rem,8vw,2.4rem)}
  .browser-top{gap:10px}
  .tab{padding:10px 12px;font-size:.8rem}
  .url{font-size:.8rem}
}

/* ---------- o núcleo: segurar pra ligar ---------- */
.pilares::after{content:"";position:absolute;inset:0;background:radial-gradient(55% 55% at 28% 58%,rgba(49,92,255,.2),transparent 70%);opacity:0;transition:opacity 1.4s;pointer-events:none;z-index:0}
.pilares.on::after{opacity:1}
.core{--hp:0;position:relative;width:320px;height:320px;display:grid;place-items:center;isolation:isolate}
.core::before{content:"";position:absolute;inset:-28%;border-radius:50%;background:radial-gradient(circle,rgba(49,92,255,.6),rgba(49,92,255,.14) 42%,transparent 70%);opacity:calc(var(--hp)*.9);transition:opacity .3s;z-index:0;filter:blur(8px);pointer-events:none}
.core.on::before{opacity:1;animation:core-breathe 4.2s ease-in-out infinite}
@keyframes core-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
.core-fx{position:absolute;left:-40%;top:-40%;width:180%;height:180%;z-index:1;pointer-events:none}
.core-rings{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.core-rings .ring{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1;transform-origin:50% 50%;will-change:transform;transition:stroke .4s}
.core-rings .r1{stroke-dasharray:2 9}
.core-rings .r2{stroke:rgba(255,255,255,.1)}
.core-rings .r3{stroke:rgba(49,92,255,.4);stroke-dasharray:58 26}
.core.on .core-rings .ring{stroke:rgba(120,150,255,.45)}
.core-rings .arc{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;stroke-dasharray:854.5;stroke-dashoffset:calc(854.5*(1 - var(--hp)));filter:drop-shadow(0 0 8px rgba(49,92,255,.95));transition:stroke-dashoffset .12s linear}
.core-rings .ticks line{stroke:rgba(255,255,255,.22);stroke-width:1.5;transition:stroke .4s}
.core.holding .core-rings .ticks line{stroke:rgba(157,182,255,.6)}
.core.on .core-rings .ticks line{stroke:var(--accent)}
.core .hold{position:relative;z-index:3;width:168px;height:168px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#1B1E30,#0A0A10 70%);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -30px rgba(0,0,0,.95);cursor:pointer;transition:transform .35s var(--ease-out),border-color .4s,box-shadow .4s}
.core .hold:hover{border-color:rgba(49,92,255,.65);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 26px rgba(49,92,255,.25)}
.core.holding .hold{transform:scale(.955);border-color:rgba(120,150,255,.8)}
.core.on .hold{border-color:rgba(120,150,255,.95);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 44px rgba(49,92,255,.6),0 0 100px rgba(49,92,255,.35);background:radial-gradient(circle at 50% 30%,#1F2A56,#0B0F22 70%)}
.core .hold img{width:84px;height:auto;transition:filter .6s,transform .6s var(--ease-out)}
.core.on .hold img{filter:drop-shadow(0 0 16px rgba(90,128,255,.95));transform:scale(1.06)}
.shock{position:absolute;left:50%;top:50%;width:170px;height:170px;margin:-85px 0 0 -85px;border-radius:50%;border:2px solid rgba(120,150,255,.95);opacity:0;pointer-events:none;z-index:2}
.shock.go{animation:shock 1.15s var(--ease-out) forwards}
.shock.go::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:1px solid rgba(255,255,255,.7);animation:shock 1.5s .14s var(--ease-out) forwards}
@keyframes shock{0%{transform:scale(1);opacity:.95}100%{transform:scale(11);opacity:0}}
.hold-readout{display:inline-flex;align-items:center;gap:10px;min-width:196px;justify-content:center;transition:opacity .5s,border-color .4s,color .4s}
.hold-readout .hr-dot{width:6px;height:6px;border-radius:1px;background:rgba(245,245,242,.4);transition:background .3s,box-shadow .3s}
.hold-wrap.holding .hold-readout{color:#fff;border-color:rgba(49,92,255,.6)}
.hold-wrap.holding .hr-dot{background:var(--accent);box-shadow:0 0 8px var(--accent);animation:online-blink .9s ease-in-out infinite}
.hold-wrap .hold-done{font-size:1.1rem;letter-spacing:-.01em;text-shadow:0 0 22px rgba(49,92,255,.55)}
.pil{transition:border-color .7s,box-shadow .7s,transform .3s var(--ease-out);will-change:transform}
.pil .online{position:absolute;top:22px;right:22px;display:inline-flex;align-items:center;gap:6px;font:400 .6rem var(--font-m);letter-spacing:.16em;text-transform:uppercase;color:var(--text-2);opacity:.4;transition:color .5s,opacity .5s;z-index:2}
.pil .online::before{content:"";width:6px;height:6px;border-radius:50%;background:rgba(155,155,161,.5);transition:background .5s,box-shadow .5s}
.pil.lit .online{color:var(--accent);opacity:1}
.pil.lit .online::before{background:var(--accent);box-shadow:0 0 10px var(--accent);animation:online-blink 2.4s ease-in-out infinite}
@keyframes online-blink{0%,100%{opacity:1}50%{opacity:.3}}
.pil-line .pil-pulse{fill:none;stroke:#B7C8FF;stroke-width:2.5;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:34 1500;stroke-dashoffset:1534;opacity:0;filter:drop-shadow(0 0 6px rgba(49,92,255,1))}
.pil-cards.on .pil-pulse{opacity:1;animation:pulse-travel 2.8s linear infinite}
@keyframes pulse-travel{to{stroke-dashoffset:0}}
@media (max-width:600px){.core{width:260px;height:260px}.core .hold{width:140px;height:140px}.core .hold img{width:70px}}

/* ---------- o trilho: acompanha o site inteiro ---------- */
.rail{position:fixed;left:26px;top:0;bottom:0;width:60px;z-index:49;pointer-events:none}
.rail-line{position:absolute;left:8px;top:104px;bottom:44px;width:1px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.2) 6%,rgba(255,255,255,.2) 94%,transparent)}
.rail-dot{position:absolute;left:4px;top:104px;width:9px;height:9px;border-radius:2px;background:var(--accent);box-shadow:0 0 12px var(--accent),0 0 30px rgba(49,92,255,.6);transform:translateY(var(--y,0px));will-change:transform}
.rail-tick{position:absolute;left:0;width:17px;height:1px;background:rgba(255,255,255,.3);pointer-events:auto;cursor:pointer;transition:background .4s}
.rail-tick span{position:absolute;left:26px;top:-7px;font:400 .62rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:rgba(245,245,242,.42);white-space:nowrap;transition:color .3s}
.rail-tick:hover span{color:#fff}
.rail-tick.passed{background:var(--accent);box-shadow:0 0 8px rgba(49,92,255,.6)}
.rail-tick.passed span{color:var(--accent)}
@media (max-width:1439px){.rail-tick span{display:none}.rail{left:12px;width:24px}.rail-tick{width:11px}}
@media (max-width:900px){.rail{left:8px;width:18px}.rail-line{top:96px;bottom:24px}.rail-dot{top:96px;width:7px;height:7px;left:5px}.rail-tick{width:9px;left:1px}}

/* ---------- canais: WhatsApp e Instagram com as logos e vida própria ---------- */
.canais{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px}
.canais.stack{grid-template-columns:1fr;max-width:470px;margin-top:22px;gap:12px}
.canal{--c:#fff;--c-soft:rgba(255,255,255,.08);--c-glow:rgba(255,255,255,.2);position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:20px 22px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -40px rgba(0,0,0,.9);transition:border-color .5s,box-shadow .5s,transform .35s var(--ease-out);overflow:hidden;isolation:isolate;will-change:transform;color:#fff}
.canal-wa{--c:#25D366;--c-soft:rgba(37,211,102,.16);--c-glow:rgba(37,211,102,.38)}
.canal-ig{--c:#E1306C;--c-soft:rgba(225,48,108,.14);--c-glow:rgba(225,48,108,.34)}
.canal::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 90% at 0% 50%,var(--c-soft),transparent 70%);opacity:0;transition:opacity .6s;z-index:-1}
.canal:hover::before,.canal.live::before{opacity:1}
.canal:hover,.canal.live{border-color:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 44px -8px var(--c-glow),0 30px 60px -40px rgba(0,0,0,.9)}
.canal:hover{transform:translateY(-2px)}
.canal-ico{position:relative;width:64px;height:64px;border-radius:19px;display:grid;place-items:center;background:#0A0A10;border:1px solid rgba(255,255,255,.12);color:#fff;transition:color .5s,border-color .5s,background .5s;flex:none}
.canal-ico .ico{width:32px;height:32px;position:relative;z-index:1;grid-area:1/1;transition:opacity .5s}
.canal-wa .ico{fill:currentColor}
.canal-ig .ico{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.canal-ig .ico .pt{fill:currentColor;stroke:none}
.canal-ig .ico.color{stroke:url(#igg);opacity:0}
.canal-ig .ico.color .pt{fill:url(#igg)}
.canal-ig:hover .ico.color,.canal-ig.live .ico.color{opacity:1}
.canal-ig:hover .ico.mono,.canal-ig.live .ico.mono{opacity:0}
.canal:hover .canal-ico,.canal.live .canal-ico{color:var(--c);border-color:rgba(255,255,255,.22);background:#0D0F12}
.canal-wa:hover .ico,.canal-wa.live .ico{animation:wa-ring .75s ease-in-out 1}
@keyframes wa-ring{0%,100%{transform:rotate(0)}15%{transform:rotate(-14deg)}30%{transform:rotate(12deg)}45%{transform:rotate(-9deg)}60%{transform:rotate(7deg)}75%{transform:rotate(-3deg)}}
.canal-ring{position:absolute;inset:-1px;border-radius:19px;pointer-events:none}
.canal-wa .canal-ring{--pulse:.22;border:1.5px solid var(--c);opacity:0;animation:wa-pulse 2.6s ease-out infinite}
.canal-wa .canal-ring::after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1.5px solid var(--c);animation:wa-pulse 2.6s .9s ease-out infinite}
.canal-wa:hover .canal-ring,.canal-wa.live .canal-ring{--pulse:.85}
@keyframes wa-pulse{0%{transform:scale(1);opacity:var(--pulse)}100%{transform:scale(1.5);opacity:0}}
.canal-ig .canal-ring{inset:-4px;border-radius:22px;padding:2px;background:conic-gradient(from var(--ang),#F58529,#DD2A7B,#8134AF,#515BD4,#F58529);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.3;animation:ig-spin 7s linear infinite;transition:opacity .5s}
.canal-ig:hover .canal-ring,.canal-ig.live .canal-ring{opacity:1;animation-duration:2.4s}
@keyframes ig-spin{to{--ang:360deg}}
.canal-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.canal-k{font:400 .64rem var(--font-m);letter-spacing:.16em;text-transform:uppercase;color:var(--text-2)}
.canal-t{font:600 1.08rem var(--font-d);letter-spacing:-.02em;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat{display:flex;flex-direction:column;gap:5px;margin-top:8px;min-height:62px}
.bub{width:max-content;max-width:100%;padding:6px 10px;border-radius:12px;font:400 .78rem/1.3 var(--font-b);opacity:0;transform:translateY(6px) scale(.96);transform-origin:0 100%}
.bub.me{align-self:flex-end;background:rgba(37,211,102,.22);color:#DFFBEA;border-bottom-right-radius:4px;transform-origin:100% 100%}
.you-slot{display:grid;justify-items:start}
.you-slot .bub{grid-area:1/1;background:rgba(255,255,255,.09);color:#fff;border-bottom-left-radius:4px;min-height:27px;display:inline-flex;align-items:center}
.typing{display:inline-flex;gap:3px;align-items:center;height:12px}
.typing i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.65);animation:typing 1s ease-in-out infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes typing{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-3px);opacity:1}}
.canal.played .bub.me,.canal.played .bub.rep{opacity:1;transform:none}
.canal.played .st-bars i::after{transform:scaleX(1)}
.canal.live .bub.me{animation:bub-in .45s var(--ease-out) .15s forwards}
.canal.live .bub.typ{animation:bub-in .45s var(--ease-out) .8s forwards,bub-out .3s ease-in 2.2s forwards}
.canal.live .bub.rep{animation:bub-in .45s var(--ease-out) 2.35s forwards}
@keyframes bub-in{to{opacity:1;transform:none}}
@keyframes bub-out{to{opacity:0;transform:scale(.9)}}
.st-bars{display:flex;gap:4px;margin-top:9px}
.st-bars i{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.14);overflow:hidden;position:relative}
.st-bars i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:0 50%}
.canal-ig.live .st-bars i:nth-child(1)::after{animation:story-fill 1.1s linear .1s forwards}
.canal-ig.live .st-bars i:nth-child(2)::after{animation:story-fill 1.1s linear 1.2s forwards}
.canal-ig.live .st-bars i:nth-child(3)::after{animation:story-fill 1.1s linear 2.3s forwards}
@keyframes story-fill{to{transform:scaleX(1)}}
.canal-sub{font-size:.82rem;color:var(--text-2);margin-top:6px}
.hearts{position:absolute;inset:0;pointer-events:none;z-index:2}
.hearts i{--hx:0px;position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4px 0 0 -4px;background:#E1306C;transform:rotate(45deg);opacity:0}
.hearts i::before,.hearts i::after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:inherit}
.hearts i::before{left:-4.5px}.hearts i::after{top:-4.5px}
.canal-ig.live .hearts i{animation:heart-up 1.7s ease-out forwards}
.canal-ig.live .hearts i:nth-child(2){animation-delay:.22s;--hx:14px;background:#F58529}
.canal-ig.live .hearts i:nth-child(3){animation-delay:.48s;--hx:-12px;background:#8134AF}
.canal-ig.live .hearts i:nth-child(4){animation-delay:.7s;--hx:6px;background:#DD2A7B}
@keyframes heart-up{0%{opacity:0;transform:translate(0,0) rotate(45deg) scale(.4)}18%{opacity:1}100%{opacity:0;transform:translate(var(--hx),-64px) rotate(45deg) scale(1)}}
.canal-go{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.16);display:grid;place-items:center;color:#fff;transition:background .4s,border-color .4s,transform .4s var(--ease-out);flex:none}
.canal-go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.canal:hover .canal-go,.canal.live .canal-go{background:var(--c);border-color:var(--c);transform:translateX(3px)}
.foot-meta a{display:inline-flex;align-items:center;gap:7px;transition:color .3s}
.foot-meta svg{width:15px;height:15px}
.foot-meta .fi-wa{fill:currentColor}
.foot-meta .fi-ig{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.foot-meta .fi-ig .pt{fill:currentColor;stroke:none}
.foot-meta a:hover{color:#fff}
.foot-meta a.f-wa:hover{color:#25D366}
.foot-meta a.f-ig:hover{color:#E1306C}
@media (max-width:820px){.canais{grid-template-columns:1fr}.canal{padding:16px;gap:14px}.canal-ico{width:56px;height:56px;border-radius:17px}.canal-ico .ico{width:28px;height:28px}.canal-ring{border-radius:17px}.canal-ig .canal-ring{border-radius:20px}}

/* ---------- prévia da marca: o quadro (página) e a chamada (home) ---------- */
.zoomin{transition-delay:var(--d,0s)}
.zoomin.in.settled{transition-delay:0s}
.pv{--p-accent:#315CFF;--p-deep:#2646C9;--p-soft:#8FA6FF;--p-sec:#31B4FF;--p-bg:#0B0B0D;--p-surface:#15161C;--p-text:#F5F5F2;--p-text-2:rgba(245,245,242,.7);--p-on-accent:#fff;--p-font:'Sora',system-ui,sans-serif;--p-font-b:'Inter',system-ui,sans-serif;--p-fs:normal;--p-grad:linear-gradient(135deg,#315CFF,#2646C9);display:grid;grid-template-columns:372px minmax(0,1fr);gap:clamp(22px,3vw,40px);margin-top:48px;align-items:start}
.pv.present{grid-template-columns:minmax(0,1fr)}
.pv.present .pv-panel{display:none}

/* painel de controle */
.pv-panel{position:sticky;top:20px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 40px 80px -50px rgba(0,0,0,.9)}
.pv-sec{display:flex;flex-direction:column;gap:12px}
.pv-sec-t{display:flex;align-items:center;gap:10px;font:600 .8rem var(--font-d);letter-spacing:-.01em;color:#fff;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08)}
.pv-sec-t span{font:400 .62rem var(--font-m);color:var(--accent);letter-spacing:.14em}
.field-l{font:400 .72rem var(--font-m);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.pv-drop{display:flex;align-items:center;gap:12px;padding:10px;border:1px dashed rgba(255,255,255,.24);border-radius:12px;cursor:pointer;transition:border-color .3s,background .3s;position:relative}
.pv-drop:hover,.pv-drop.over{border-color:var(--accent);background:rgba(49,92,255,.08)}
.pv-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.pv-drop-t{display:flex;flex-direction:column;gap:2px;font-size:.86rem;min-width:0}
.pv-drop-t b{font-weight:500;color:#fff}
.pv-drop-t small{color:var(--text-2);font-size:.76rem}
.pv-avatar{width:46px;height:46px;border-radius:12px;background:var(--p-bg,#000);transition:background .5s;display:grid;place-items:center;overflow:hidden;font:700 .95rem var(--font-d);color:#fff;flex:none;border:1px solid var(--line-strong)}
.pv-avatar img{width:100%;height:100%;object-fit:contain}
.pv-avatar i{font-style:normal}
.pv-colors{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pv-color{position:relative;display:flex;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:12px;cursor:pointer;background:rgba(0,0,0,.4);transition:border-color .3s}
.pv-color:hover{border-color:rgba(255,255,255,.3)}
.pv-color input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.pv-color-chip{width:34px;height:34px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 0 0 3px rgba(255,255,255,.06);transition:background .4s}
.pv-color-t{display:flex;flex-direction:column;font-size:.8rem;line-height:1.25;min-width:0}
.pv-color-t b{font-weight:500;color:#fff}
.pv-color-t code{font:400 .68rem var(--font-m);color:var(--text-2)}
.swatches{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.swatch{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .25s var(--ease-out),border-color .25s,box-shadow .25s;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);position:relative}
.swatch:hover{transform:scale(1.12)}
.swatch.on{border-color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.4),0 0 18px rgba(255,255,255,.25)}
.pv-seg{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:10px;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.12)}
.pv-seg-b{padding:8px 10px;border-radius:8px;font:500 .84rem var(--font-b);color:var(--text-2);transition:background .3s,color .3s}
.pv-seg-b.on{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.fonts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.font-b{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.4);font:400 .64rem var(--font-b);color:var(--text-2);transition:border-color .3s,color .3s,background .3s}
.font-b span{font-size:1.35rem;line-height:1;color:#fff}
.font-b[data-font=moderna] span{font-family:var(--font-d);font-weight:700}
.font-b[data-font=serif] span{font-family:var(--font-s);font-style:italic;font-size:1.55rem}
.font-b[data-font=neutra] span{font-family:var(--font-b);font-weight:600}
.font-b[data-font=tecnica] span{font-family:var(--font-m)}
.font-b:hover{border-color:rgba(255,255,255,.3)}
.font-b.on{border-color:var(--accent);background:rgba(49,92,255,.12);color:#fff}
.pv-note{font-size:.8rem;color:var(--text-2)}

/* o quadro */
.pv-board{min-width:0}
.pv-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.pv-live{display:inline-flex;align-items:center;gap:8px}
.pv-live i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent);animation:online-blink 2s ease-in-out infinite}
.pv-present{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:9px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);font:500 .84rem var(--font-b);color:#fff;transition:border-color .3s,background .3s}
.pv-present:hover{border-color:var(--accent);background:rgba(49,92,255,.14)}
.pv-present svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.stage{--px:0;--py:0;position:relative;border-radius:22px;padding:clamp(14px,2vw,22px);background:#07070A;border:1px solid rgba(255,255,255,.08);overflow:hidden;transform:perspective(1800px) rotateX(calc(var(--py)*-1.4deg)) rotateY(calc(var(--px)*2deg));transition:transform .6s var(--ease-out)}
.stage-light{position:absolute;inset:-25%;background:radial-gradient(38% 42% at 24% 18%,var(--p-accent),transparent 70%),radial-gradient(30% 34% at 82% 84%,var(--p-sec),transparent 70%);opacity:.2;filter:blur(48px);transition:background .8s,opacity .8s;pointer-events:none}
.stage.light-bg .stage-light{opacity:.15}
.sweep{position:absolute;inset:-10%;background:linear-gradient(112deg,transparent 35%,rgba(255,255,255,.13) 50%,transparent 65%);transform:translateX(-110%);pointer-events:none;z-index:6;opacity:0}
.stage.sweeping .sweep{animation:sweep .95s ease-out 1}
@keyframes sweep{0%{transform:translateX(-110%);opacity:1}100%{transform:translateX(110%);opacity:1}}
.tiles{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(120px,auto);gap:14px;grid-template-areas:"site site site site app app" "site site site site pal pal" "card card card type type type" "post post post ad ad ad" "post post post logo logo logo"}
.tile{position:relative;min-width:0;transform:translate3d(calc(var(--px)*var(--depth,6px)),calc(var(--py)*var(--depth,6px)),0);transition:transform .7s var(--ease-out)}
.t-site{grid-area:site}.t-app{grid-area:app}.t-pal{grid-area:pal}.t-card{grid-area:card}.t-type{grid-area:type}.t-post{grid-area:post}.t-ad{grid-area:ad}.t-logo{grid-area:logo}
.tile-in{position:relative;height:100%;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 60px -40px rgba(0,0,0,.95);padding:14px;display:flex;flex-direction:column;overflow:hidden;transition:border-color .5s,box-shadow .5s,filter .5s,background .6s,color .6s,opacity 1.1s var(--ease-out),transform 1.4s var(--ease-out)}
.tile-in>*{min-width:0}
.tile-tag{position:absolute;left:12px;top:10px;z-index:3;font:400 .58rem var(--font-m);letter-spacing:.16em;text-transform:uppercase;color:rgba(245,245,242,.6);padding:4px 8px;border-radius:6px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.1)}
.tiles.spotlit .tile:not(.spot) .tile-in{opacity:.42;filter:saturate(.6)}
.tiles .tile.spot{z-index:4;transform:translate3d(calc(var(--px)*var(--depth,6px)),calc(var(--py)*var(--depth,6px)),0) scale(1.03)}
.tiles .tile.spot .tile-in{border-color:rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.08),0 0 60px -10px var(--p-accent),0 40px 80px -40px rgba(0,0,0,.95)}
.pv-toast{position:absolute;left:50%;bottom:18px;transform:translate(-50%,10px);padding:8px 14px;border-radius:9px;background:#fff;color:#000;font:500 .8rem var(--font-m);opacity:0;transition:opacity .3s,transform .3s var(--ease-out);z-index:8;pointer-events:none;white-space:nowrap}
.pv-toast.show{opacity:1;transform:translate(-50%,0)}

/* peça: site */
.t-site .tile-in{padding:0;border-radius:14px}
.pv-site{max-width:none;margin:0;border:0;border-radius:0;box-shadow:none;flex:1;display:flex;flex-direction:column;background:#101015}
.pv-site .browser-top{padding:9px 10px 0}
.pv-site .tabs{flex:1}
.pv-site .tab{padding:7px 12px;font-size:.7rem;display:inline-flex;align-items:center;gap:6px;cursor:default;max-width:240px}
.pv-site .tab span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-site .urlbar{padding:7px 10px}
.pv-site .url{min-height:28px;padding:5px 12px;font-size:.68rem}
.favi{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:3px;background:var(--p-accent);color:var(--p-on-accent);font:700 .48rem var(--font-d);overflow:hidden;flex:none;transition:background .5s}
.favi img{width:100%;height:100%;object-fit:contain}
.favi i{font-style:normal}
.pv-site .browser-body{aspect-ratio:auto;flex:1;min-height:260px;background:var(--p-bg);color:var(--p-text);font-family:var(--p-font-b);transition:background .6s,color .6s;display:flex;flex-direction:column}
.pv-glow{position:absolute;right:-12%;top:-30%;width:64%;height:150%;background:radial-gradient(closest-side,var(--p-accent),transparent 70%);opacity:.3;filter:blur(28px);transition:background .6s;pointer-events:none;animation:pv-drift 9s ease-in-out infinite alternate}
@keyframes pv-drift{to{transform:translate(-8%,10%)}}
.pv-nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 18px;font:700 .8rem var(--p-font);font-style:var(--p-fs)}
.pv-nav .pv-logo{display:flex;align-items:center;gap:8px;min-width:0}
.pv-nav .pv-logo>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-nav .pv-logo img{width:22px;height:22px;object-fit:contain;border-radius:5px}
.pv-nav .pv-logo i{width:22px;height:22px;border-radius:5px;background:var(--p-grad);display:grid;place-items:center;font:700 .6rem var(--font-d);color:var(--p-on-accent);font-style:normal;transition:background .5s}
.pv-links{display:flex;align-items:center;gap:12px;font:500 .6rem var(--p-font-b);opacity:.75;flex:none}
.pv-navbtn{padding:5px 9px;border-radius:6px;border:1px solid var(--p-accent);color:var(--p-accent);transition:color .5s,border-color .5s}
.pv-hero{position:relative;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:8px 18px 14px;max-width:66%}
.pv-kicker{font:500 .56rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--p-accent);margin-bottom:8px;transition:color .5s}
.pv-hero h3{font:700 clamp(1.05rem,1.9vw,1.6rem)/1.1 var(--p-font);font-style:var(--p-fs);letter-spacing:-.03em;color:var(--p-text)}
.pv-hero p{margin-top:8px;font:400 .7rem/1.45 var(--p-font-b);color:var(--p-text-2);max-width:34ch}
.pv-btns{display:flex;gap:6px;margin-top:12px}
.pv-btn{display:inline-block;padding:7px 11px;border-radius:6px;background:var(--p-accent);color:var(--p-on-accent);font:500 .62rem var(--p-font-b);transition:background .5s,color .5s}
.pv-btn.ghost{background:transparent;border:1px solid currentColor;color:var(--p-text);opacity:.8}
.pv-cards{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0 18px 16px}
.pv-cards i{display:block;height:36px;border-radius:7px;background:var(--p-surface);border:1px solid rgba(128,128,128,.18);position:relative;transition:background .6s}
.pv-cards i::before{content:"";position:absolute;left:8px;top:8px;width:16px;height:4px;border-radius:2px;background:var(--p-accent);transition:background .5s}
.pv-cards i::after{content:"";position:absolute;left:8px;top:19px;width:60%;height:4px;border-radius:2px;background:currentColor;opacity:.18}

/* peça: ícone */
.t-app .tile-in{align-items:center;justify-content:center;gap:12px;padding-top:32px}
.app{display:flex;flex-direction:column;align-items:center;gap:8px}
.app-ico{width:76px;height:76px;border-radius:22px;background:var(--p-grad);display:grid;place-items:center;box-shadow:0 18px 30px -14px var(--p-accent),inset 0 1px 0 rgba(255,255,255,.3);overflow:hidden;font:700 1.5rem var(--font-d);color:var(--p-on-accent);position:relative;transition:background .6s,box-shadow .6s}
.app-ico::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 55%);pointer-events:none}
.app-ico img{width:76%;height:76%;object-fit:contain}
.app-ico i{font-style:normal}
.app-name{font:500 .7rem var(--font-b);color:#fff;max-width:110px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tabline{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:8px;background:#1C1C24;border:1px solid rgba(255,255,255,.1);font:500 .66rem var(--font-b);color:#fff;max-width:100%}
.tabline span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* peça: paleta */
.t-pal .tile-in{padding-top:34px;gap:8px}
.pal{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;flex:1;min-height:100px}
.pal-c{position:relative;border-radius:8px;background:var(--c);display:flex;align-items:flex-end;justify-content:center;padding:6px 2px;min-height:96px;overflow:hidden;transition:background .5s,transform .3s var(--ease-out);cursor:copy;border:1px solid rgba(255,255,255,.06)}
.pal-c:hover{transform:translateY(-3px)}
.pal-c code{font:500 .5rem var(--font-m);letter-spacing:.04em;color:var(--pc,#fff);writing-mode:vertical-rl;transform:rotate(180deg);opacity:.92}
.pal-hint{font:400 .6rem var(--font-m);letter-spacing:.1em;text-transform:uppercase;color:rgba(245,245,242,.45)}

/* peça: cartão */
.t-card .tile-in{align-items:center;justify-content:center;padding:34px 14px 18px}
.cards{position:relative;width:min(100%,250px);aspect-ratio:1.75/1}
.card{position:absolute;inset:0;border-radius:10px;box-shadow:0 24px 40px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.06);transition:transform .7s var(--ease-out),background .6s,color .6s;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:14px;overflow:hidden;font-style:var(--p-fs)}
.card.back{background:var(--p-surface);color:var(--p-text);transform:translate(15%,-22%) rotate(-7deg);z-index:1;align-items:flex-start;justify-content:space-between;gap:4px;padding-left:20px}
.card.back::after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--p-accent);transition:background .5s}
.card.front{background:var(--p-bg);color:var(--p-text);transform:translate(-8%,12%) rotate(4deg);z-index:2}
.card.front::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 50%,transparent 60%);pointer-events:none}
.t-card .tile-in:hover .card.back{transform:translate(25%,-34%) rotate(-10deg)}
.t-card .tile-in:hover .card.front{transform:translate(-14%,20%) rotate(6deg)}
.card [data-pv=logo] i{width:40px;height:40px;border-radius:10px;background:var(--p-grad);display:grid;place-items:center;font:700 .9rem var(--font-d);color:var(--p-on-accent);font-style:normal;transition:background .5s}
.card [data-pv=logo] img{max-width:96px;max-height:48px;object-fit:contain}
.card.front b{font:700 .78rem var(--p-font);letter-spacing:-.02em;text-align:center}
.card.back b{font:700 .76rem var(--p-font);letter-spacing:-.02em}
.card.back small{font:400 .56rem/1.3 var(--p-font-b);font-style:normal;opacity:.72;max-width:100%}
.card-lines{display:flex;gap:8px;font:400 .48rem var(--font-m);font-style:normal;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.card-lines i{font-style:normal;display:inline-flex;align-items:center;gap:4px}
.card-lines i::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--p-accent);transition:background .5s}

/* peça: tipografia */
.t-type .tile-in{padding:34px 18px 16px;justify-content:flex-end;gap:2px;background:var(--p-surface);color:var(--p-text);border-color:rgba(128,128,128,.22)}
.type-aa{font:700 3.4rem/1 var(--p-font);font-style:var(--p-fs);letter-spacing:-.04em;color:var(--p-accent);transition:color .5s}
.type-name{font:700 1.15rem/1.1 var(--p-font);font-style:var(--p-fs);letter-spacing:-.02em;margin-top:8px}
.t-type p{font:400 .72rem/1.45 var(--p-font-b);color:var(--p-text-2);max-width:30ch;margin-top:4px}
.type-font{margin-top:10px;font:400 .56rem var(--font-m);letter-spacing:.12em;text-transform:uppercase;opacity:.6}

/* peça: post */
.t-post .tile-in{align-items:center;justify-content:center;padding:34px 12px 16px}
.pv-phone{width:min(100%,240px);margin:0 auto;border-width:6px;border-radius:26px}
.pv-phone .ig-top{padding:10px 12px 6px;font-size:.85rem}
.pv-phone .ig-icons{gap:10px}
.pv-phone .ig-icons svg{width:16px;height:16px}
.pv-phone .post{opacity:1;transform:none}
.pv-phone .post-head{padding:8px 10px;gap:8px}
.pv-phone .post-head b{font-size:.76rem}
.pv-phone .post-head span{font-size:.62rem}
.pv-phone .post-head .pv-avatar{width:28px;height:28px;border-radius:50%;font-size:.6rem}
.pv-phone .post-media{background:var(--p-bg);color:var(--p-text);aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:18px;text-align:center;font-family:var(--p-font);font-style:var(--p-fs);transition:background .5s,color .5s;position:relative;overflow:hidden}
.pv-phone .post-media::before{content:"";position:absolute;right:-30%;top:-30%;width:80%;height:80%;background:radial-gradient(closest-side,var(--p-accent),transparent 70%);opacity:.35;filter:blur(18px);transition:background .5s}
.pv-phone .post-media [data-pv=logo] i{display:grid;place-items:center;width:52px;height:52px;border-radius:13px;background:var(--p-grad);color:var(--p-on-accent);font:700 1.1rem var(--font-d);font-style:normal;transition:background .5s;position:relative}
.pv-phone .post-media [data-pv=logo] img{width:56px;height:56px;object-fit:contain;position:relative}
.pv-phone .post-media b{font-size:1.05rem;letter-spacing:-.02em;position:relative}
.pv-phone .post-media small{font-size:.66rem;opacity:.75;position:relative;max-width:22ch;font-style:normal;font-family:var(--p-font-b)}
.pv-phone .post-cta{background:var(--p-accent);color:var(--p-on-accent);padding:8px 10px;font-size:.74rem;transition:background .5s,color .5s}
.pv-phone .post-actions{padding:8px 10px;gap:10px}
.pv-phone .post-actions svg{width:18px;height:18px}
.pv-phone .post-cap{padding:0 10px 12px;font-size:.72rem}
.pv-phone .post-head b,.pv-phone .post-cap b{font-family:var(--font-b)}

/* peça: anúncio */
.t-ad .tile-in{padding:34px 14px 14px}
.pv-ad{max-width:none;margin:0;padding:14px 16px 12px;border-radius:12px;box-shadow:none;flex:1}
.pv-ad .search-box{padding:8px 14px;min-height:36px;font-size:.76rem;margin-bottom:12px;gap:8px}
.pv-ad .search-box svg{width:15px;height:15px}
.pv-ad .search-box span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-ad .ad-tag{font-size:.68rem;margin-bottom:5px}
.pv-ad .r-site{font-size:.7rem;gap:7px}
.pv-ad .fav{width:22px;height:22px;background:var(--p-accent);transition:background .5s;display:grid;place-items:center;color:var(--p-on-accent);font:700 .52rem var(--font-d);border:0;overflow:hidden}
.pv-ad .fav i{font-style:normal}
.pv-ad .fav img{width:100%;height:100%;object-fit:contain;background:#fff}
.pv-ad h3{color:var(--p-accent);font-size:.98rem;margin:4px 0 2px;transition:color .5s}
.pv-ad .desc{font-size:.74rem;line-height:1.45}

/* peça: logo */
.t-logo .tile-in{padding:34px 14px 14px}
.lockups{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:1;min-height:110px}
.lock{border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;text-align:center;transition:background .6s,color .6s;font-style:var(--p-fs)}
.lock.a{background:var(--p-bg);color:var(--p-text);border:1px solid rgba(128,128,128,.22)}
.lock.b{background:var(--p-grad);color:var(--p-on-accent)}
.lock b{font:700 .8rem var(--p-font);font-style:var(--p-fs);letter-spacing:-.02em}
.lock [data-pv=logo] i{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font:700 .85rem var(--font-d);font-style:normal}
.lock.a [data-pv=logo] i{background:var(--p-grad);color:var(--p-on-accent);transition:background .5s}
.lock.b [data-pv=logo] i{background:rgba(255,255,255,.18);color:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.lock img{width:44px;height:44px;object-fit:contain}

.pv-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}
.pv-privacy{font-size:.82rem;color:var(--text-2);max-width:60ch;margin-top:12px}

/* chamada na home: quadro pequeno */
.teaser-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:center;margin-top:48px}
.pv-mini{display:block;margin-top:0}
.pv-mini .stage{padding:12px}
.pv-mini .tiles{grid-template-columns:1fr 1fr;grid-template-areas:"site site" "app card";grid-auto-rows:auto;gap:10px}
.pv-mini .t-site .browser-body{min-height:200px}
.pv-mini .pv-hero{max-width:74%}
.pv-mini .t-app .tile-in,.pv-mini .t-card .tile-in{min-height:180px}
.pv-mini .app-ico{width:64px;height:64px;border-radius:18px;font-size:1.25rem}
.pv-mini .cards{width:min(100%,200px)}
.teaser-tools{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-top:16px}
.teaser-tools .field{flex:1;min-width:170px}
.teaser-tools .field input{padding:10px 12px;font-size:.92rem}
.teaser-tools .swatches{margin-top:0}
.teaser-tools .swatch{width:30px;height:30px}

@media (max-width:1180px){.pv{grid-template-columns:330px minmax(0,1fr)}.fonts{grid-template-columns:repeat(2,1fr)}}
@media (max-width:1024px){.pv{grid-template-columns:minmax(0,1fr)}.pv-panel{position:static}.teaser-grid{grid-template-columns:1fr}.fonts{grid-template-columns:repeat(4,1fr)}}
@media (max-width:700px){.tiles{grid-template-columns:1fr 1fr;grid-template-areas:"site site" "app pal" "card card" "type type" "post post" "ad ad" "logo logo"}.fonts{grid-template-columns:repeat(2,1fr)}.pv-hero{max-width:100%}.pv-links{display:none}.pv-panel{padding:18px}}
@media (max-width:480px){.tiles{grid-template-columns:1fr;grid-template-areas:"site" "app" "pal" "card" "type" "post" "ad" "logo"}.pv-mini .tiles{grid-template-columns:1fr;grid-template-areas:"site" "app" "card"}.pv-colors{grid-template-columns:1fr}.pv-toolbar{flex-direction:column;align-items:flex-start}}

/* ---------- chamada na home: soltar a logo no quadro pequeno ---------- */
.tm-dz{position:relative;flex-basis:100%;display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px dashed rgba(255,255,255,.24);border-radius:10px;cursor:pointer;font-size:.86rem;color:var(--text-2);transition:border-color .3s,background .3s,color .3s,box-shadow .3s;min-height:44px}
.tm-dz:hover,.tm-dz.over{border-color:var(--accent);background:rgba(49,92,255,.08);color:#fff}
.tm-dz.over{border-style:solid;box-shadow:0 0 0 3px rgba(49,92,255,.18)}
.tm-dz svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.tm-dz input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.tm-dz-logo{display:none;width:24px;height:24px;object-fit:contain;border-radius:5px;background:#fff;padding:2px;flex:none}
.tm-dz.has .tm-dz-logo{display:block}
.tm-dz.has svg{display:none}
.tm-dz.has{border-style:solid;border-color:rgba(255,255,255,.3);color:#fff}
.swatch.from-logo::before{content:"";position:absolute;right:-3px;top:-3px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff}
.pv-mini .stage.over{border-color:var(--accent);box-shadow:0 0 0 3px rgba(49,92,255,.2)}
.stage.building .tile{transition:none}

/* ---------- acabamento: títulos equilibrados, slogan no celular, busca com esqueleto ---------- */
.headline-line{text-wrap:balance}
.results:not(.show) .result.sk{opacity:.4;transform:none}
@media (max-width:560px){.slogan{gap:0 8px;font-size:.92rem;margin-top:14px}.slogan a{padding:6px 4px 14px}.slogan a::after{bottom:0}}

/* ---------- celular: menos ar, sem trilho e sem faixas cruzando texto ---------- */
.kicker+h2,.kicker+h1{margin-top:12px}
@media (max-width:900px){
  .rail{display:none}
  .faixa{display:none}
  .sec{padding:56px 0}
  .sec.tight{padding-top:36px}
  .lede{margin-top:14px;font-size:1.04rem}
  .tela .lede{margin-bottom:26px}
  .tela-note{margin-top:20px;font-size:.96rem}
  .pil-grid{margin-top:32px;gap:28px}
  .site-grid,.teaser-grid,.pv{margin-top:32px}
  .plan-grid{margin-top:16px}
  .steps{margin-top:36px;gap:24px}
  .search{padding:18px 14px 16px}
  .results{margin-top:16px;gap:14px}
  .result h3{font-size:1.02rem}
  .result .desc{font-size:.88rem}
  .phone-screen{width:min(300px,100%)}
  .post.sk{display:none}
  .canais{margin-top:22px}
  .pil .online{font-size:.66rem}
  .tag{font-size:.7rem}
  .canal-k{font-size:.68rem}
  .swatch{width:38px;height:38px}
  .foot-meta a,.foot-nav a{padding:6px 0}
  .footer{padding:40px 0 32px}
  .foot-grid{gap:22px}
  .pv-dropzone{margin-top:24px}
}
@media (max-width:600px){
  .dots{display:none}
  .tab{padding:9px 10px;font-size:.78rem}
  .browser-top{padding:8px 8px 0}
}

/* ---------- celular: pilares compactos, planos em carrossel, sites de exemplo na versão celular ---------- */
.plan-hint{display:none;font:400 .62rem var(--font-m);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2);margin-top:4px;align-items:center;gap:8px}
.plan-hint::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent);animation:online-blink 2s ease-in-out infinite}
.results:not(.show) .result.ad{display:none}
@media (max-width:900px){
  .pil{padding:20px 18px}
  .pil .num{font-size:1.4rem;margin-bottom:6px}
  .pil-cards{gap:12px}
  .plan-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 4px 14px;margin:16px -4px 0;scrollbar-width:none}
  .plan-grid::-webkit-scrollbar{display:none}
  .plan-grid .plan{flex:0 0 84%;scroll-snap-align:start}
  .plan-hint{display:inline-flex}
  .plan-grid.two-cols .plan{flex-basis:88%}
}
@media (max-width:600px){.browser-body{aspect-ratio:3/4}}

/* ---------- movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important}
  html{scroll-behavior:auto}
  .appear,.hero-field,.hero h1 em,.phero h1 em,.badge-star{opacity:1;transform:none;clip-path:none;filter:none}
  .badge::before{animation:none}
  .rail-dot{transition:none}
  .reveal,.zoomin{opacity:1;transform:none}
  .faixa path,.seg path{stroke-dashoffset:0}
  .pil-line path{--lp:1}
  .pil{border-color:rgba(49,92,255,.6)}
  .pil .num{color:var(--accent)}
  .pil::after{opacity:1}
  .hold-ring .fill{--hp:1}
  .core{--hp:1}
  .core::before{opacity:1;animation:none}
  .hold-label{display:none}
  .hold-done{opacity:1;transform:none}
  .pil .online{color:var(--accent);opacity:1}
  .pil .online::before{background:var(--accent);animation:none}
  .pil-line .pil-pulse{opacity:0;animation:none}
  .results .result,.story,.post,.browser-body .page.on{opacity:1;transform:none}
  .loadbar{opacity:0}
  .caret{display:none}
  .grain,.env-band{animation:none}
  .dot{display:none}
  .stage,.tile,.tiles .tile.spot{transform:none}
  .sweep,.hearts,.bub.typ,.pv-glow{display:none}
  .bub.me,.bub.rep{opacity:1;transform:none}
  .st-bars i::after{transform:none}
  .canal-wa .canal-ring,.canal-wa .canal-ring::after{opacity:.35;transform:none}
  .canal-ig .canal-ring{opacity:.6}
  .tiles.spotlit .tile:not(.spot) .tile-in{opacity:1;filter:none}
}
