/* © 2026 Ex.Teve · todos os direitos reservados.
   Ex.Teve · sistema visual (out/2026). Laranja da marca abre e fecha as páginas; o meio é escuro e calmo.
   Regras: nada de etiqueta em caixa alta em cima de seção, nada de palavra pintada no título, nada de card
   numerado com ícone. Prova (tela de verdade) antes de promessa. Ver PRODUCT.md. */
:root{
  --laranja:#ff5e2b;
  --tinta:#140803;          /* texto e superfícies sobre o laranja */
  --preto:#0b0b0c;
  --sup:#141416;
  --sup2:#1b1b1e;
  --linha:#27272b;
  --tx:#f2efe9;
  --tx2:#a4a19b;            /* 7,9:1 sobre --preto */
  --ease:cubic-bezier(.2207,1,.3613,1);
  --gut:clamp(20px,4vw,56px);
  --larg:1320px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--preto);color:var(--tx);font:400 17px/1.6 'Hanken Grotesk',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.d{font-family:'Bricolage Grotesque',system-ui,sans-serif}
h1,h2,h3{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;text-wrap:balance}
h2{font-size:clamp(36px,4.6vw,60px);line-height:1;letter-spacing:-.03em}
p{text-wrap:pretty}
.wrap{max-width:var(--larg);margin:0 auto;padding:0 var(--gut)}
::selection{background:var(--laranja);color:var(--tinta)}
:focus-visible{outline:2px solid var(--laranja);outline-offset:3px;border-radius:4px}
.laranja :focus-visible{outline-color:var(--tinta)}
.pular{position:absolute;inset-inline-start:12px;top:8px;z-index:30;background:var(--tinta);color:#fff;padding:10px 16px;border-radius:8px;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.pular:focus{clip-path:none;width:auto;height:auto;overflow:visible}

/* ---------- navegação ---------- */
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0}
.marca{display:inline-flex;align-items:center;gap:10px;font-family:'Bricolage Grotesque';font-weight:800;font-size:21px;letter-spacing:-.02em}
.marca svg{width:30px;height:30px}
.nav ul{display:flex;gap:30px;list-style:none;font-size:15px;font-weight:600}
.nav ul a{opacity:.82;transition:opacity .2s}
.nav ul a:hover{opacity:1}
@media(max-width:860px){.nav{flex-wrap:wrap;row-gap:14px}.nav ul{order:3;width:100%;gap:22px;overflow-x:auto;scrollbar-width:none;font-size:14.5px;white-space:nowrap;padding-bottom:2px;contain:inline-size}.nav ul::-webkit-scrollbar{display:none}}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border:0;border-radius:999px;font-weight:700;font-size:15.5px;line-height:1;white-space:nowrap;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s;touch-action:manipulation}
.btn:active{transform:scale(.97)}
.btn-tinta{background:var(--tinta);color:var(--tx)}
.btn-tinta:hover{background:#2a1209}
.btn-laranja{background:var(--laranja);color:var(--tinta)}
.btn-laranja:hover{background:#ff7a4f}
.btn-contorno{border:2px solid currentColor;padding:13px 22px}
.seta{transition:transform .25s var(--ease)}
.btn:hover .seta,.link:hover .seta{transform:translateX(3px)}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--laranja);border-bottom:1px solid transparent;transition:border-color .2s}
.link:hover{border-color:currentColor}

/* ---------- bloco laranja (abre e fecha a página) ---------- */
.laranja{background:var(--laranja);color:var(--tinta)}

/* ---------- Steve ---------- */
.steve{position:relative;width:100%;aspect-ratio:1}
.steve svg{width:100%;height:100%;overflow:visible}
.steve .olho{transition:transform .35s var(--ease)}
.balao{position:absolute;background:var(--tinta);color:var(--tx);font-size:15px;line-height:1.4;padding:12px 15px;border-radius:16px 16px 4px 16px;max-width:220px}

/* ---------- títulos de seção ---------- */
.cabeca{display:grid;grid-template-columns:1fr minmax(0,46ch);gap:24px 56px;align-items:end;margin-bottom:clamp(36px,5vw,64px)}
.cabeca p{color:var(--tx2);font-size:17.5px}
@media(max-width:860px){.cabeca{grid-template-columns:1fr}}

/* ---------- lista de serviços (no lugar de card numerado) ---------- */
.lista{border-top:1px solid var(--linha)}
.item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) auto;gap:20px 48px;align-items:baseline;padding:clamp(22px,2.6vw,32px) 0;border-bottom:1px solid var(--linha)}
.item h3{font-size:clamp(24px,2.5vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.item p{color:var(--tx2);max-width:58ch}
.item .link{justify-self:end;font-size:15px}
@media(max-width:860px){.item{grid-template-columns:1fr;gap:10px}.item .link{justify-self:start}}

/* ---------- mídia dos cases ---------- */
.midia{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--sup)}
.midia video,.midia img,.midia iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.legenda{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 16px;margin-top:14px}
.legenda h3{font-size:clamp(20px,1.9vw,25px);font-weight:700;letter-spacing:-.015em}
.legenda span{color:var(--tx2);font-size:14.5px;white-space:nowrap}
.case p{color:var(--tx2);font-size:16px;margin-top:6px;max-width:56ch}
.case .link{margin-top:10px;font-size:15px}

/* ---------- etapas (sequência real, aqui o número informa) ---------- */
.etapas{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:etapa;list-style:none}
.etapas li{position:relative;padding:28px 28px 0 0;border-top:2px solid var(--linha)}
.etapas li::before{counter-increment:etapa;content:counter(etapa);position:absolute;top:-17px;left:0;width:32px;height:32px;border-radius:50%;background:var(--preto);border:2px solid var(--laranja);color:var(--laranja);font:800 14px/28px 'Bricolage Grotesque';text-align:center}
.etapas h3{font-size:22px;font-weight:700;letter-spacing:-.01em;margin:6px 0 8px}
.etapas p{color:var(--tx2);font-size:16px;max-width:30ch}
@media(max-width:860px){.etapas{grid-template-columns:1fr 1fr;row-gap:44px}}
@media(max-width:520px){.etapas{grid-template-columns:1fr}}

/* ---------- fecho laranja ---------- */
.fecho{padding:clamp(72px,10vw,128px) 0}
.fecho .grade{display:grid;grid-template-columns:minmax(0,1fr) clamp(140px,16vw,210px);gap:40px;align-items:center}
.fecho h2{font-size:clamp(40px,6vw,80px);letter-spacing:-.035em;max-width:13ch}
.fecho p{font-size:19px;font-weight:500;max-width:48ch;margin-top:18px}
.fecho .acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.fecho .email{margin-top:18px;font-size:15px}
.fecho .email a{border-bottom:2px solid var(--tinta)}
@media(max-width:640px){.fecho .grade{grid-template-columns:1fr}.fecho .steve{width:140px}}

/* ---------- rodapé ---------- */
.rodape{padding:56px 0 36px;border-top:1px solid var(--linha)}
.rodape .topo{display:flex;flex-wrap:wrap;justify-content:space-between;gap:36px}
.rodape .sobre{max-width:34ch;color:var(--tx2);font-size:15px;margin-top:12px}
.rodape .cols{display:flex;flex-wrap:wrap;gap:56px}
.rodape h3{font-family:inherit;font-size:13px;font-weight:600;color:var(--tx2);margin-bottom:12px}
.rodape .cols a{display:block;font-size:15px;margin-bottom:8px;opacity:.9}
.rodape .cols a:hover{color:var(--laranja);opacity:1}
.rodape .fim{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid var(--linha);color:var(--tx2);font-size:13.5px}

/* ---------- movimento: entrada do topo (o conteúdo já nasce visível; só anima se puder) ---------- */
@media (prefers-reduced-motion: no-preference){
  .entra{animation:entra .9s var(--ease) both}
  .entra.d1{animation-delay:.08s}.entra.d2{animation-delay:.18s}.entra.d3{animation-delay:.3s}
  @keyframes entra{from{opacity:0;transform:translateY(18px)}}
  .surge{animation:surge 1s var(--ease) .25s both}
  @keyframes surge{from{opacity:0;transform:scale(.86) rotate(-6deg)}}
}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.btn,.seta,.steve .olho{transition:none}}

/* Steve: cores por contexto, piscar e piscadela */
.steve{--corpo:var(--tinta);--rosto:var(--laranja)}
.steve.claro{--corpo:var(--laranja);--rosto:var(--tinta)}
.steve .corpo{fill:var(--corpo)}
.steve .rosto{fill:var(--rosto)}
.steve .boca,.steve .fecha{stroke:var(--rosto);fill:none;stroke-linecap:round}
.steve .olho circle{transform-box:fill-box;transform-origin:center;transition:transform .12s ease-out,opacity .12s}
.steve.pisca .olho circle{transform:scaleY(.12)}
.steve .fecha{opacity:0;transition:opacity .12s}
.steve.piscadela .olho-esq circle{opacity:0}
.steve.piscadela .fecha{opacity:1}

/* destino de atalho (site.js): o trecho onde a pessoa caiu acende em laranja por uns segundos */
article[id]{scroll-margin-top:40px}
.destino{border-radius:10px;animation:destino 4.6s var(--ease) both}
.destino :is(h2,h3){animation:destino-tx 4.6s var(--ease) both}
@keyframes destino{8%,70%{background-color:rgba(255,94,43,.13);box-shadow:0 0 0 clamp(10px,1.4vw,16px) rgba(255,94,43,.13)}}
@keyframes destino-tx{8%,70%{color:var(--laranja)}}
.laranja .destino{animation-name:destino-escuro}.laranja .destino :is(h2,h3){animation:none}
@keyframes destino-escuro{8%,70%{background-color:rgba(20,8,3,.1);box-shadow:0 0 0 clamp(10px,1.4vw,16px) rgba(20,8,3,.1)}}
@media (prefers-reduced-motion:reduce){.destino,.destino :is(h2,h3){animation-timing-function:steps(1,end)}}
/* serviços em grade com imagem (home e minecraft) */
.srv-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,2.4vw,32px)}
.srv{display:block;color:inherit;text-decoration:none}
.srv .midia{margin-bottom:16px}
.srv .midia img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s var(--ease)}
.srv:hover .midia img{transform:scale(1.03)}
.srv h3{font-size:22px;font-weight:700;letter-spacing:-.01em;line-height:1.15}
.srv p{color:var(--tx2);font-size:15.5px;margin:6px 0 10px;max-width:40ch}
.srv .link{font-size:15px}
.srv-extra{margin-top:clamp(28px,3vw,40px);padding-top:20px;border-top:1px solid var(--linha);color:var(--tx2);font-size:15px}
.srv-extra b{color:var(--tx);font-weight:600}
@media(max-width:860px){.srv-grade{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.srv-grade{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;contain:inline-size;margin:0 calc(-1*var(--gut));padding:0 var(--gut) 4px;scroll-padding-inline:var(--gut)}.srv-grade::-webkit-scrollbar{display:none}.srv{scroll-snap-align:start}}
@media(max-width:480px){.nav-acoes{gap:8px}.nav .insta{width:40px;height:40px;border-radius:11px}.nav-acoes .btn{padding-left:14px;padding-right:14px;font-size:14px}}
@media (prefers-reduced-motion:reduce){.srv .midia img{transition:none}}
/* Instagram no topo, ao lado do botão de orçamento */
.nav-acoes{display:flex;align-items:center;gap:12px}
.nav .insta{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;border:1.5px solid currentColor;color:inherit;transition:background-color .2s,color .2s}
.nav .insta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}
.nav .insta .ponto{fill:currentColor;stroke:none}
.nav .insta:hover{background:var(--laranja);border-color:var(--laranja);color:#140803}
/* vídeo dos cases ampliado: botão por cima do card e a vista que cresce dele */
.ampliar{position:absolute;inset:0;z-index:2;border:0;padding:0;background:none;cursor:zoom-in;border-radius:inherit}
.ampliar .ico-amp{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(11,11,12,.72);color:var(--tx);opacity:0;transform:translateY(4px);transition:opacity .25s var(--ease),transform .25s var(--ease)}
.ampliar .ico-amp svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ampliar:hover .ico-amp,.ampliar:focus-visible .ico-amp{opacity:1;transform:none}
@media (hover:none){.ampliar .ico-amp{opacity:1;transform:none}}
.ampliar:focus-visible{outline:2px solid var(--laranja);outline-offset:3px}
.vista{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:clamp(16px,4vw,48px);background:rgba(11,11,12,.9);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);overscroll-behavior:contain;cursor:zoom-out}
.vista[hidden]{display:none}
.vista figure{margin:0;width:min(100%,calc((100svh - 190px) * 1.6));display:grid;gap:16px;cursor:auto}
.vista .quadro{position:relative;border-radius:14px;overflow:hidden;background:var(--sup);box-shadow:0 30px 80px -30px rgba(0,0,0,.8);transform-origin:0 0}
.vista video{display:block;width:100%;height:auto;max-height:calc(100svh - 190px);object-fit:contain;background:#000}
.vista figcaption{max-width:70ch}
.vista figcaption h3{font-size:clamp(20px,2.2vw,26px);margin-bottom:6px}
.vista figcaption p{color:var(--tx2);font-size:16px;line-height:1.55}
.vista .fechar{position:absolute;top:clamp(10px,2vw,20px);right:clamp(10px,2vw,20px);width:44px;height:44px;display:grid;place-items:center;border-radius:50%;border:1.5px solid rgba(242,239,233,.35);background:rgba(11,11,12,.6);color:var(--tx);cursor:pointer;transition:background-color .2s,border-color .2s}
.vista .fechar:hover{background:var(--laranja);border-color:var(--laranja);color:var(--tinta)}
.vista .fechar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
html.travado,html.travado body{overflow:hidden}
/* tela grande: a página cresce junto em vez de sobrar vazio dos lados (regra do Pedro, 16/10).
   A vista do vídeo ampliado desfaz o zoom pra continuar do tamanho da tela. */
@media (min-width:1800px){html{zoom:1.1}.vista{zoom:.909}}
@media (min-width:2100px){html{zoom:1.25}.vista{zoom:.8}}
@media (min-width:2400px){html{zoom:1.4}.vista{zoom:.714}}
@media (min-width:2800px){html{zoom:1.6}.vista{zoom:.625}}
@media (min-width:3400px){html{zoom:1.9}.vista{zoom:.526}}
/* ---------- Steve que passeia pelo site e anota o pedido (steve.js) ---------- */
/* Fica acima da página e abaixo do vídeo ampliado. A conversa cresce junto com a página em tela grande. */
.stv-camada{position:absolute;left:0;top:0;width:0;height:0;z-index:60}
.stv-sonda{position:absolute;left:0;top:0;width:100px;height:1px;visibility:hidden;pointer-events:none}
.stv-ator{position:absolute;left:0;top:0;width:46px;height:46px;transform-origin:0 0;transition:opacity .25s,visibility .25s}
.stv-ator[data-oculto]{opacity:0;visibility:hidden}
.stv{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:none;border-radius:14px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.stv-corpo{position:relative;display:block;width:100%;height:100%;transform-origin:50% 100%}
.stv{perspective:220px}
.stv-corpo.anda{animation:stv-anda .28s ease-in-out infinite alternate}
@keyframes stv-anda{to{transform:translateY(-3px) rotate(5deg)}}
.stv svg,.stv-aviso-rosto svg{width:100%;height:100%;overflow:visible}
.stv-pele{fill:var(--laranja)}
.stv-olhar{transition:transform .3s var(--ease)}
.stv-olhar,.stv-olhos,.stv-b-bocejo{transform-box:fill-box;transform-origin:center}
.stv-olhos circle{fill:var(--tinta);transform-box:fill-box;transform-origin:center;transition:transform .12s}
.stv-boca{fill:none;stroke:var(--tinta);stroke-width:11;stroke-linecap:round}
.stv.pisca .stv-olhos circle{transform:scaleY(.12)}
.stv-feliz path,.stv-sono path,.stv-b-reta{fill:none;stroke:var(--tinta);stroke-linecap:round}
.stv-feliz path{stroke-width:11}.stv-sono path{stroke-width:9}.stv-b-reta{stroke-width:10}
.stv-b-assobio,.stv-b-bocejo,.stv-b-aberta{fill:var(--tinta)}
.stv-rubor{fill:#d8341f;opacity:0;transition:opacity .2s}
.stv-olhos,.stv-boca,.stv-feliz,.stv-sono,.stv-b-assobio,.stv-b-bocejo,.stv-b-reta,.stv-b-aberta{transition:opacity .14s}
.stv-feliz,.stv-sono,.stv-b-assobio,.stv-b-bocejo,.stv-b-reta,.stv-b-aberta{opacity:0}
.stv[data-olhos] .stv-olhos,.stv[data-boca] .stv-boca{opacity:0}
.stv[data-olhos=feliz] .stv-feliz,.stv[data-olhos=sono] .stv-sono,.stv[data-boca=assobio] .stv-b-assobio,.stv[data-boca=bocejo] .stv-b-bocejo,.stv[data-boca=reta] .stv-b-reta,.stv[data-boca=aberta] .stv-b-aberta{opacity:1}
.stv[data-rubor] .stv-rubor{opacity:.55}.stv-aro{fill:none;stroke:#c9431a;stroke-width:7;opacity:0}.stv-verso{opacity:0}.stv-verso path{fill:none;stroke:#c9431a;stroke-width:16;stroke-linecap:round;stroke-linejoin:round}.stv-verso circle{fill:#c9431a}.stv-apertados path,.stv-tontos path,.stv-b-curta,.stv-b-onda{fill:none;stroke:var(--tinta);stroke-linecap:round;stroke-linejoin:round}.stv-apertados path{stroke-width:9}.stv-tontos path{stroke-width:5.5}.stv-b-curta{stroke-width:10}.stv-b-onda{stroke-width:9}.stv-apertados,.stv-tontos,.stv-b-curta,.stv-b-onda{opacity:0;transition:opacity .14s}.stv[data-olhos=aperto] .stv-apertados,.stv[data-olhos=tonto] .stv-tontos,.stv[data-boca=curta] .stv-b-curta,.stv[data-boca=onda] .stv-b-onda{opacity:1}.stv-estrela{fill:#ffd34d;opacity:0}
.stv-extras{position:absolute;inset:0;pointer-events:none}
.stv-x{position:absolute;left:0;top:0;pointer-events:none}
.stv-nota-m{width:13px;height:17px;color:var(--tx)}.stv-nota-m.quente{color:#ffb59c}.stv-nota-m svg{width:100%;height:100%;display:block}
.stv-z{font:800 13px/1 'Bricolage Grotesque',system-ui,sans-serif;color:#ffb59c}
.stv-susto{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--tx);color:var(--tinta);font:800 14px/1 'Bricolage Grotesque',system-ui,sans-serif}
.stv-bola{border-radius:50%;background:var(--tx);box-shadow:inset -2px -2px 0 #d8d3cb}
.stv-gota{width:8px;height:11px;background:#7cc4ff;border-radius:50% 50% 50% 50%/62% 62% 38% 38%}
.stv-fala{position:absolute;bottom:calc(100% + 10px);left:-6px;width:max-content;max-width:min(250px,calc(100vw - 40px));padding:10px 13px;border:0;border-radius:14px 14px 14px 4px;background:var(--tx);color:var(--tinta);font:600 14.5px/1.35 'Hanken Grotesk',system-ui,sans-serif;text-align:left;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(6px) scale(.94);transform-origin:12px 100%;transition:opacity .2s,visibility .2s,transform .32s cubic-bezier(.3,1.5,.5,1);box-shadow:0 12px 30px -12px rgba(0,0,0,.65)}
.stv-fala.dir{left:auto;right:-6px;border-radius:14px 14px 4px 14px;transform-origin:calc(100% - 12px) 100%}
.stv-fala.on{opacity:1;visibility:visible;transform:none}
.stv-fala:hover{background:#fff}
.stv-chamar{position:absolute;inset:6%;z-index:1;padding:0;border:0;background:none;border-radius:24%;cursor:pointer}
.stv-chat{position:fixed;right:20px;bottom:calc(20px + var(--teclado,0px));z-index:70;width:min(380px,calc(100vw - 32px));max-height:min(600px,calc(100svh - 110px - var(--teclado,0px)));display:flex;flex-direction:column;background:var(--sup);border:1px solid var(--linha);border-radius:20px;box-shadow:0 30px 70px -24px rgba(0,0,0,.75);font-size:15px;outline:none}
.stv-chat[hidden]{display:none}
.stv-vaga{position:absolute;left:22px;top:-44px;width:46px;height:46px}
.stv-topo{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 14px 10px 20px}
.stv-topo p{font-size:14px;line-height:1.35;color:var(--tx2)}
.stv-topo strong{display:block;margin-bottom:2px;font:800 19px/1.1 'Bricolage Grotesque',system-ui,sans-serif;color:var(--tx)}
.stv-fechar{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--linha);background:none;color:var(--tx);cursor:pointer;transition:background-color .15s}
.stv-fechar:hover{background:var(--sup2)}
.stv-fechar svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.stv-msgs{flex:1 1 auto;min-height:120px;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:4px 20px 6px;scrollbar-width:thin}
.stv-m{max-width:86%;padding:9px 13px;border-radius:16px;line-height:1.42;overflow-wrap:anywhere}
.stv-m.ele{align-self:flex-start;background:var(--sup2);border-bottom-left-radius:5px}
.stv-m.eu{align-self:flex-end;background:var(--laranja);color:var(--tinta);font-weight:600;border-bottom-right-radius:5px}
.stv-digita{display:flex;gap:4px;padding:13px 14px}
.stv-digita i{width:6px;height:6px;border-radius:50%;background:var(--tx2);animation:stv-ponto 1s ease-in-out infinite}
.stv-digita i:nth-child(2){animation-delay:.15s}.stv-digita i:nth-child(3){animation-delay:.3s}
@keyframes stv-ponto{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.stv-acoes{display:flex;flex-wrap:wrap;gap:8px;padding:10px 20px 4px}
.stv-acoes:empty{display:none}
.stv-op{padding:8px 14px;border-radius:999px;border:1.5px solid var(--linha);background:var(--preto);font-size:14.5px;font-weight:600;line-height:1.2;cursor:pointer;touch-action:manipulation;transition:border-color .15s,transform .15s}
.stv-op:hover{border-color:var(--laranja)}
.stv-op:active{transform:scale(.97)}
.stv-pular{border-style:dashed;color:var(--tx2);font-weight:500}
.stv-texto{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end;width:100%}
.stv-texto textarea{width:100%;min-height:48px;max-height:120px;resize:none;padding:11px 13px;border-radius:14px;border:1.5px solid var(--linha);background:var(--preto);font-size:16px;line-height:1.35}
.stv-texto textarea:focus{outline:none;border-color:var(--laranja)}
.stv-texto textarea::placeholder{color:#77746f}
.stv-enviar{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:0;background:var(--laranja);color:var(--tinta);cursor:pointer}
.stv-enviar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.stv-erro{grid-column:1/-1;color:#ff9a7a;font-size:13.5px}
.stv-erro:empty{display:none}
.stv-notas{margin:8px 20px 0;padding-top:10px;border-top:1px dashed #3a3a40;font-size:13px;color:var(--tx2)}
.stv-notas[hidden]{display:none}
.stv-lista{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.stv-nota{padding:4px 10px;border-radius:999px;background:#2a1209;color:#ffb59c;font-size:13px;font-weight:600}
.stv-pe{display:grid;justify-items:center;gap:10px;padding:12px 20px 16px}
.stv-pe .btn{width:100%;justify-content:center}
.stv-pe .btn[hidden]{display:none}
.stv-form{font-size:13.5px;color:var(--tx2);border-bottom:1px solid currentColor}
.stv-form:hover{color:var(--tx)}
.stv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.stv-aviso{display:flex;align-items:center;gap:12px;margin-bottom:28px;padding:12px 16px;border-radius:14px;background:#2a1209;color:#ffd2c2;font-size:15.5px;font-weight:500;line-height:1.4}
.stv-aviso-rosto{flex:none;width:34px;height:34px}
html.travado .stv-camada{visibility:hidden}
@media (max-width:640px){
  .stv-ator,.stv-vaga{width:40px;height:40px}
  .stv-vaga{left:18px;top:-38px}
  .stv-chat{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom) + var(--teclado,0px));width:auto;max-height:calc(100svh - 84px - var(--teclado,0px));border-radius:18px}
  .stv-fala{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.stv-corpo.anda,.stv-digita i{animation:none}.stv-fala{transition:opacity .15s,visibility .15s}}
@media print{.stv-camada,.stv-chat{display:none}}

/* ── línguas (lingua.js): seletor com bandeira e sigla, aviso de página só em português, árabe ── */
.xt-lingua{position:relative;display:inline-flex;margin-inline-end:10px}
.xt-lingua-botao{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 12px;border:0;border-radius:99px;background:rgba(127,127,127,.16);background:color-mix(in srgb,currentColor 12%,transparent);color:inherit;font:700 14px 'Hanken Grotesk',system-ui,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent}
.xt-lingua-botao:hover{background:color-mix(in srgb,currentColor 20%,transparent)}
.xt-bandeira{display:inline-block;width:22px;height:15px;border-radius:3px;overflow:hidden;flex:none;box-shadow:0 0 0 1px rgba(20,8,3,.25)}
.xt-bandeira svg{width:100%;height:100%;display:block}
.xt-seta{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-inline-start:2px}
.xt-lingua-menu{position:absolute;top:calc(100% + 8px);inset-inline-start:0;z-index:80;margin:0;padding:6px;list-style:none;min-width:210px;background:#0b0b0c;color:#f2efe9;border-radius:16px;box-shadow:0 20px 50px -18px rgba(0,0,0,.6),0 0 0 1px rgba(242,239,233,.08);text-align:start}
.xt-lingua-menu[hidden]{display:none}
.xt-lingua-menu li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font:600 15px 'Hanken Grotesk',system-ui,sans-serif;cursor:pointer;color:#f2efe9}
.xt-lingua-menu li:hover,.xt-lingua-menu li:focus-visible,.xt-lingua-menu li[aria-selected=true]{background:#1b1b1e;outline:none}
.xt-lingua-menu li:focus-visible{box-shadow:inset 0 0 0 2px var(--laranja)}
.xt-lingua-menu li small{margin-inline-start:auto;color:#6f6c67;font-weight:600;font-size:12.5px}
.xt-lingua-menu li[lang=ar]{font-family:'IBM Plex Sans Arabic','Hanken Grotesk',system-ui,sans-serif}
.topo-lado{display:flex;align-items:center;justify-content:space-between;gap:12px}
.topo-acoes{display:inline-flex}.topo-acoes .xt-lingua{margin:0}
@media(max-width:860px){.xt-lingua-botao{height:38px;padding:0 10px}.xt-lingua-botao b{display:none}.xt-lingua{margin-inline-end:6px}}
.xt-so-pt{margin:0;padding:9px 16px;background:#141416;color:#a4a19b;font:500 14px 'Hanken Grotesk',system-ui,sans-serif;text-align:center;border-bottom:1px solid #27272b}
/* árabe: da direita para a esquerda, fonte com as letras árabes e sem espaço entre letras (o espaço quebra a ligação) */
html[data-lingua=ar] body *{font-family:'IBM Plex Sans Arabic','Hanken Grotesk',system-ui,sans-serif!important;letter-spacing:0!important}
html[dir=rtl] .seta{display:inline-block;transform:scaleX(-1)}
/* trocou de língua: os Steves grandes giram (o pequeno gira pelo steve.js) */
@media print{.xt-lingua,.xt-so-pt{display:none}}
/* árabe: o que passa da lateral não vira rolagem (em página da direita para a esquerda, o lado esquerdo rola) */
html[dir=rtl] body{overflow-x:clip}
html[dir=rtl] .stv-fala{text-align:right;direction:rtl}
html[dir=rtl] .stv-fala:not(.dir){left:0}
/* o menu de língua mora dentro do .nav da página: não herda a fila dos links do topo (.nav ul) */
.xt-lingua ul.xt-lingua-menu{display:block;gap:0;font-size:15px;font-weight:600;width:auto;overflow:visible;white-space:normal;order:0;padding:6px;contain:none}
.xt-lingua ul.xt-lingua-menu[hidden]{display:none}