/* Chatss — folha de estilo do site */
:root{
  --void:#0B0F19; --void-2:#0E1320; --ink:#FFFFFF;
  --acc:#FF5A36; --acid:#D4FF2A; --mint:#34E0A1;
  --dim:rgba(255,255,255,.56); --hair:rgba(255,255,255,.10);
  --display:"Bricolage Grotesque",Georgia,serif;
  --body:"Space Grotesk",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--acid);text-decoration:none}
a:hover{color:var(--acc)}
::selection{background:var(--acid);color:var(--void)}
:focus-visible{outline:2px solid var(--acid);outline-offset:3px}
@keyframes float-a{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,-26px,0) rotate(6deg)}}
@keyframes float-b{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(18px,20px,0) rotate(-8deg)}}
@keyframes spin-slow{to{transform:rotate(360deg)}}
@keyframes wa-pulse{0%{transform:scale(1);opacity:.8}70%{transform:scale(1.7);opacity:0}100%{transform:scale(1.7);opacity:0}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.15}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  [data-motion="logo"]{animation:logo-drift 12s ease-in-out infinite!important}
  [data-motion="halo"]{animation:halo 7s ease-in-out infinite!important}
  [data-motion="spin"]{animation:spin-slow 40s linear infinite!important}
  [data-motion="float"]{animation:float-a 11s ease-in-out infinite!important}}
@media (max-width:860px){[data-cursor]{display:none!important}}
@media (max-width:820px){[data-shotsviewer]{grid-template-columns:1fr!important}}
@media (max-width:1024px){[data-hero-logo]{top:auto!important;bottom:clamp(18px,4vh,40px)!important;width:min(46vw,300px)!important;opacity:.5}}
@keyframes logo-drift{0%,100%{transform:translate3d(0,0,0) rotateX(6deg) rotateY(-14deg) rotateZ(-2deg)}50%{transform:translate3d(0,-30px,0) rotateX(-4deg) rotateY(16deg) rotateZ(3deg)}}
@keyframes marquee-run{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes halo{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.7;transform:scale(1.12)}}


/* ---- menu hamburguer (celular) ---- */
@media (max-width:820px){
  [data-menu-toggle]{display:inline-flex!important}
  header nav{position:fixed!important;top:67px;left:0;right:0;flex-direction:column!important;align-items:stretch!important;gap:0!important;overflow:hidden!important;max-height:0;padding:0 clamp(14px,4vw,20px);background:var(--void);border-bottom:1px solid transparent;transition:max-height .38s cubic-bezier(.2,.8,.2,1),padding .38s,border-color .38s;pointer-events:none}
  header[data-open] nav{max-height:340px;padding:8px clamp(14px,4vw,20px) 18px;border-bottom-color:var(--hair);pointer-events:auto}
  header nav a{font-size:12px!important;padding:16px 2px;border-bottom:1px solid var(--hair);color:var(--ink)!important}
  header nav a:last-child{margin-top:14px;border-bottom:0;text-align:center;padding:15px 18px!important;color:var(--void)!important}
  header[data-open] [data-menu-icon] span:nth-child(1){transform:translateY(5.2px) rotate(45deg)}
  header[data-open] [data-menu-icon] span:nth-child(2){opacity:0}
  header[data-open] [data-menu-icon] span:nth-child(3){transform:translateY(-5.2px) rotate(-45deg)}
  [data-hero-kicker] [data-kicker-tail]{display:none}
  #motivo{padding-top:clamp(28px,5vh,48px)!important;padding-bottom:clamp(48px,8vh,80px)!important}
  #motivo>div:first-child{margin-bottom:clamp(28px,5vh,48px)!important}
  #recursos{padding-top:clamp(40px,7vh,70px)!important;padding-bottom:clamp(40px,7vh,70px)!important}
  #recursos>div:first-child{margin-bottom:clamp(22px,4vh,36px)!important}
  #top>div:last-of-type>p{font-size:13px!important;line-height:1.5!important;max-width:none!important;color:rgba(255,255,255,.5)!important}
  #top>div:last-of-type{gap:20px!important;margin-top:22px!important}
}

/* ---- desempenho no celular ---- */
@media (max-width:820px){
  header{backdrop-filter:none!important;background:var(--void)!important}
  [data-hero-video]{display:none!important}
  [data-hero-bg-still]{display:block!important}
  [data-motion="halo"],[data-motion="spin"]{display:none!important}
  [data-hero-logo]{animation:none!important}
  [data-hero-logo] img{animation:none!important;filter:none!important}
  [data-shotsviewer] img,[data-features]>article{box-shadow:none!important}
  [data-float-wa]{box-shadow:none!important}
  [data-float-wa] span:first-child{animation:none!important}
}

/* ---- ajustes de mobile ---- */
@media (max-width:820px){
  header{padding:12px clamp(14px,4vw,20px)!important;gap:10px!important}
  [data-hero-video]{opacity:.18!important}
  [data-hero-logo]{position:absolute!important;top:clamp(72px,9vh,92px)!important;bottom:auto!important;right:clamp(10px,4vw,24px)!important;width:min(40vw,190px)!important;opacity:.42!important}
  #top{padding-top:104px!important;min-height:auto!important}
  #top h1{font-size:clamp(52px,15.5vw,78px)!important;max-width:none;letter-spacing:-.05em!important}
  [data-features]{grid-template-columns:1fr!important}
  [data-features]>article{grid-column:span 1!important;min-height:0!important}
  [data-features] article>div[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [data-shotsviewer]>div:first-child{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);overflow-x:auto;gap:8px!important;padding-bottom:6px;scrollbar-width:none}
  [data-float-wa]{width:54px!important;height:54px!important}
  [data-float-wa] span:nth-child(2){flex:0 0 54px!important;width:54px!important;height:54px!important}
}
@media (max-width:520px){
  #top{padding-left:18px!important;padding-right:18px!important}
  [data-hero-logo]{width:min(34vw,140px)!important;opacity:.34!important}
}

/* estados de hover (convertidos dos atributos do design) */
.hv1:hover{color:var(--ink) !important}
.hv2:hover{color:var(--ink) !important}
.hv3:hover{color:var(--ink) !important}
.hv4:hover{background:var(--acc) !important;color:#fff !important}
.hv5:hover{border-color:rgba(255,255,255,.4) !important;background:rgba(255,255,255,.04) !important}
.hv6:hover{background:rgba(255,255,255,.05) !important}
.hv7:hover{background:rgba(255,255,255,.05) !important}
.hv8:hover{background:rgba(255,255,255,.05) !important}
.hv9:hover{background:rgba(255,255,255,.05) !important}
.hv10:hover{background:rgba(255,255,255,.05) !important}
.hv11:hover{color:var(--acid) !important}
.hv12:hover{color:var(--acid) !important}
.hv13:hover{color:var(--acid) !important}
.hv14:hover{color:var(--acid) !important}
.hv15:hover{color:var(--acid) !important}
.hv16:hover{color:var(--acid) !important}
.hv17:hover{color:var(--ink) !important}
.hv18:hover{color:var(--acid) !important}
.hv19:hover{color:var(--acid) !important}
.hv20:hover{color:var(--ink) !important}
.hv21:hover{color:var(--acid) !important}
.hv22:hover{color:var(--acid) !important}
.hv23:hover{color:var(--ink) !important}
.hv24:hover{color:var(--acid) !important}
.hv25:hover{color:var(--acid) !important}
