@font-face{font-family:"GSF";src:url(ccb11a8d00.woff2) format("woff2");font-weight:300 800;font-display:swap}
:root{--bg:#F1F0EC;--card:#FFFFFF;--on:#1C1B19;--var:#6B6862;--lin:#E2E0DA;--acc:#E97A30;--acc-t:#B4561A;--accs:#FCEBDD;--plate:#DAD7D1;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--on);font:17px/1.5 "GSF",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
.w{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
section{padding-block:56px}
h1,h2,h3{margin:0;text-wrap:balance;letter-spacing:-.015em}
h2{font-size:clamp(28px,4.6vw,46px);line-height:1.1}
h3{font-size:21px;line-height:1.2}
p{margin:0}
a{color:inherit}
.olho{display:block;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--acc-t);margin-bottom:12px;text-transform:uppercase}
.cab{max-width:780px;margin-bottom:28px;display:flex;flex-direction:column;gap:12px}
.cab p{color:var(--var);font-size:18px}
.fonte{font-size:14px;color:var(--var);margin-top:18px}
.card,.app,.fmt,.post{background:var(--card);border-radius:28px;box-shadow:0 1px 0 rgba(0,0,0,.04),0 14px 30px -22px rgba(40,30,20,.25)}
.bt{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 22px;border-radius:99px;font-weight:600;text-decoration:none;background:var(--acc);color:#fff;border:0;font-size:16px;transition:transform .2s cubic-bezier(.2,.8,.3,1)}
.bt:active{transform:scale(.97)}
.bt svg,.post svg,.pn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.bt.sec{background:var(--bg);color:var(--on)}
.bt.claro{background:var(--card);color:var(--on)}
/* hero */
.hero{padding-block:48px 24px}
.marca{display:flex;align-items:center;gap:14px;font-weight:700;font-size:20px}
.marca img{width:56px;height:56px;border-radius:15px;box-shadow:0 8px 18px -10px rgba(0,0,0,.4)}
.marca span{color:var(--var);font-weight:500}
.hero h1{font-size:clamp(40px,8vw,84px);line-height:1;letter-spacing:-.03em;margin-top:28px}
.hero h1 b{color:var(--acc)}
.hero .sub{font-size:clamp(19px,2.4vw,24px);color:var(--var);margin-top:14px;max-width:620px}
.nums{display:flex;flex-wrap:wrap;gap:18px 48px;margin-top:36px}
.nums div{display:flex;flex-direction:column}
.nums b{font-size:clamp(56px,11vw,112px);line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.nums b i{font-style:normal;color:var(--acc)}
.nums .l{color:var(--var);font-size:17px;margin-top:6px}
.acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.data{font-size:14px;color:var(--var);margin-top:16px}
/* teclado */
.toque{display:grid;grid-template-columns:1fr;gap:24px;align-items:center}
.kb{container-type:inline-size;position:relative;width:100%;aspect-ratio:2160 / 1440;border-radius:26px;overflow:hidden;background:url(ec43a80e95.jpg) 0 0/100% 100% no-repeat;box-shadow:0 30px 60px -36px rgba(0,0,0,.45);touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.kb button{position:absolute;border:0;padding:0;margin:0;cursor:pointer;border-radius:1.6cqw;background:url(ec43a80e95.jpg) no-repeat;background-size:100cqw auto;
  left:calc(var(--x)*1cqw);top:calc(var(--y)*1cqw);width:calc(var(--w)*1cqw);height:calc(var(--h)*1cqw);
  background-position:calc(var(--x)*-1cqw) calc(var(--y)*-1cqw);transition:transform .09s ease-out,filter .09s}
.kb button.on{transform:translateY(.45cqw) scale(.985);filter:brightness(.93)}
.kb button:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.dica{display:flex;align-items:center;gap:10px;color:var(--var);font-size:15px;margin-top:14px}
.dica i{width:10px;height:10px;border-radius:50%;background:var(--acc);flex:none}
/* apps */
.apps{display:grid;grid-template-columns:1fr;gap:18px}
.app{padding:26px;display:flex;flex-direction:column;gap:18px}
.ah{display:flex;gap:14px;align-items:center}
.ah img{width:60px;height:60px;border-radius:16px}
.tag{display:inline-block;margin-top:4px;font-size:13px;font-weight:600;background:var(--accs);color:var(--acc-t);border-radius:99px;padding:2px 11px}
.am{display:flex;gap:26px}
.am div{display:flex;flex-direction:column}
.am b{font-size:30px;letter-spacing:-.02em;line-height:1.1}.am i{font-style:normal;color:var(--acc)}
.am span{font-size:14px;color:var(--var)}
.app p{color:#3A3834;flex:1}
.app .bt{align-self:flex-start}
.faixa{display:inline-flex;gap:8px;align-items:baseline;background:var(--card);border-radius:99px;padding:10px 20px;margin-top:22px;color:var(--var)}
.faixa b{font-size:24px;color:var(--acc-t)}
/* países */
.bars{padding:26px;display:flex;flex-direction:column;gap:16px}
.bars .tt{font-size:14px;color:var(--var);font-weight:600}
.bar{display:grid;grid-template-columns:92px 1fr 64px;gap:14px;align-items:center}
.bar b{text-align:right;font-variant-numeric:tabular-nums}
.tr{height:26px;background:#F1EFEA;border-radius:9px;overflow:hidden}
.tr i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(var(--v));background:#F2B48A;border-radius:9px;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bar:first-of-type .tr i{background:var(--acc)}
.pre .tr i{transform:scaleX(0)}
/* privacidade */
.priv blockquote{margin:0;font-size:clamp(28px,5vw,52px);line-height:1.12;font-weight:700;letter-spacing:-.02em;text-wrap:balance;max-width:900px}
.selo{display:flex;gap:16px;align-items:center;padding:20px 22px;margin-top:28px;max-width:640px}
.selo svg{width:46px;height:46px;flex:none;fill:none;stroke:var(--acc);stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.selo b{display:block}.selo span{color:var(--var);font-size:15px}
.msg{margin-top:22px;font-size:20px;font-weight:600;color:var(--acc-t)}
/* threads */
.perfis{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.perfil{display:flex;gap:12px;align-items:center;background:var(--card);border-radius:99px;padding:8px 20px 8px 8px;text-decoration:none;min-width:0}
.perfil div{min-width:0}.perfil b{display:block}.perfil span{color:var(--var);font-size:14px}
.av{width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center}
.ini{background:#2B2A27;color:#fff;font-weight:700;font-size:14px}
.mural{columns:1;column-gap:16px}
.post{display:block;break-inside:avoid;margin-bottom:16px;padding:18px 20px;text-decoration:none;border-radius:22px;transition:transform .2s cubic-bezier(.2,.8,.3,1),box-shadow .2s}
a.post:hover{transform:translateY(-3px);box-shadow:0 1px 0 rgba(0,0,0,.04),0 20px 34px -22px rgba(40,30,20,.35)}
.ph{display:flex;align-items:center;gap:10px}
.ph .av{width:34px;height:34px}.ph .ini{font-size:12px}
.ph time{color:var(--var);font-size:14px}
.ph svg{margin-left:auto;color:var(--var)}
.post p{margin:10px 0 12px;line-height:1.42}
.pn{display:flex;flex-wrap:wrap;gap:18px;font-size:14px;color:#45433F;font-variant-numeric:tabular-nums}
.pn span{display:flex;align-items:center;gap:5px}
.pn span:first-child{color:var(--acc-t);font-weight:700}
/* formatos */
.fmts{display:grid;grid-template-columns:1fr;gap:16px}
.fmt{padding:24px;display:flex;flex-direction:column;gap:10px;overflow:hidden;transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s}
.fmt p{color:#3A3834}
.nf{width:40px;height:40px;border-radius:12px;background:var(--accs);color:var(--acc-t);font-weight:800;display:grid;place-items:center;transition:transform .35s cubic-bezier(.3,1.6,.5,1),background .25s,color .25s}
.sh{margin-top:8px;height:180px;border-radius:18px;overflow:hidden;background:var(--bg)}
.sh img{width:100%;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.fmt:hover,.fmt:focus-within{transform:translateY(-4px);box-shadow:0 1px 0 rgba(0,0,0,.04),0 24px 40px -24px rgba(40,30,20,.35)}
.fmt:hover .nf{transform:rotate(-8deg) scale(1.08);background:var(--acc);color:#fff}
.fmt:hover .sh img{transform:translateY(-12%)}
/* por que */
.pq{display:grid;grid-template-columns:1fr;gap:16px}
.pq div{padding:24px;font-size:21px;font-weight:700;line-height:1.25;letter-spacing:-.01em}
.pq div:nth-child(2){background:var(--acc);color:#fff}
/* contato */
.ct{background:var(--on);color:#F1F0EC;border-radius:32px;padding:36px 26px;display:flex;flex-direction:column;gap:26px}
.ct h2{color:#fff}
.lin{display:grid;grid-template-columns:1fr;gap:12px}
.lin div{display:flex;flex-direction:column;gap:2px;min-width:0}
.lin span{font-size:13px;color:#A9A59D;font-weight:600}
.lin b{font-size:19px;overflow-wrap:anywhere}
.lin a{text-decoration:none}.lin a:hover{color:var(--acc)}
.redes{display:flex;flex-wrap:wrap;gap:10px}
.redes a{text-decoration:none;border:1.5px solid #4A4844;border-radius:99px;padding:9px 16px;font-size:15px}
.redes a:hover{border-color:var(--acc);color:var(--acc)}
footer{padding-block:28px 48px;color:var(--var);font-size:14px}
/* entrada */
.rv{transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.pre .rv,.rv.pre{opacity:0;transform:translateY(18px)}
@media (min-width:720px){
 section{padding-block:80px}
 .toque{grid-template-columns:5fr 7fr;gap:48px}
 .apps{grid-template-columns:repeat(3,1fr)}
 .mural{columns:2}
 .fmts{grid-template-columns:repeat(3,1fr)}
 .pq{grid-template-columns:repeat(3,1fr)}
 .lin{grid-template-columns:repeat(3,1fr)}
 .ct{padding:56px}
 .bar{grid-template-columns:120px 1fr 80px}
}
@media (min-width:1000px){.mural{columns:3}}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{transition-duration:0s!important;animation:none!important}
 .pre .rv,.rv.pre{opacity:1;transform:none}
 .pre .tr i{transform:scaleX(var(--v))}
 .fmt:hover,a.post:hover{transform:none}
 .fmt:hover .sh img{transform:none}
 .kb button.on{transform:none;filter:brightness(.9)}
}