/* ══════════════════════════════════════════════════════════════
   TORQUE MOTOPEÇAS — folha única
   Mesma base dos sites anteriores: curva --mola, reveal [data-rv],
   onda diagonal nas grades, brilho de cursor nos botões, rolagem
   suave com inércia (anim.js) e cortina de entrada (intro.js).

   Paleta da referência: preto/grafite com laranja de acento.
   Dois laranjas com papéis diferentes, como os turquesas do Vip
   Select:
     --laranja      preenchimento (botão, selo, chip ativo) e texto
                    sobre fundo ESCURO
     --laranja-txt  texto e ícone fino sobre BRANCO — o laranja vivo
                    em corpo de texto dá 3:1; este dá 5,2:1
   ══════════════════════════════════════════════════════════════ */
:root{
 --preto:#0B0C0E;
 --grafite:#141619;
 --grafite-2:#1C1F23;
 --grafite-3:#262A2F;
 --linha-esc:rgba(255,255,255,.09);
 --laranja:#F26419;
 --laranja-2:#FF7A2E;
 --laranja-txt:#C2410C;
 --laranja-clara:#FFF1E8;
 --tinta:#0E1013;
 --corpo:#4B5159;
 --suave:#7D848D;
 --bg:#FFFFFF;
 --cinza:#F3F4F6;
 --cinza-2:#EBEDF0;
 --linha:#E4E6EA;
 --verde:#15803D;
 --verde-bg:#E9F7EF;
 --ambar:#A16207;
 --ambar-bg:#FEF6E4;
 --vermelho:#DC2626;
 --estrela:#F5A524;
 --sombra:0 1px 2px rgba(10,12,16,.05),0 calc(var(--u)*8) calc(var(--u)*24) calc(var(--u)*-14) rgba(10,12,16,.18);
 --sombra-alta:0 2px calc(var(--u)*6) rgba(10,12,16,.05),0 calc(var(--u)*28) calc(var(--u)*56) calc(var(--u)*-24) rgba(10,12,16,.32);
 --mola:cubic-bezier(.16,1,.3,1);
 --r:calc(var(--u)*12); --r-g:calc(var(--u)*18);
 --hdr:calc(var(--u)*181);           /* altura do cabeçalho aberto (empurra o body) */
 --topo:calc(var(--u)*118);          /* altura compacta — é onde as âncoras param */
 --display:'Archivo','Inter',system-ui,sans-serif;
 /* UNIDADE PROPORCIONAL — toda medida da página é N × --u.
    1440px de tela = 1px por unidade; qualquer outra largura escala
    junto, então a composição é a mesma em qualquer monitor e nada
    quebra. O piso de .76px segura a leitura em notebook pequeno
    (abaixo disso entram os ajustes de 1060px). No celular a base
    vira 375px (ver o bloco do celular). */
 /* escala pela largura E pela altura (a menor das duas), com a tela
    de referência em 1440×810: em monitor mais baixo que 16:9 tudo
    encolhe junto e a primeira tela — cabeçalho, hero e seletor
    inteiro — continua cabendo. A largura segue cheia porque os grids
    são em fração/porcentagem. */
 --u:max(.76px,min(calc(100vw / 1440),calc(100svh / 810)));
 --gut:calc(var(--u)*48);       /* margem lateral da página */
}
*{box-sizing:border-box}
html{scrollbar-gutter:stable;scroll-behavior:smooth;scroll-padding-top:calc(var(--topo) + calc(var(--u)*12));-webkit-text-size-adjust:100%}
body{margin:0;padding-top:var(--hdr);background:var(--bg);color:var(--corpo);
 font:400 calc(var(--u)*15)/1.6 'Inter','Segoe UI',system-ui,sans-serif;
 -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
svg{width:calc(var(--u)*18);height:calc(var(--u)*18);flex:none;fill:none;stroke:currentColor;stroke-width:1.8;
 stroke-linecap:round;stroke-linejoin:round}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,h4{margin:0;color:var(--tinta);font-family:var(--display);font-weight:800;
 font-stretch:112%;letter-spacing:-.015em;line-height:1.05}
p{margin:0}
em{font-style:normal;color:var(--laranja)}
.wrap{width:calc(100% - var(--gut)*2);margin-inline:auto}
[hidden]{display:none!important}

.kicker{display:block;font:700 calc(var(--u)*12)/1 var(--display);font-stretch:118%;letter-spacing:.16em;
 text-transform:uppercase;color:var(--laranja-txt);margin-bottom:calc(var(--u)*12)}
.sechd{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u)*24);margin-bottom:calc(var(--u)*34)}
.sechd h2{font-size:clamp(calc(var(--u)*26),2.6vw,calc(var(--u)*36));text-transform:uppercase}
.sechd-p{max-width:calc(var(--u)*380);color:var(--corpo);text-align:right}

/* ══ BOTÕES ════════════════════════════════════════════════════ */
.btn,.btn-o{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--u)*10);
 padding:calc(var(--u)*14) calc(var(--u)*24);border-radius:calc(var(--u)*10);font:700 calc(var(--u)*13.5)/1 var(--display);font-stretch:112%;
 letter-spacing:.06em;text-transform:uppercase;overflow:hidden;white-space:nowrap;
 transition:transform .5s var(--mola),box-shadow .5s var(--mola),background .3s ease,color .3s ease,border-color .3s ease}
.btn{background:var(--tinta);color:#fff}
.btn-l{background:var(--laranja);color:#fff;box-shadow:0 calc(var(--u)*12) calc(var(--u)*26) calc(var(--u)*-14) rgba(242,100,25,.9)}
.btn:hover{transform:translateY(-2px);box-shadow:0 calc(var(--u)*18) calc(var(--u)*34) calc(var(--u)*-16) rgba(10,12,16,.5)}
.btn-l:hover{background:var(--laranja-2);box-shadow:0 calc(var(--u)*20) calc(var(--u)*36) calc(var(--u)*-16) rgba(242,100,25,.75)}
.btn:disabled{opacity:.45;pointer-events:none;box-shadow:none}
.btn-o{background:#fff;color:var(--tinta);border:1.5px solid var(--linha)}
.btn-o:hover{border-color:var(--tinta);transform:translateY(-2px)}
.btn-o-esc{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-o-esc:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn .seta,.btn-o .seta{width:calc(var(--u)*16);height:calc(var(--u)*16);transition:transform .5s var(--mola)}
.btn:hover .seta,.btn-o:hover .seta{transform:translateX(calc(var(--u)*4))}
.btn-glow{position:absolute;inset:0;pointer-events:none;opacity:0;
 background:radial-gradient(calc(var(--u)*120) circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.42),transparent 62%);
 transition:opacity .35s ease}
.btn-glow.on{opacity:1}
.btn-o .btn-glow{background:radial-gradient(calc(var(--u)*120) circle at var(--gx,50%) var(--gy,50%),rgba(242,100,25,.12),transparent 62%)}
.link-t{display:inline-flex;align-items:center;white-space:nowrap;gap:calc(var(--u)*8);font:700 calc(var(--u)*13)/1 var(--display);font-stretch:112%;
 letter-spacing:.06em;text-transform:uppercase;color:var(--tinta);transition:gap .4s var(--mola),color .3s}
.link-t svg{width:calc(var(--u)*16);height:calc(var(--u)*16)}
.link-t:hover{gap:calc(var(--u)*13);color:var(--laranja-txt)}
.icb{position:relative;display:grid;place-items:center;width:calc(var(--u)*42);height:calc(var(--u)*42);border-radius:calc(var(--u)*10);
 color:inherit;transition:background .3s ease,color .3s ease,transform .4s var(--mola)}
.icb svg{width:calc(var(--u)*21);height:calc(var(--u)*21)}
.icb:hover{background:rgba(255,255,255,.08)}
.icb.redondo{border:1.5px solid var(--linha);border-radius:50%;color:var(--tinta)}
.icb.redondo:hover{background:var(--tinta);color:#fff;border-color:var(--tinta)}
.badge{position:absolute;top:calc(var(--u)*3);right:1px;min-width:calc(var(--u)*18);height:calc(var(--u)*18);padding:0 calc(var(--u)*5);border-radius:calc(var(--u)*9);
 background:var(--laranja);color:#fff;font:700 calc(var(--u)*10.5)/calc(var(--u)*18) 'Inter',sans-serif;font-style:normal;text-align:center;
 transform:scale(0);transition:transform .45s var(--mola)}
.badge.on{transform:scale(1)}
.badge.pulo{animation:pulo .5s var(--mola)}
@keyframes pulo{40%{transform:scale(1.45)}}

/* ══ CABEÇALHO ═════════════════════════════════════════════════
   Fixo e em três andares: faixa comercial, linha da marca com a busca
   e a linha de categorias. Ao rolar (.compact) a faixa de cima some —
   o body já reservou a altura cheia, então nada abaixo pula. */
.nav{position:fixed;inset:0 0 auto;z-index:900;background:var(--preto);color:#fff;
 box-shadow:0 1px 0 var(--linha-esc)}
.nav.compact{box-shadow:0 calc(var(--u)*14) calc(var(--u)*34) calc(var(--u)*-22) rgba(0,0,0,.9)}
.topbar{height:calc(var(--u)*34);overflow:hidden;background:#000;border-bottom:1px solid var(--linha-esc);
 font-size:calc(var(--u)*12);color:#C9CDD2;transition:height .45s var(--mola)}
.nav.compact .topbar{height:0}
.tb-trilho{display:flex;justify-content:center;gap:calc(var(--u)*54);height:calc(var(--u)*34);align-items:center;white-space:nowrap}
.tb-trilho span{display:inline-flex;align-items:center;gap:calc(var(--u)*8)}
.tb-trilho svg{width:calc(var(--u)*15);height:calc(var(--u)*15);color:var(--laranja)}
.tb-trilho b{color:#fff;font-weight:600}

.navtop{display:flex;align-items:center;gap:calc(var(--u)*26);height:calc(var(--u)*76);transition:height .45s var(--mola)}
.nav.compact .navtop{height:calc(var(--u)*64)}
.burger{display:none}
.logo{display:flex;align-items:center;gap:calc(var(--u)*10);flex:none;color:#fff}
.logo .mk{width:calc(var(--u)*40);height:calc(var(--u)*25);color:var(--laranja);transition:transform .55s var(--mola)}
.logo:hover .mk{transform:translateX(calc(var(--u)*3)) skewX(-6deg)}
.logo b{display:block;font:900 calc(var(--u)*26)/1 var(--display);font-stretch:125%;font-style:italic;letter-spacing:-.01em}
.logo small{display:block;font:600 calc(var(--u)*9)/1 var(--display);font-stretch:125%;letter-spacing:.42em;text-transform:uppercase;
 color:#9AA0A8;margin-top:calc(var(--u)*5);padding-left:2px}

/* busca: o elemento mais importante da barra */
.busca{position:relative;flex:1;display:flex;align-items:center;height:calc(var(--u)*48);max-width:calc(var(--u)*640);margin-left:calc(var(--u)*10);
 background:#fff;border-radius:calc(var(--u)*12);color:var(--tinta);box-shadow:0 0 0 0 rgba(242,100,25,0);
 transition:box-shadow .35s ease}
.busca:focus-within{box-shadow:0 0 0 calc(var(--u)*3) rgba(242,100,25,.55)}
.busca .lupa{position:absolute;left:calc(var(--u)*16);width:calc(var(--u)*19);height:calc(var(--u)*19);color:var(--suave)}
.busca input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;padding:0 calc(var(--u)*8) 0 calc(var(--u)*46);
 font-size:calc(var(--u)*14.5);color:var(--tinta)}
.busca input::placeholder{color:#8A9098}
.busca input::-webkit-search-cancel-button{display:none}
.bx-limpa{display:none;place-items:center;width:calc(var(--u)*32);height:calc(var(--u)*32);border-radius:calc(var(--u)*8);color:var(--suave)}
.busca.tem .bx-limpa{display:grid}
.bx-limpa svg{width:calc(var(--u)*16);height:calc(var(--u)*16)}
.bx-ir{height:calc(var(--u)*40);margin:calc(var(--u)*4);padding:0 calc(var(--u)*20);border-radius:calc(var(--u)*9);background:var(--laranja);color:#fff;
 font:700 calc(var(--u)*12.5)/1 var(--display);font-stretch:115%;letter-spacing:.08em;text-transform:uppercase;transition:background .3s}
.bx-ir:hover{background:var(--laranja-2)}

/* autocomplete */
.sugest{position:absolute;top:calc(100% + calc(var(--u)*10));left:0;right:0;z-index:5;background:#fff;border-radius:calc(var(--u)*14);
 box-shadow:var(--sombra-alta),0 0 0 1px var(--linha);padding:calc(var(--u)*10);max-height:min(70vh,calc(var(--u)*520));overflow:auto;
 opacity:0;visibility:hidden;transform:translateY(calc(var(--u)*-6));transition:opacity .25s ease,transform .35s var(--mola),visibility 0s .3s}
.sugest.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.sg-hd{font-size:calc(var(--u)*12);color:var(--suave);padding:calc(var(--u)*6) calc(var(--u)*10) calc(var(--u)*8)}
.sg-hd b{color:var(--tinta)}
.sg-sec{font:700 calc(var(--u)*10.5)/1 var(--display);font-stretch:118%;letter-spacing:.14em;text-transform:uppercase;
 color:var(--suave);padding:calc(var(--u)*12) calc(var(--u)*10) calc(var(--u)*6)}
.sg-it{display:flex;align-items:center;gap:calc(var(--u)*12);width:100%;padding:calc(var(--u)*8) calc(var(--u)*10);border-radius:calc(var(--u)*10);text-align:left;color:var(--tinta)}
.sg-it:hover,.sg-it.at{background:var(--cinza)}
.sg-it img{width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:calc(var(--u)*8);object-fit:contain;background:var(--cinza);mix-blend-mode:multiply}
.sg-it .sg-ico{width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:calc(var(--u)*8);display:grid;place-items:center;background:var(--laranja-clara);color:var(--laranja-txt)}
.sg-it span{flex:1;min-width:0;font-size:calc(var(--u)*13.5);line-height:1.35}
.sg-it span small{display:block;color:var(--suave);font-size:calc(var(--u)*12)}
.sg-it mark{background:none;color:var(--laranja-txt);font-weight:700}
.sg-it b{font-size:calc(var(--u)*13.5);white-space:nowrap}
.sg-todos{display:flex;justify-content:center;gap:calc(var(--u)*8);margin-top:calc(var(--u)*6);padding:calc(var(--u)*11);border-radius:calc(var(--u)*10);
 background:var(--tinta);color:#fff;font-weight:600;font-size:calc(var(--u)*13)}
.sg-nada{padding:calc(var(--u)*16) calc(var(--u)*10);font-size:calc(var(--u)*13.5);color:var(--corpo)}

.minhamoto-bt{display:flex;align-items:center;gap:calc(var(--u)*11);height:calc(var(--u)*48);padding:0 calc(var(--u)*14) 0 calc(var(--u)*6);border-radius:calc(var(--u)*12);
 border:1px solid var(--linha-esc);background:var(--grafite-2);text-align:left;flex:none;
 transition:border-color .3s,background .3s}
.minhamoto-bt:hover{border-color:rgba(242,100,25,.6);background:var(--grafite-3)}
.mm-ico{width:calc(var(--u)*36);height:calc(var(--u)*36);border-radius:calc(var(--u)*9);display:grid;place-items:center;background:var(--laranja);color:#fff}
.mm-ico svg{width:calc(var(--u)*20);height:calc(var(--u)*20)}
.mm-txt small{display:block;font-size:calc(var(--u)*11);color:#9AA0A8;line-height:1.1}
.mm-txt b{display:block;font-size:calc(var(--u)*13.5);font-weight:600;line-height:1.3;max-width:calc(var(--u)*170);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.minhamoto-bt .cv{width:calc(var(--u)*15);height:calc(var(--u)*15);color:#9AA0A8}
.minhamoto-bt.tem .mm-ico{background:var(--verde);box-shadow:0 0 0 calc(var(--u)*3) rgba(21,128,61,.25)}
.navicons{display:flex;gap:calc(var(--u)*4);margin-left:auto}

.navcats{height:calc(var(--u)*46);border-top:1px solid var(--linha-esc);background:var(--grafite)}
.nav.compact .navcats{height:calc(var(--u)*44)}
.nc-in{display:flex;align-items:center;gap:0;height:100%;overflow-x:auto;scrollbar-width:none}
.nc-in::-webkit-scrollbar{display:none}
.nc-in a{position:relative;display:inline-flex;align-items:center;gap:calc(var(--u)*8);height:100%;padding:0 calc(var(--u)*10);white-space:nowrap;
 font:600 calc(var(--u)*12.5)/1 var(--display);font-stretch:108%;letter-spacing:.05em;text-transform:uppercase;color:#C9CDD2;
 transition:color .3s}
.nc-in a::after{content:'';position:absolute;left:calc(var(--u)*10);right:100%;bottom:0;height:2px;background:var(--laranja);
 transition:right .45s var(--mola)}
.nc-in a:hover,.nc-in a.active{color:#fff}
.nc-in a:hover::after,.nc-in a.active::after{right:calc(var(--u)*10)}
.nc-in svg{width:calc(var(--u)*16);height:calc(var(--u)*16)}
.nc-todas{background:var(--laranja);color:#fff!important;border-radius:0;margin-right:calc(var(--u)*8)}
.nc-todas::after{display:none}
.nc-oferta{color:var(--laranja-2)!important;margin-left:auto}


/* ══ 0 · HOME DE APP — só aparece no celular ══════════════════ */
.apphome,.so-m{display:none}
/* ══ 1 · HERO ══════════════════════════════════════════════════
   A foto do pôr do sol é 16:9 e a moto está na metade direita. Em vez
   de "cover" (que cortaria o capacete ou as rodas nesta altura), ela
   ocupa a altura toda e encosta na direita; o que sobra à esquerda é
   preto, e o véu funde os dois. */
.hero{position:relative;height:calc(100svh - var(--hdr));min-height:calc(var(--u)*560);background:var(--preto);overflow:hidden;color:#fff}
.hero-foto{position:absolute;inset:0}
.hero-foto img{width:100%;height:100%;object-fit:cover;object-position:72% 45%}
@media (min-width:821px){
 /* a moto fica à direita e o texto na esquerda escura */
 .hero-in{padding-bottom:calc(var(--u)*70)}
}
}
.hero-veu{position:absolute;inset:0;pointer-events:none;
 background:
  linear-gradient(90deg,var(--preto) 0%,rgba(11,12,14,.94) 20%,rgba(11,12,14,.78) 38%,rgba(11,12,14,.2) 58%,transparent 70%),
  linear-gradient(0deg,rgba(11,12,14,.75),transparent 30%)}
.hero-in{position:relative;height:100%;display:flex;align-items:center;padding-bottom:calc(var(--u)*40)}
.hcopy{max-width:calc(var(--u)*720)}
.hero .kicker{color:var(--laranja-2)}
.hcopy h1{font-size:calc(var(--u)*76);font-weight:900;font-stretch:118%;text-transform:uppercase;
 letter-spacing:-.02em;line-height:.95;color:#fff}
.hcopy h1 .linha{display:block;overflow:hidden;padding-bottom:.06em}
.hcopy h1 .linha > span{display:block;white-space:nowrap}
.hcopy > p{margin-top:calc(var(--u)*20);font-size:calc(var(--u)*17);line-height:1.55;color:#C9CDD2;max-width:calc(var(--u)*420)}
.hbts{display:flex;gap:calc(var(--u)*12);margin-top:calc(var(--u)*30)}
.hpilula{display:none}
.hoferta{display:inline-flex;align-items:center;gap:calc(var(--u)*10);margin-top:calc(var(--u)*26);padding:calc(var(--u)*9) calc(var(--u)*14) calc(var(--u)*9) calc(var(--u)*12);border-radius:calc(var(--u)*40);
 background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(calc(var(--u)*8));
 font-size:calc(var(--u)*13.5);color:#E4E6EA;transition:background .3s,gap .4s var(--mola)}
.hoferta:hover{background:rgba(255,255,255,.12);gap:calc(var(--u)*14)}
.hoferta svg{width:calc(var(--u)*16);height:calc(var(--u)*16);color:var(--laranja-2)}
.hoferta b{color:#fff}

/* entrada do hero — keyframes, nada preso a classe de JS */
@keyframes sobe{from{opacity:0;transform:translate3d(0,calc(var(--u)*26),0)}to{opacity:1;transform:none}}
@keyframes desce{from{opacity:0;transform:translate3d(0,calc(var(--u)*-14),0)}to{opacity:1;transform:none}}
@keyframes revela-linha{from{transform:translate3d(0,112%,0)}to{transform:none}}
@keyframes aproxima{from{transform:scale(1.12)}to{transform:none}}
@keyframes some-veu{from{opacity:1}to{opacity:.0}}
.navtop,.navcats{animation:desce .9s var(--mola) .05s both}
.hero-foto img{animation:aproxima 2.8s cubic-bezier(.22,1,.26,1) both;transform-origin:70% 60%}
.hero .kicker{animation:sobe .9s var(--mola) .2s both}
.hcopy h1 .linha > span{animation:revela-linha 1.2s cubic-bezier(.19,1,.22,1) both}
.hcopy h1 .linha:nth-child(1) > span{animation-delay:.3s}
.hcopy h1 .linha:nth-child(2) > span{animation-delay:.42s}
.hcopy > p{animation:sobe .95s var(--mola) .6s both}
.hbts,.hpilula{animation:sobe .95s var(--mola) .72s both}
.hoferta,.hselos{animation:sobe .95s var(--mola) .84s both}
.sel-card{animation:sobe 1s var(--mola) .9s both}
/* enquanto a cortina está na tela, a entrada espera (paused) */
html.tq-intro .navtop,html.tq-intro .navcats,html.tq-intro .hero *,html.tq-intro .sel-card{animation-play-state:paused}

/* ══ CORTINA ═══════════════════════════════════════════════════ */
#tqintro{display:none}
html.tq-intro #tqintro{display:grid}
#tqintro{position:fixed;inset:0;z-index:2000;place-items:center;background:var(--preto);color:#fff;
 transition:opacity .6s ease,visibility 0s .6s}
#tqintro.sai{opacity:0;visibility:hidden}
.tqi-in{display:grid;justify-items:center;gap:calc(var(--u)*16)}
.logo-g .mk{width:calc(var(--u)*64);height:calc(var(--u)*40)}
.logo-g b{font-size:calc(var(--u)*44)}
.tqi-barra{width:calc(var(--u)*180);height:calc(var(--u)*3);border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden}
.tqi-barra i{display:block;height:100%;width:100%;background:var(--laranja);transform-origin:left;
 animation:giro 1.1s cubic-bezier(.6,0,.2,1) both}
@keyframes giro{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.tqi-in small{font:600 calc(var(--u)*11)/1 var(--display);font-stretch:125%;letter-spacing:.5em;text-transform:uppercase;color:#8A9098}
.tqi-in .logo{animation:sobe .8s var(--mola) both}

/* ══ 2 · SELETOR ═══════════════════════════════════════════════ */
.seletor{position:relative;z-index:3;margin-top:calc(var(--u)*-58)}
.sel-card{background:#fff;border-radius:var(--r-g);box-shadow:var(--sombra-alta),0 0 0 1px var(--linha);
 padding:calc(var(--u)*26) calc(var(--u)*28) calc(var(--u)*20);overflow:hidden}
.sel-escolha{display:grid;grid-template-columns:minmax(calc(var(--u)*230),calc(var(--u)*300)) 1fr;gap:calc(var(--u)*10) calc(var(--u)*30);align-items:center}
.sel-tit{display:flex;gap:calc(var(--u)*14);align-items:center}
.sel-ico{width:calc(var(--u)*52);height:calc(var(--u)*52);flex:none;border-radius:calc(var(--u)*14);display:grid;place-items:center;
 background:var(--tinta);color:var(--laranja)}
.sel-ico svg{width:calc(var(--u)*26);height:calc(var(--u)*26)}
.sel-ico.ok{background:var(--verde);color:#fff}
.sel-tit h2{font-size:calc(var(--u)*19);text-transform:uppercase;line-height:1.15}
.sel-tit p{font-size:calc(var(--u)*13);color:var(--suave);margin-top:calc(var(--u)*5);line-height:1.45}
.sel-campos{display:grid;grid-template-columns:1fr 1.25fr .8fr auto;gap:calc(var(--u)*10)}
.sc{position:relative;display:block;border:1.5px solid var(--linha);border-radius:calc(var(--u)*11);padding:calc(var(--u)*9) calc(var(--u)*38) calc(var(--u)*8) calc(var(--u)*14);
 background:#fff;transition:border-color .3s,box-shadow .3s;cursor:pointer}
.sc:hover{border-color:#C9CDD2}
.sc:focus-within{border-color:var(--laranja);box-shadow:0 0 0 calc(var(--u)*3) rgba(242,100,25,.15)}
.sc small{display:flex;align-items:center;gap:calc(var(--u)*7);font-size:calc(var(--u)*11);font-weight:600;color:var(--suave);text-transform:uppercase;letter-spacing:.08em}
.sc small i{font-style:normal;width:calc(var(--u)*16);height:calc(var(--u)*16);border-radius:50%;background:var(--cinza-2);display:grid;place-items:center;font-size:calc(var(--u)*10);color:var(--tinta)}
.sc select{width:100%;border:0;outline:0;background:none;appearance:none;-webkit-appearance:none;
 font-size:calc(var(--u)*15);font-weight:600;color:var(--tinta);padding:2px 0 0;cursor:pointer}
.sc select:disabled{color:#B5BAC1;cursor:not-allowed}
.sc .cv{position:absolute;right:calc(var(--u)*13);top:50%;transform:translateY(-50%);width:calc(var(--u)*16);height:calc(var(--u)*16);color:var(--suave);pointer-events:none}
.sc.feito small i{background:var(--laranja);color:#fff}
.sel-ir{height:100%;min-height:calc(var(--u)*56)}
.sel-manual{grid-column:2;font-size:calc(var(--u)*13);color:var(--suave)}
.sel-manual u{color:var(--tinta);text-underline-offset:calc(var(--u)*3)}
.sel-salva{display:none;align-items:center;gap:calc(var(--u)*18)}
.sel-card.tem .sel-escolha{display:none}
.sel-card.tem .sel-salva{display:flex;animation:sobe .7s var(--mola) both}
.ss-txt{flex:1}
.ss-txt small{display:block;font-size:calc(var(--u)*12);color:var(--suave);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.ss-txt b{display:block;font:800 calc(var(--u)*24)/1.15 var(--display);font-stretch:110%;color:var(--tinta);text-transform:uppercase}
.ss-txt span{display:inline-flex;align-items:center;gap:calc(var(--u)*8);font-size:calc(var(--u)*13.5);color:var(--verde);font-weight:600;margin-top:calc(var(--u)*4)}
.dot{width:calc(var(--u)*8);height:calc(var(--u)*8);border-radius:50%;background:var(--verde);box-shadow:0 0 0 calc(var(--u)*3) rgba(21,128,61,.18);animation:bate 2s ease-in-out infinite}
@keyframes bate{50%{box-shadow:0 0 0 calc(var(--u)*6) rgba(21,128,61,0)}}
.ss-bts{display:flex;gap:calc(var(--u)*10)}

/* ══ 3 · CATEGORIAS ════════════════════════════════════════════ */
.cats{padding:calc(var(--u)*72) 0 calc(var(--u)*80)}
.catchips{display:none}
.catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*16)}
.ccard{position:relative;display:block;aspect-ratio:5/4;border-radius:var(--r-g);overflow:hidden;background:var(--preto);color:#fff;
 isolation:isolate}
.ccard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78;
 transition:transform 1.1s var(--mola),opacity .5s ease}
.ccard::after{content:'';position:absolute;inset:0;z-index:0;
 background:linear-gradient(180deg,rgba(11,12,14,.1) 20%,rgba(11,12,14,.92) 100%)}
.ccard:hover img{transform:scale(1.08);opacity:.95}
.cc-in{position:absolute;inset:auto 0 0;z-index:1;padding:calc(var(--u)*20) calc(var(--u)*20) calc(var(--u)*18)}
.cc-n{display:inline-block;font-size:calc(var(--u)*11.5);font-weight:600;color:#fff;background:rgba(255,255,255,.14);backdrop-filter:blur(calc(var(--u)*6));
 padding:calc(var(--u)*4) calc(var(--u)*9);border-radius:calc(var(--u)*20);margin-bottom:calc(var(--u)*10)}
.ccard h3{color:#fff;font-size:calc(var(--u)*22);text-transform:uppercase;display:flex;align-items:center;justify-content:space-between}
.ccard h3 i{width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:50%;background:var(--laranja);display:grid;place-items:center;
 transform:translateX(calc(var(--u)*-8)) rotate(-45deg);opacity:0;transition:transform .55s var(--mola),opacity .35s}
.ccard:hover h3 i{transform:none;opacity:1}
.ccard h3 svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}
.cc-subs{display:flex;flex-wrap:wrap;gap:calc(var(--u)*4) calc(var(--u)*10);margin-top:calc(var(--u)*8);font-size:calc(var(--u)*12.5);color:#B9BEC5;
 max-height:0;overflow:hidden;opacity:0;transition:max-height .6s var(--mola),opacity .4s}
.ccard:hover .cc-subs{max-height:calc(var(--u)*60);opacity:1}
.cc-subs span::before{content:'•';margin-right:calc(var(--u)*6);color:var(--laranja)}

/* ══ 4 · SUA MOTO ══════════════════════════════════════════════ */
.suamoto{position:relative;background:var(--preto);color:#fff;overflow:hidden;min-height:calc(var(--u)*520);display:flex;align-items:center}
.sm-foto{position:absolute;inset:0 45% 0 0}
.sm-foto img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.sm-foto::after{content:'';position:absolute;inset:-1px;background:linear-gradient(90deg,rgba(11,12,14,.1) 35%,rgba(11,12,14,.7) 70%,var(--preto) 94%)}
.sm-in{position:relative;display:flex;justify-content:flex-end;padding:calc(var(--u)*80) 0}
.sm-copy{width:min(calc(var(--u)*560),50%)}
.suamoto .kicker{color:var(--laranja-2)}
.suamoto h2{color:#fff;font-size:clamp(calc(var(--u)*34),3.8vw,calc(var(--u)*54));text-transform:uppercase;font-weight:900;line-height:1}
.sm-vazio p{margin:calc(var(--u)*20) 0 calc(var(--u)*28);color:#B9BEC5;font-size:calc(var(--u)*16);max-width:calc(var(--u)*440)}
.sm-cheio{display:none}
.suamoto.tem .sm-vazio{display:none}
.suamoto.tem .sm-cheio{display:block}
.sm-moto{display:flex;align-items:center;gap:calc(var(--u)*14);margin:calc(var(--u)*24) 0 calc(var(--u)*20);padding:calc(var(--u)*16) calc(var(--u)*18);border-radius:calc(var(--u)*14);
 background:var(--grafite-2);border:1px solid var(--linha-esc)}
.sm-moto > svg{width:calc(var(--u)*30);height:calc(var(--u)*30);color:var(--laranja)}
.sm-moto b{display:block;font:800 calc(var(--u)*19)/1.2 var(--display);font-stretch:110%;text-transform:uppercase}
.sm-moto small{display:block;color:#7EE0A1;font-size:calc(var(--u)*13.5);font-weight:600}
.sm-cats{display:flex;flex-wrap:wrap;gap:calc(var(--u)*8)}
.sm-cats button{display:inline-flex;align-items:center;gap:calc(var(--u)*8);padding:calc(var(--u)*10) calc(var(--u)*14);border-radius:calc(var(--u)*9);
 border:1px solid var(--linha-esc);background:rgba(255,255,255,.04);font-size:calc(var(--u)*13.5);font-weight:600;color:#E4E6EA;
 transition:background .3s,border-color .3s,transform .45s var(--mola)}
.sm-cats button:hover{background:var(--laranja);border-color:var(--laranja);color:#fff;transform:translateY(-2px)}
.sm-cats button small{font-size:calc(var(--u)*11.5);color:#9AA0A8;font-weight:500}
.sm-cats button:hover small{color:#FFE2D1}
.sm-cats button:first-child{background:var(--laranja);border-color:var(--laranja);color:#fff}
.sm-cats button:first-child small{color:#FFE2D1}
.sm-nums{display:flex;gap:calc(var(--u)*36);margin-top:calc(var(--u)*40);padding-top:calc(var(--u)*26);border-top:1px solid var(--linha-esc)}
.sm-nums b{display:block;font:900 calc(var(--u)*34)/1 var(--display);font-stretch:112%;color:#fff;transition:color .6s}
.sm-nums b.num-glow{color:var(--laranja-2)}
.sm-nums small{font-size:calc(var(--u)*12.5);color:#9AA0A8}

/* ══ 5 · OFERTAS ═══════════════════════════════════════════════ */
.ofertas{padding:calc(var(--u)*80) 0 0}
.ofgrid{display:grid;grid-template-columns:1.35fr 1fr;gap:calc(var(--u)*16)}
.ofb{position:relative;display:flex;align-items:center;min-height:calc(var(--u)*300);border-radius:var(--r-g);overflow:hidden;
 background:var(--preto);color:#fff;isolation:isolate}
.ofb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:transform 1.2s var(--mola)}
.ofb:hover img{transform:scale(1.05)}
.ofb::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,12,14,.95) 25%,rgba(11,12,14,.35) 70%,transparent)}
.ofb-2 img{object-position:50% 40%}
.ofb-txt{padding:calc(var(--u)*36) calc(var(--u)*40);max-width:calc(var(--u)*430)}
.ofb .kicker{color:var(--laranja-2)}
.ofb h3{color:#fff;font-size:clamp(calc(var(--u)*26),2.5vw,calc(var(--u)*36));text-transform:uppercase;font-weight:900;line-height:1.02}
.ofb p{margin:calc(var(--u)*12) 0 calc(var(--u)*22);color:#B9BEC5;font-size:calc(var(--u)*14.5)}

/* ══ 6 · CATÁLOGO ══════════════════════════════════════════════ */
.catalogo{padding:calc(var(--u)*90) 0 calc(var(--u)*60)}
.cat-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u)*30);margin-bottom:calc(var(--u)*22)}
.cat-hd h2{font-size:clamp(calc(var(--u)*30),3.2vw,calc(var(--u)*46));text-transform:uppercase;font-weight:900}
.cat-sub{margin-top:calc(var(--u)*8);color:var(--suave);font-size:calc(var(--u)*14.5)}
.cat-sub b{color:var(--tinta)}
.cat-sub span{color:var(--verde);font-weight:600}
.cat-busca{position:relative;display:flex;align-items:center;width:min(calc(var(--u)*420),100%);height:calc(var(--u)*48);border-radius:calc(var(--u)*12);
 background:var(--cinza);border:1.5px solid transparent;transition:border-color .3s,background .3s}
.cat-busca:focus-within{border-color:var(--laranja);background:#fff}
.cat-busca svg{position:absolute;left:calc(var(--u)*15);color:var(--suave)}
.cat-busca input{flex:1;height:100%;border:0;outline:0;background:none;padding:0 calc(var(--u)*14) 0 calc(var(--u)*44);font-size:calc(var(--u)*14.5);color:var(--tinta)}

.chips{display:flex;gap:calc(var(--u)*6);overflow-x:auto;scrollbar-width:none;padding:calc(var(--u)*4) 0 calc(var(--u)*22);margin-bottom:calc(var(--u)*6);border-bottom:1px solid var(--linha)}
.chips::-webkit-scrollbar{display:none}
.chip{display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--u)*8);flex:1 0 auto;height:calc(var(--u)*40);padding:0 calc(var(--u)*12);border-radius:calc(var(--u)*40);
 border:1.5px solid var(--linha);background:#fff;font-weight:600;font-size:calc(var(--u)*13.5);color:var(--tinta);
 transition:background .3s,color .3s,border-color .3s,transform .45s var(--mola)}
.chip svg{width:calc(var(--u)*17);height:calc(var(--u)*17);color:var(--suave);transition:color .3s}
.chip small{font-size:calc(var(--u)*11.5);color:var(--suave);font-weight:500}
.chip:hover{border-color:var(--tinta);transform:translateY(-1px)}
.chip.on{background:var(--tinta);border-color:var(--tinta);color:#fff}
.chip.on svg{color:var(--laranja)}
.chip.on small{color:#9AA0A8}

.cat-corpo{display:grid;grid-template-columns:calc(var(--u)*250) 1fr;gap:calc(var(--u)*32);align-items:start;padding-top:calc(var(--u)*24)}
.filtros{position:sticky;top:calc(var(--topo) + calc(var(--u)*20));max-height:calc(100vh - var(--topo) - calc(var(--u)*40));overflow:auto;
 scrollbar-width:thin;padding-right:calc(var(--u)*6)}
.f-hd{display:flex;align-items:center;justify-content:space-between;padding-bottom:calc(var(--u)*14);border-bottom:2px solid var(--tinta)}
.f-hd b{display:flex;align-items:center;gap:calc(var(--u)*9);font:800 calc(var(--u)*15)/1 var(--display);font-stretch:115%;text-transform:uppercase;color:var(--tinta)}
.f-limpar{font-size:calc(var(--u)*12.5);color:var(--suave);text-decoration:underline;text-underline-offset:calc(var(--u)*3)}
.f-limpar:hover{color:var(--tinta)}
.f-fecha,.f-aplica{display:none!important}
.f-bloco{padding:calc(var(--u)*16) 0;border-bottom:1px solid var(--linha)}
.f-bloco h4,.f-bloco summary{font:700 calc(var(--u)*12)/1 var(--display);font-stretch:115%;letter-spacing:.1em;text-transform:uppercase;color:var(--tinta)}
.f-bloco h4{margin-bottom:calc(var(--u)*12)}
.f-bloco summary{list-style:none;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.f-bloco summary::-webkit-details-marker{display:none}
.f-bloco summary svg{width:calc(var(--u)*15);height:calc(var(--u)*15);transition:transform .4s var(--mola)}
.f-bloco[open] summary svg{transform:rotate(180deg)}
.f-opts{display:grid;gap:2px;margin-top:calc(var(--u)*12)}
.f-rolagem{max-height:calc(var(--u)*220);overflow:auto}
.ck,.tg{display:flex;align-items:center;gap:calc(var(--u)*10);padding:calc(var(--u)*6) 0;font-size:calc(var(--u)*14);color:var(--corpo);cursor:pointer;user-select:none}
.ck input,.tg input{position:absolute;opacity:0;pointer-events:none}
.ck i{width:calc(var(--u)*18);height:calc(var(--u)*18);border-radius:calc(var(--u)*5);border:1.5px solid #C4C9CF;display:grid;place-items:center;flex:none;
 transition:background .25s,border-color .25s}
.ck i::after{content:'';width:calc(var(--u)*9);height:calc(var(--u)*5);border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) scale(0);margin-top:-2px;
 transition:transform .3s var(--mola)}
.ck input:checked + i{background:var(--laranja);border-color:var(--laranja)}
.ck input:checked + i::after{transform:rotate(-45deg) scale(1)}
.ck input:focus-visible + i,.tg input:focus-visible + i{box-shadow:0 0 0 calc(var(--u)*3) rgba(242,100,25,.3)}
.ck:hover{color:var(--tinta)}
.ck small{margin-left:auto;font-size:calc(var(--u)*12);color:var(--suave)}
.tg i{width:calc(var(--u)*36);height:calc(var(--u)*21);border-radius:calc(var(--u)*12);background:#D5D9DE;position:relative;flex:none;transition:background .3s}
.tg i::after{content:'';position:absolute;top:calc(var(--u)*2.5);left:calc(var(--u)*2.5);width:calc(var(--u)*16);height:calc(var(--u)*16);border-radius:50%;background:#fff;
 box-shadow:0 1px calc(var(--u)*3) rgba(0,0,0,.25);transition:transform .4s var(--mola)}
.tg input:checked + i{background:var(--verde)}
.tg input:checked + i::after{transform:translateX(calc(var(--u)*15))}
.f-moto-com{display:none}
.f-moto.tem .f-moto-sem{display:none}
.f-moto.tem .f-moto-com{display:block}
.f-moto-sem p{font-size:calc(var(--u)*13.5);color:var(--suave);margin-bottom:calc(var(--u)*8)}
.f-moto-nome{display:flex;align-items:center;gap:calc(var(--u)*9);font-weight:600;color:var(--tinta);font-size:calc(var(--u)*14);margin-bottom:calc(var(--u)*6)}
.f-moto-nome svg{color:var(--laranja-txt)}
.f-preco{display:flex;justify-content:space-between;font-size:calc(var(--u)*13);color:var(--suave);margin-bottom:calc(var(--u)*10)}
.f-preco b{color:var(--tinta)}
input[type=range]{width:100%;appearance:none;-webkit-appearance:none;height:calc(var(--u)*4);border-radius:calc(var(--u)*4);outline:0;
 background:linear-gradient(90deg,var(--laranja) var(--p,100%),#DADDE1 var(--p,100%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:calc(var(--u)*20);height:calc(var(--u)*20);border-radius:50%;background:#fff;
 border:2px solid var(--laranja);box-shadow:0 2px calc(var(--u)*6) rgba(0,0,0,.2);cursor:grab}
input[type=range]::-moz-range-thumb{width:calc(var(--u)*18);height:calc(var(--u)*18);border-radius:50%;background:#fff;border:2px solid var(--laranja);cursor:grab}

.toolbar{display:flex;align-items:center;gap:calc(var(--u)*12);margin-bottom:calc(var(--u)*20);min-height:calc(var(--u)*44)}
.tb-filtro{display:none}
.ativos{display:flex;flex-wrap:wrap;gap:calc(var(--u)*6);flex:1}
.at{display:inline-flex;align-items:center;gap:calc(var(--u)*6);height:calc(var(--u)*30);padding:0 calc(var(--u)*8) 0 calc(var(--u)*12);border-radius:calc(var(--u)*30);background:var(--laranja-clara);
 color:var(--laranja-txt);font-size:calc(var(--u)*12.5);font-weight:600;animation:sobe .45s var(--mola) both}
.at svg{width:calc(var(--u)*14);height:calc(var(--u)*14)}
.at:hover{background:#FFE2D1}
.at-limpa{background:none;color:var(--suave);text-decoration:underline;text-underline-offset:calc(var(--u)*3)}
.ordem{position:relative;display:flex;align-items:center;gap:calc(var(--u)*8);font-size:calc(var(--u)*13);color:var(--suave);white-space:nowrap}
.ordem select{appearance:none;-webkit-appearance:none;height:calc(var(--u)*42);padding:0 calc(var(--u)*36) 0 calc(var(--u)*14);border-radius:calc(var(--u)*10);border:1.5px solid var(--linha);
 background:#fff;font-weight:600;font-size:calc(var(--u)*13.5);color:var(--tinta);cursor:pointer;outline:0}
.ordem select:focus{border-color:var(--laranja)}
.ordem .cv{position:absolute;right:calc(var(--u)*12);width:calc(var(--u)*15);height:calc(var(--u)*15);pointer-events:none;color:var(--tinta)}
.vista{display:flex;padding:calc(var(--u)*3);border-radius:calc(var(--u)*10);background:var(--cinza)}
.vista button{width:calc(var(--u)*36);height:calc(var(--u)*36);border-radius:calc(var(--u)*8);display:grid;place-items:center;color:var(--suave);transition:background .3s,color .3s}
.vista button.on{background:#fff;color:var(--tinta);box-shadow:var(--sombra)}

/* ── cartão de produto ─────────────────────────────────────── */
.pgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:calc(var(--u)*14)}
.pcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--linha);border-radius:calc(var(--u)*14);
 padding:calc(var(--u)*10) calc(var(--u)*10) calc(var(--u)*14);transition:box-shadow .5s var(--mola),transform .5s var(--mola),border-color .3s}
.pcard:hover{box-shadow:var(--sombra-alta);transform:translateY(calc(var(--u)*-4));border-color:transparent}
.pcard.entra{animation:entra .7s var(--mola) both;animation-delay:var(--e,0s)}
@keyframes entra{from{opacity:0;transform:translate3d(0,calc(var(--u)*22),0) scale(.98)}to{opacity:1;transform:none}}
.pc-foto{position:relative;aspect-ratio:1/1;border-radius:calc(var(--u)*10);background:var(--cinza);overflow:hidden;cursor:pointer}
.pc-foto img{width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply;transition:transform .8s var(--mola)}
.pcard:hover .pc-foto img{transform:scale(1.06)}
.pc-tags{position:absolute;top:calc(var(--u)*8);left:calc(var(--u)*8);display:flex;flex-direction:column;align-items:flex-start;gap:calc(var(--u)*4);z-index:1}
.pc-tag{font:800 calc(var(--u)*10)/1 var(--display);font-stretch:115%;letter-spacing:.08em;text-transform:uppercase;padding:calc(var(--u)*5) calc(var(--u)*7);border-radius:calc(var(--u)*5);
 background:var(--tinta);color:#fff}
.pc-tag.off{background:var(--laranja)}
.pc-tag.novo{background:#fff;color:var(--tinta);box-shadow:0 0 0 1px var(--linha)}
.pc-fav{position:absolute;top:calc(var(--u)*8);right:calc(var(--u)*8);z-index:1;width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:50%;display:grid;place-items:center;
 background:#fff;color:var(--tinta);box-shadow:0 2px calc(var(--u)*8) rgba(0,0,0,.08);transition:transform .45s var(--mola),color .3s}
.pc-fav svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}
.pc-fav:hover{transform:scale(1.12)}
.pc-fav.on{color:var(--vermelho)}
.pc-fav.on svg{fill:currentColor}
.pc-fav.pop{animation:pulo .5s var(--mola)}
.pc-quick{position:absolute;left:calc(var(--u)*8);right:calc(var(--u)*8);bottom:calc(var(--u)*8);z-index:1;display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*8);
 height:calc(var(--u)*36);border-radius:calc(var(--u)*9);background:rgba(14,16,19,.9);color:#fff;font-size:calc(var(--u)*12.5);font-weight:600;
 opacity:0;transform:translateY(calc(var(--u)*10));transition:opacity .35s ease,transform .5s var(--mola)}
.pc-quick svg{width:calc(var(--u)*16);height:calc(var(--u)*16)}
.pcard:hover .pc-quick{opacity:1;transform:none}
.pc-info{display:flex;flex-direction:column;flex:1;padding:calc(var(--u)*12) calc(var(--u)*4) 0}
.pc-marca{font:700 calc(var(--u)*10.5)/1 var(--display);font-stretch:115%;letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}
.pc-nome{margin-top:calc(var(--u)*6);font-size:calc(var(--u)*14);font-weight:600;line-height:1.35;color:var(--tinta);display:-webkit-box;-webkit-line-clamp:2;
 -webkit-box-orient:vertical;overflow:hidden;min-height:2.7em;cursor:pointer}
.pc-nome:hover{color:var(--laranja-txt)}
.pc-nota{display:flex;align-items:center;gap:calc(var(--u)*6);margin-top:calc(var(--u)*6);font-size:calc(var(--u)*12);color:var(--suave)}
.estrelas{display:inline-flex;gap:1px;color:var(--estrela)}
.estrelas svg{width:calc(var(--u)*12);height:calc(var(--u)*12)}
.estrelas .vz{color:#D5D9DE}
.pc-nota b{color:var(--tinta);font-weight:600}
.cmp{display:flex;align-items:center;gap:calc(var(--u)*7);margin-top:calc(var(--u)*10);padding:calc(var(--u)*6) calc(var(--u)*9);border-radius:calc(var(--u)*7);font-size:calc(var(--u)*11.5);font-weight:600;line-height:1.3;text-align:left;width:100%}
.cmp svg{width:calc(var(--u)*14);height:calc(var(--u)*14);flex:none}
.cmp.ok{background:var(--verde-bg);color:var(--verde)}
.cmp.uni{background:#EEF2F7;color:#3F5873}
.cmp.ver{background:var(--ambar-bg);color:var(--ambar)}
button.cmp.ver:hover{background:#FCEBC4}
.cmp u{text-underline-offset:2px}
.pc-preco{margin-top:calc(var(--u)*12)}
.pc-de{font-size:calc(var(--u)*12);color:var(--suave);text-decoration:line-through}
.pc-por{display:flex;align-items:baseline;gap:calc(var(--u)*8)}
.pc-por b{font:800 calc(var(--u)*22)/1.1 var(--display);font-stretch:105%;color:var(--tinta);letter-spacing:-.01em}
.pc-por .off{font-size:calc(var(--u)*12);font-weight:700;color:var(--verde)}
.pc-parc{font-size:calc(var(--u)*12);color:var(--suave);margin-top:2px}
.pc-pix{display:flex;align-items:center;gap:calc(var(--u)*5);font-size:calc(var(--u)*12);color:var(--verde);font-weight:600;margin-top:2px}
.pc-pix svg{width:calc(var(--u)*13);height:calc(var(--u)*13)}
.pc-acoes{display:flex;gap:calc(var(--u)*6);margin-top:calc(var(--u)*14);padding-top:0;margin-top:auto}
.pc-preco{margin-bottom:calc(var(--u)*14)}
.pc-comprar{flex:1;padding:calc(var(--u)*12) calc(var(--u)*10);font-size:calc(var(--u)*12)}
.pc-add{width:calc(var(--u)*44);flex:none;border-radius:calc(var(--u)*10);border:1.5px solid var(--linha);display:grid;place-items:center;color:var(--tinta);
 transition:background .3s,border-color .3s,color .3s,transform .45s var(--mola)}
.pc-add svg{width:calc(var(--u)*19);height:calc(var(--u)*19)}
.pc-add:hover{background:var(--tinta);border-color:var(--tinta);color:#fff}
.pc-add.ok{background:var(--verde);border-color:var(--verde);color:#fff}
.pcard.esgotado .pc-foto img{opacity:.55}
.pc-esg{position:absolute;inset:auto calc(var(--u)*8) calc(var(--u)*8);padding:calc(var(--u)*6);border-radius:calc(var(--u)*7);background:#fff;text-align:center;font-size:calc(var(--u)*11.5);font-weight:700;color:var(--suave)}

/* modo lista */
.pgrid.lista{grid-template-columns:1fr;gap:calc(var(--u)*10)}
.pgrid.lista .pcard{display:grid;grid-template-columns:calc(var(--u)*150) 1fr calc(var(--u)*220);gap:calc(var(--u)*20);align-items:center;padding:calc(var(--u)*10) calc(var(--u)*16) calc(var(--u)*10) calc(var(--u)*10)}
.pgrid.lista .pc-info{padding:0}
.pgrid.lista .pc-nome{min-height:0;font-size:calc(var(--u)*15)}
.pgrid.lista .pc-lado{display:flex;flex-direction:column}
.pgrid.lista .pc-acoes{margin-top:0}
.pc-lado{display:contents}
.pgrid.lista .pc-lado{display:flex}
.pc-spec{display:none;font-size:calc(var(--u)*13);color:var(--suave);margin-top:calc(var(--u)*6)}
.pgrid.lista .pc-spec{display:block}

.vazio{text-align:center;padding:calc(var(--u)*60) calc(var(--u)*20);border:1.5px dashed var(--linha);border-radius:var(--r-g)}
.vazio > svg{width:calc(var(--u)*36);height:calc(var(--u)*36);color:var(--suave);margin-bottom:calc(var(--u)*12)}
.vazio h3{font-size:calc(var(--u)*20);text-transform:uppercase}
.vazio p{max-width:calc(var(--u)*420);margin:calc(var(--u)*8) auto calc(var(--u)*20);font-size:calc(var(--u)*14)}
.mais{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*12);margin-top:calc(var(--u)*40)}
.mais p{font-size:calc(var(--u)*13);color:var(--suave)}
.mais-barra{width:calc(var(--u)*220);height:calc(var(--u)*3);border-radius:calc(var(--u)*3);background:var(--cinza-2);overflow:hidden}
.mais-barra i{display:block;height:100%;background:var(--laranja);width:0;transition:width .8s var(--mola)}
.mais .btn-o .seta{transition:transform .5s var(--mola)}
.mais .btn-o:hover .seta{transform:translateY(calc(var(--u)*3))}
.mais.fim .btn-o{display:none}

/* ══ 7 · MAIS VENDIDOS ═════════════════════════════════════════ */
.top{padding:calc(var(--u)*70) 0 calc(var(--u)*80);background:var(--cinza)}
.top .sechd{margin-bottom:calc(var(--u)*26)}
.trilho-bts{display:flex;gap:calc(var(--u)*8)}
.trilho{display:flex;gap:calc(var(--u)*14);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
 padding:calc(var(--u)*6) var(--gut) calc(var(--u)*20);scroll-padding-inline:var(--gut)}
.trilho::-webkit-scrollbar{display:none}
.trilho .pcard{flex:0 0 calc(var(--u)*248);scroll-snap-align:start}
.trilho .pc-rank{position:absolute;left:-2px;bottom:calc(var(--u)*-8);font:900 calc(var(--u)*64)/1 var(--display);font-stretch:125%;color:var(--tinta);
 -webkit-text-stroke:0;opacity:.07;pointer-events:none}

/* ══ 8 · KITS ══════════════════════════════════════════════════ */
.kits{padding:calc(var(--u)*90) 0}
.kgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*16)}
.kcard{display:flex;flex-direction:column;border-radius:var(--r-g);background:#fff;border:1px solid var(--linha);overflow:hidden;
 transition:transform .6s var(--mola),box-shadow .6s var(--mola)}
.kcard:hover{transform:translateY(calc(var(--u)*-6));box-shadow:var(--sombra-alta)}
.k-fotos{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--linha);aspect-ratio:16/11}
.k-fotos span{background:var(--cinza);display:grid;place-items:center;overflow:hidden}
.k-fotos img{width:88%;height:88%;object-fit:contain;mix-blend-mode:multiply;transition:transform .8s var(--mola)}
.kcard:hover .k-fotos img{transform:scale(1.07)}
.k-fotos.tres span:first-child{grid-row:span 2}
.k-fotos.dois{grid-template-columns:1fr 1fr}
.k-selo{position:absolute;z-index:1;top:calc(var(--u)*10);left:calc(var(--u)*10);font:800 calc(var(--u)*10.5)/1 var(--display);font-stretch:115%;letter-spacing:.08em;text-transform:uppercase;
 background:var(--laranja);color:#fff;padding:calc(var(--u)*6) calc(var(--u)*8);border-radius:calc(var(--u)*6)}
.k-corpo{display:flex;flex-direction:column;flex:1;padding:calc(var(--u)*18) calc(var(--u)*18) calc(var(--u)*18)}
.k-corpo small{font-size:calc(var(--u)*12);color:var(--suave);display:flex;align-items:center;gap:calc(var(--u)*6)}
.k-corpo small svg{width:calc(var(--u)*15);height:calc(var(--u)*15)}
.k-corpo h3{font-size:calc(var(--u)*19);text-transform:uppercase;margin-top:calc(var(--u)*6)}
.k-corpo ul{list-style:none;padding:0;margin:calc(var(--u)*14) 0 calc(var(--u)*16);display:grid;gap:calc(var(--u)*6);font-size:calc(var(--u)*13.5)}
.k-corpo li{display:flex;gap:calc(var(--u)*8);align-items:flex-start}
.k-corpo li svg{width:calc(var(--u)*15);height:calc(var(--u)*15);color:var(--verde);margin-top:calc(var(--u)*3)}
.k-preco{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u)*10);padding-top:calc(var(--u)*14);border-top:1px solid var(--linha)}
.k-preco s{display:block;font-size:calc(var(--u)*12.5);color:var(--suave)}
.k-preco b{font:800 calc(var(--u)*26)/1 var(--display);color:var(--tinta)}
.k-preco em{display:block;font-size:calc(var(--u)*12);font-weight:700;color:var(--verde);margin-top:calc(var(--u)*4)}
.k-preco .btn{padding:calc(var(--u)*12) calc(var(--u)*16);font-size:calc(var(--u)*12)}

/* ══ 9 · MARCAS ════════════════════════════════════════════════ */
.marcas{padding:calc(var(--u)*80) 0;background:var(--preto);color:#fff}
.marcas h2{color:#fff}
.marcas .kicker{color:var(--laranja-2)}
.mgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--linha-esc);border-radius:var(--r-g);overflow:hidden;
 border:1px solid var(--linha-esc)}
.mcard{position:relative;display:grid;place-items:center;height:calc(var(--u)*118);background:var(--preto);color:#C9CDD2;overflow:hidden;
 transition:background .4s,color .3s}
.mcard b{font-family:var(--display);font-size:calc(var(--u)*26);letter-spacing:-.01em;transition:transform .55s var(--mola)}
.mcard small{position:absolute;bottom:calc(var(--u)*14);left:0;right:0;text-align:center;font-size:calc(var(--u)*11.5);color:var(--laranja-2);
 opacity:0;transform:translateY(calc(var(--u)*8));transition:opacity .3s,transform .5s var(--mola)}
.mcard:hover{background:var(--grafite-2);color:#fff}
.mcard:hover b{transform:translateY(calc(var(--u)*-10)) scale(1.04)}
.mcard:hover small{opacity:1;transform:none}
/* cada marca num desenho de letra próprio — não são as logos oficiais */
.mk-ngk b{font-weight:900;font-stretch:125%;letter-spacing:.06em}
.mk-cobreq b{font-weight:800;font-style:italic;font-stretch:100%}
.mk-riffel b{font-weight:900;font-style:italic;font-stretch:120%;text-transform:uppercase}
.mk-motul b{font-weight:900;font-stretch:88%;text-transform:uppercase;letter-spacing:.02em}
.mk-magnetron b{font-weight:700;font-stretch:125%;text-transform:uppercase;font-size:calc(var(--u)*20);letter-spacing:.14em}
.mk-bosch b{font-weight:800;font-stretch:100%;text-transform:uppercase}
.mk-michelin b{font-weight:900;font-style:italic;font-stretch:112%;text-transform:uppercase;font-size:calc(var(--u)*23)}
.mk-pirelli b{font-weight:900;font-stretch:118%;text-transform:uppercase;font-size:calc(var(--u)*24)}
.mk-moura b{font-weight:800;font-stretch:108%;text-transform:lowercase;font-size:calc(var(--u)*30)}
.mk-kn b{font-weight:900;font-stretch:125%;font-size:calc(var(--u)*32)}

/* ══ 10 · GARAGEM ══════════════════════════════════════════════ */
.garagem{padding:calc(var(--u)*90) 0}
.ggrid{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:calc(var(--u)*16)}
.gcard{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:calc(var(--u)*230);border-radius:var(--r-g);overflow:hidden;
 background:var(--preto);color:#fff;isolation:isolate;padding:calc(var(--u)*22)}
.gcard:first-child{grid-row:span 2}
.gcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.85;transition:transform 1.1s var(--mola)}
.gcard::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(11,12,14,.92))}
.gcard:hover img{transform:scale(1.07)}
.g-meta{display:flex;align-items:center;gap:calc(var(--u)*10);font-size:calc(var(--u)*12);color:#C9CDD2;margin-bottom:calc(var(--u)*10)}
.g-meta span:first-child{background:var(--laranja);color:#fff;font-weight:700;padding:calc(var(--u)*4) calc(var(--u)*8);border-radius:calc(var(--u)*5);text-transform:uppercase;letter-spacing:.06em;font-size:calc(var(--u)*10.5)}
.g-meta svg{width:calc(var(--u)*14);height:calc(var(--u)*14)}
.gcard h3{color:#fff;font-size:calc(var(--u)*19);line-height:1.2;font-stretch:105%}
.gcard:first-child h3{font-size:calc(var(--u)*28)}
.g-ler{display:inline-flex;align-items:center;gap:calc(var(--u)*8);margin-top:calc(var(--u)*12);font-size:calc(var(--u)*13);font-weight:600;color:#fff;opacity:.75;transition:opacity .3s,gap .4s var(--mola)}
.gcard:hover .g-ler{opacity:1;gap:calc(var(--u)*12)}
.g-ler svg{width:calc(var(--u)*15);height:calc(var(--u)*15)}

/* ══ 11 · BENEFÍCIOS ═══════════════════════════════════════════ */
.benef{border-top:1px solid var(--linha);border-bottom:1px solid var(--linha)}
.bgrid{display:grid;grid-template-columns:repeat(5,1fr)}
.bn{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:calc(var(--u)*14);align-items:center;padding:calc(var(--u)*28) calc(var(--u)*20);
 border-right:1px solid var(--linha)}
.bn:last-child{border-right:0}
.bn i{grid-row:span 2;width:calc(var(--u)*48);height:calc(var(--u)*48);border-radius:calc(var(--u)*12);display:grid;place-items:center;background:var(--laranja-clara);color:var(--laranja-txt);
 transition:transform .55s var(--mola),background .3s,color .3s}
.bn:hover i{transform:rotate(-8deg) scale(1.08);background:var(--laranja);color:#fff}
.bn i svg{width:calc(var(--u)*23);height:calc(var(--u)*23)}
.bn b{font:800 calc(var(--u)*13)/1.2 var(--display);font-stretch:115%;letter-spacing:.04em;text-transform:uppercase;color:var(--tinta)}
.bn small{font-size:calc(var(--u)*12.5);color:var(--suave)}

/* ══ 12 · NEWSLETTER ═══════════════════════════════════════════ */
.news{position:relative;background:var(--preto);color:#fff;overflow:hidden;isolation:isolate}
.news > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;z-index:-2;opacity:.55}
.news::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--preto) 20%,rgba(11,12,14,.6) 60%,rgba(11,12,14,.3))}
.news-in{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*40);align-items:center;padding:calc(var(--u)*90) 0}
.news .kicker{color:var(--laranja-2)}
.news h2{color:#fff;font-size:clamp(calc(var(--u)*38),4.5vw,calc(var(--u)*64));font-weight:900;text-transform:uppercase;line-height:.95}
.news p{margin-top:calc(var(--u)*16);color:#B9BEC5;max-width:calc(var(--u)*420)}
.news-form{display:flex;gap:calc(var(--u)*8);padding:calc(var(--u)*8);border-radius:calc(var(--u)*14);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
 backdrop-filter:blur(calc(var(--u)*10))}
.news-form label{flex:1;display:flex;align-items:center;gap:calc(var(--u)*10);padding-left:calc(var(--u)*14)}
.news-form label svg{color:#9AA0A8}
.news-form input{flex:1;min-width:0;height:calc(var(--u)*48);border:0;outline:0;background:none;color:#fff;font-size:calc(var(--u)*15)}
.news-form input::placeholder{color:#8A9098}
.news-form.ok{border-color:var(--verde)}

/* ══ RODAPÉ ════════════════════════════════════════════════════ */
.rod{background:#070809;color:#9AA0A8;padding:calc(var(--u)*70) 0 0;font-size:calc(var(--u)*14)}
.rodtop{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:calc(var(--u)*40);padding-bottom:calc(var(--u)*50)}
.rod-marca p{margin:calc(var(--u)*18) 0 calc(var(--u)*22);max-width:calc(var(--u)*300);line-height:1.65}
.rod-soc{display:flex;gap:calc(var(--u)*8)}
.rod-soc a{width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:calc(var(--u)*10);display:grid;place-items:center;border:1px solid var(--linha-esc);color:#C9CDD2;
 transition:background .3s,color .3s,transform .45s var(--mola)}
.rod-soc a:hover{background:var(--laranja);color:#fff;border-color:var(--laranja);transform:translateY(calc(var(--u)*-3))}
.rodcol h4{color:#fff;font-size:calc(var(--u)*13);letter-spacing:.12em;text-transform:uppercase;margin-bottom:calc(var(--u)*18)}
.rodcol a{display:block;padding:calc(var(--u)*5) 0;transition:color .3s,transform .4s var(--mola)}
.rodcol a:hover{color:#fff;transform:translateX(calc(var(--u)*4))}
.rodbase{display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*20);padding:calc(var(--u)*22) 0;border-top:1px solid var(--linha-esc);font-size:calc(var(--u)*12.5)}
.rod-pag{display:flex;gap:calc(var(--u)*8)}
.rod-pag span{display:inline-flex;align-items:center;gap:calc(var(--u)*6);height:calc(var(--u)*30);padding:0 calc(var(--u)*12);border-radius:calc(var(--u)*6);font-weight:700;font-size:calc(var(--u)*12)}
.mk-ml{background:#FFE600;color:#2D3277}
.mk-sh{background:#EE4D2D;color:#fff}
.mk-pix{background:#fff;color:#1A8F7E}
.mk-pix svg{width:calc(var(--u)*14);height:calc(var(--u)*14)}

/* ══ FLUTUANTES ════════════════════════════════════════════════ */
.zap{position:fixed;right:calc(var(--u)*22);bottom:calc(var(--u)*22);z-index:800;width:calc(var(--u)*58);height:calc(var(--u)*58);border-radius:50%;display:grid;place-items:center;
 background:#25D366;color:#fff;box-shadow:0 calc(var(--u)*14) calc(var(--u)*30) calc(var(--u)*-10) rgba(37,211,102,.7);transition:transform .5s var(--mola)}
.zap svg{width:calc(var(--u)*30);height:calc(var(--u)*30)}
.zap:hover{transform:scale(1.08) rotate(-6deg)}
.zap::before{content:'';position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:onda-z 2.4s ease-out infinite}
@keyframes onda-z{from{transform:scale(1);opacity:.8}to{transform:scale(1.6);opacity:0}}
.tabbar{display:none}

.toast{position:fixed;left:50%;bottom:calc(var(--u)*30);z-index:1500;display:flex;align-items:center;gap:calc(var(--u)*10);padding:calc(var(--u)*13) calc(var(--u)*18);border-radius:calc(var(--u)*12);
 background:var(--tinta);color:#fff;font-size:calc(var(--u)*14);font-weight:500;box-shadow:var(--sombra-alta);
 transform:translate(-50%,calc(var(--u)*30));opacity:0;pointer-events:none;transition:transform .5s var(--mola),opacity .3s}
.toast.on{transform:translate(-50%,0);opacity:1}
.toast svg{width:calc(var(--u)*18);height:calc(var(--u)*18);color:#7EE0A1}

/* ══ CAMADAS ═══════════════════════════════════════════════════ */
.veu{position:fixed;inset:0;z-index:1000;background:rgba(8,9,11,.55);backdrop-filter:blur(calc(var(--u)*3));opacity:0;visibility:hidden;
 transition:opacity .4s ease,visibility 0s .4s}
.veu.on{opacity:1;visibility:visible;transition-delay:0s}
.gav{position:fixed;top:0;right:0;bottom:0;z-index:1100;width:min(calc(var(--u)*440),100%);background:#fff;display:flex;flex-direction:column;
 transform:translateX(100%);transition:transform .6s var(--mola);box-shadow:calc(var(--u)*-20) 0 calc(var(--u)*60) calc(var(--u)*-20) rgba(0,0,0,.4)}
.gav.on{transform:none}
.gav-e{left:0;right:auto;transform:translateX(-100%);background:var(--preto);color:#fff;width:min(calc(var(--u)*340),88%)}
.gav-hd{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--u)*10);padding:calc(var(--u)*16) calc(var(--u)*16) calc(var(--u)*16) calc(var(--u)*22);border-bottom:1px solid var(--linha)}
.gav-e .gav-hd{border-color:var(--linha-esc)}
.gav-hd .icb:hover{background:var(--cinza)}
.gav-e .gav-hd .icb:hover{background:rgba(255,255,255,.08)}
.gav-abas{display:flex;gap:calc(var(--u)*4);padding:calc(var(--u)*4);border-radius:calc(var(--u)*10);background:var(--cinza)}
.gav-abas button{display:flex;align-items:center;gap:calc(var(--u)*6);padding:calc(var(--u)*8) calc(var(--u)*14);border-radius:calc(var(--u)*8);font-weight:600;font-size:calc(var(--u)*13.5);color:var(--suave);transition:background .3s,color .3s}
.gav-abas button.on{background:#fff;color:var(--tinta);box-shadow:var(--sombra)}
.gav-abas i{font-style:normal;font-size:calc(var(--u)*11.5);min-width:calc(var(--u)*18);height:calc(var(--u)*18);border-radius:calc(var(--u)*9);background:var(--cinza-2);display:grid;place-items:center;padding:0 calc(var(--u)*5)}
.gav-abas button.on i{background:var(--laranja);color:#fff}
.gav-frete{padding:calc(var(--u)*14) calc(var(--u)*22);font-size:calc(var(--u)*13);border-bottom:1px solid var(--linha)}
.gav-frete:empty{display:none}
.gav-frete b{color:var(--tinta)}
.gav-frete .fb{height:calc(var(--u)*5);border-radius:calc(var(--u)*5);background:var(--cinza-2);margin-top:calc(var(--u)*8);overflow:hidden}
.gav-frete .fb i{display:block;height:100%;background:var(--verde);transition:width .7s var(--mola)}
.gav-corpo{flex:1;overflow:auto;padding:calc(var(--u)*8) calc(var(--u)*22)}
.gi{display:grid;grid-template-columns:calc(var(--u)*70) 1fr auto;gap:calc(var(--u)*12);padding:calc(var(--u)*14) 0;border-bottom:1px solid var(--linha);animation:sobe .5s var(--mola) both}
.gi img{width:calc(var(--u)*70);height:calc(var(--u)*70);border-radius:calc(var(--u)*10);background:var(--cinza);object-fit:contain;padding:calc(var(--u)*6);mix-blend-mode:multiply}
.gi h5{margin:0;font-size:calc(var(--u)*13.5);font-weight:600;color:var(--tinta);line-height:1.35}
.gi small{display:block;font-size:calc(var(--u)*12);color:var(--suave);margin-top:calc(var(--u)*3)}
.gi-q{display:inline-flex;align-items:center;margin-top:calc(var(--u)*8);border:1px solid var(--linha);border-radius:calc(var(--u)*8)}
.gi-q button{width:calc(var(--u)*28);height:calc(var(--u)*28);display:grid;place-items:center}
.gi-q svg{width:calc(var(--u)*14);height:calc(var(--u)*14)}
.gi-q span{min-width:calc(var(--u)*24);text-align:center;font-size:calc(var(--u)*13);font-weight:600}
.gi-lado{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between}
.gi-lado b{font-size:calc(var(--u)*14.5);color:var(--tinta)}
.gi-lado button{color:var(--suave)}
.gi-lado button:hover{color:var(--vermelho)}
.gi-mkt{display:flex;gap:calc(var(--u)*6);margin-top:calc(var(--u)*8)}
.gi-mkt a{font-size:calc(var(--u)*11);font-weight:700;padding:calc(var(--u)*4) calc(var(--u)*7);border-radius:calc(var(--u)*5)}
.gav-vazio{text-align:center;padding:calc(var(--u)*60) calc(var(--u)*10);color:var(--suave)}
.gav-vazio > svg{width:calc(var(--u)*40);height:calc(var(--u)*40);margin-bottom:calc(var(--u)*10);color:#C4C9CF}
.gav-vazio b{display:block;color:var(--tinta);font-size:calc(var(--u)*16);margin-bottom:calc(var(--u)*4)}
.gav-pe{padding:calc(var(--u)*18) calc(var(--u)*22) calc(var(--u)*22);border-top:1px solid var(--linha);background:#fff}
.gav-pe:empty{display:none}
.gp-tot{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:calc(var(--u)*4)}
.gp-tot span{font-size:calc(var(--u)*14)}
.gp-tot b{font:800 calc(var(--u)*24)/1 var(--display);color:var(--tinta)}
.gp-pix{font-size:calc(var(--u)*12.5);color:var(--verde);font-weight:600;margin-bottom:calc(var(--u)*14);text-align:right}
.gav-pe .btn{width:100%}
.btn-zap{background:#25D366;color:#fff;box-shadow:0 calc(var(--u)*12) calc(var(--u)*26) calc(var(--u)*-14) rgba(37,211,102,.9)}
.btn-zap:hover{background:#1FBF5B}
.gp-obs{font-size:calc(var(--u)*12);color:var(--suave);text-align:center;margin-top:calc(var(--u)*10);line-height:1.5}
.gm-links{padding:calc(var(--u)*10) calc(var(--u)*12)}
.gm-links a,.gm-links button{display:flex;align-items:center;gap:calc(var(--u)*14);width:100%;padding:calc(var(--u)*13) calc(var(--u)*10);border-radius:calc(var(--u)*10);font-weight:600;font-size:calc(var(--u)*15);color:#E4E6EA;text-align:left}
.gm-links a:hover,.gm-links button:hover{background:rgba(255,255,255,.06)}
.gm-links svg{color:var(--laranja-2)}
.gm-links hr{border:0;height:1px;background:var(--linha-esc);margin:calc(var(--u)*8) calc(var(--u)*10)}

/* modais: centro no desktop, folha de baixo no celular */
.modal{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;padding:calc(var(--u)*24);visibility:hidden;pointer-events:none}
.modal.on{visibility:visible;pointer-events:auto}
.md-caixa{position:relative;width:min(calc(var(--u)*560),100%);max-height:calc(100vh - calc(var(--u)*48));overflow:auto;background:#fff;border-radius:calc(var(--u)*22);
 box-shadow:var(--sombra-alta);opacity:0;transform:translateY(calc(var(--u)*24)) scale(.98);transition:opacity .35s ease,transform .6s var(--mola)}
.modal.on .md-caixa{opacity:1;transform:none}
.md-fecha{position:absolute;top:calc(var(--u)*14);right:calc(var(--u)*14);z-index:2;width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:50%;background:#fff;display:grid;place-items:center;
 box-shadow:0 2px calc(var(--u)*10) rgba(0,0,0,.1)}
.md-fecha svg{width:calc(var(--u)*18);height:calc(var(--u)*18)}
.md-alca{display:none}

.qv{width:min(calc(var(--u)*980),100%);display:grid;grid-template-columns:1.05fr 1fr}
.qv-foto{position:relative;background:var(--cinza);display:grid;place-items:center;min-height:calc(var(--u)*460)}
.qv-foto img{width:84%;max-height:calc(var(--u)*420);object-fit:contain;mix-blend-mode:multiply}
.qv-foto .pc-tags{top:calc(var(--u)*18);left:calc(var(--u)*18)}
.qv-info{padding:calc(var(--u)*34) calc(var(--u)*34) calc(var(--u)*30)}
.qv-info .pc-marca{font-size:calc(var(--u)*11.5)}
.qv-info h3{font-size:calc(var(--u)*24);line-height:1.15;margin:calc(var(--u)*8) 0 calc(var(--u)*10);font-stretch:105%}
.qv-cod{font-size:calc(var(--u)*12);color:var(--suave);margin-left:auto;margin-right:calc(var(--u)*44)}
.qv-info .pc-nota{margin:0}
.qv-info .cmp{font-size:calc(var(--u)*13);padding:calc(var(--u)*10) calc(var(--u)*12);margin-top:calc(var(--u)*16)}
.qv-preco{margin:calc(var(--u)*18) 0 calc(var(--u)*6)}
.qv-preco .pc-por b{font-size:calc(var(--u)*34)}
.qv-spec{margin:calc(var(--u)*16) 0 0;padding:calc(var(--u)*14) 0;border-top:1px solid var(--linha);border-bottom:1px solid var(--linha);display:grid;gap:calc(var(--u)*8);font-size:calc(var(--u)*13.5)}
.qv-spec div{display:flex;gap:calc(var(--u)*10)}
.qv-spec dt{color:var(--suave);min-width:calc(var(--u)*110)}
.qv-spec dd{margin:0;color:var(--tinta);font-weight:500}
.qv-comp{margin-top:calc(var(--u)*6);font-size:calc(var(--u)*12.5);color:var(--suave);line-height:1.5}
.qv-bts{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*8);margin-top:calc(var(--u)*20)}
.qv-bts .btn,.qv-bts .btn-o{padding:calc(var(--u)*15) calc(var(--u)*12);font-size:calc(var(--u)*12.5)}
.qv-bts .qv-zap{grid-column:1/-1}
.btn-ml{background:#FFE600;color:#2D3277;box-shadow:none}
.btn-ml:hover{background:#FFEF4D;box-shadow:0 calc(var(--u)*14) calc(var(--u)*28) calc(var(--u)*-16) rgba(200,180,0,.9)}
.btn-sh{background:#EE4D2D;color:#fff;box-shadow:none}
.btn-sh:hover{background:#FF5F3F;box-shadow:0 calc(var(--u)*14) calc(var(--u)*28) calc(var(--u)*-16) rgba(238,77,45,.9)}
.qv-add{grid-column:1/-1}

.cp,.mm,.cm{padding:calc(var(--u)*32) calc(var(--u)*30) calc(var(--u)*28)}
.cp h3,.mm h3,.cm h3{font-size:calc(var(--u)*22);text-transform:uppercase;padding-right:calc(var(--u)*40)}
.cp > p,.mm > p,.cm > p{font-size:calc(var(--u)*14);color:var(--suave);margin:calc(var(--u)*8) 0 calc(var(--u)*20)}
.cp-prod{display:flex;align-items:center;gap:calc(var(--u)*12);padding:calc(var(--u)*10);border-radius:calc(var(--u)*12);background:var(--cinza);margin:0 0 calc(var(--u)*20)}
.cp-prod img{width:calc(var(--u)*56);height:calc(var(--u)*56);object-fit:contain;mix-blend-mode:multiply}
.cp-prod b{font-size:calc(var(--u)*13.5);color:var(--tinta);line-height:1.35}
.passos{display:grid;gap:calc(var(--u)*10)}
.passos .sc{width:100%}
.cp-res{margin-top:calc(var(--u)*18);padding:calc(var(--u)*18);border-radius:calc(var(--u)*14);display:flex;gap:calc(var(--u)*14);align-items:flex-start;animation:sobe .5s var(--mola) both}
.cp-res > i{width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:50%;display:grid;place-items:center;flex:none;color:#fff}
.cp-res b{display:block;color:var(--tinta);font-size:calc(var(--u)*15.5)}
.cp-res p{font-size:calc(var(--u)*13.5);margin-top:calc(var(--u)*3)}
.cp-res .link-t{margin-top:calc(var(--u)*10)}
.cp-res.sim{background:var(--verde-bg)}
.cp-res.sim > i{background:var(--verde)}
.cp-res.nao{background:#FDECEC}
.cp-res.nao > i{background:var(--vermelho)}
.cp-res.uni{background:#EEF2F7}
.cp-res.uni > i{background:#3F5873}
.mm-marcas{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*8);margin-bottom:calc(var(--u)*14)}
.mm-marcas button{height:calc(var(--u)*52);border-radius:calc(var(--u)*12);border:1.5px solid var(--linha);font-weight:700;font-size:calc(var(--u)*13);color:var(--tinta);
 transition:border-color .3s,background .3s,color .3s}
.mm-marcas button:hover{border-color:var(--tinta)}
.mm-marcas button.on{background:var(--tinta);border-color:var(--tinta);color:#fff}
.mm .sel-ir{width:100%;margin-top:calc(var(--u)*14)}
.mm-tirar{display:block;margin:calc(var(--u)*14) auto 0;font-size:calc(var(--u)*13);color:var(--suave);text-decoration:underline;text-underline-offset:calc(var(--u)*3)}
.cm-lista{display:grid;gap:calc(var(--u)*10)}
.cm-op{display:flex;align-items:center;gap:calc(var(--u)*14);padding:calc(var(--u)*14) calc(var(--u)*16);border-radius:calc(var(--u)*14);border:1.5px solid var(--linha);
 transition:border-color .3s,transform .45s var(--mola),box-shadow .45s var(--mola)}
.cm-op:hover{border-color:var(--tinta);transform:translateY(-2px);box-shadow:var(--sombra)}
.cm-op > i{width:calc(var(--u)*46);height:calc(var(--u)*46);border-radius:calc(var(--u)*12);display:grid;place-items:center;flex:none;font-style:normal;font:900 calc(var(--u)*13)/1 var(--display)}
.cm-op span{flex:1}
.cm-op b{display:block;color:var(--tinta);font-size:calc(var(--u)*15)}
.cm-op small{font-size:calc(var(--u)*12.5);color:var(--suave)}
.cm-op strong{font-size:calc(var(--u)*15);color:var(--tinta)}
.cm-op .seta{color:var(--suave)}
.cm-ml > i{background:#FFE600;color:#2D3277}
.cm-sh > i{background:#EE4D2D;color:#fff}
.cm-zap > i{background:var(--laranja);color:#fff}
.cm-zap > i svg{width:calc(var(--u)*24);height:calc(var(--u)*24)}
.cm-zap{border-color:var(--laranja)}
.cm-zap strong{color:var(--verde)}

/* ══ REVEAL — mesmo sistema [data-rv] dos sites anteriores ══════ */
.anim [data-rv]{opacity:0;transform:translate3d(0,calc(var(--u)*26),0);
 transition:opacity .85s var(--mola) var(--d,0s),transform .95s var(--mola) var(--d,0s)}
.anim [data-rv="left"]{transform:translate3d(calc(var(--u)*-34),0,0)}
.anim [data-rv="right"]{transform:translate3d(calc(var(--u)*34),0,0)}
.anim [data-rv="zoom"]{transform:scale(.95)}
.anim [data-rv].in{opacity:1;transform:none}
.anim [data-wave]{opacity:0;transform:translate3d(0,calc(var(--u)*34),0) scale(.97);
 transition:opacity 1s var(--mola) var(--wd,0s),transform 1s var(--mola) var(--wd,0s)}
.anim [data-wave].wv-in{opacity:1;transform:none}
.cursor{display:inline-block;width:calc(var(--u)*3);height:.8em;background:var(--laranja);margin-left:calc(var(--u)*4);vertical-align:-2px;animation:pisca 1s steps(1) infinite}
@keyframes pisca{50%{opacity:0}}
.cursor.off{display:none}

@media (prefers-reduced-motion:reduce){
 *{animation:none!important;transition-duration:.01ms!important}
 html{scroll-behavior:auto}
}


/* ══════════════════════════════════════════════════════════════
   MODELO DA PÁGINA INICIAL (referência de desktop enviada em 30/09)
   Faixa de cima com avisos à esquerda e atendimento à direita,
   ícones com legenda, menu de categorias com ícones, hero com faixa
   de confiança, seletor em linha e categorias com título ao lado.
   Fica antes do responsivo: o celular sobrescreve o que precisar.
   ══════════════════════════════════════════════════════════════ */
.topbar{height:calc(var(--u)*35);background:#08090A}
.tb-in{display:flex;align-items:center;justify-content:space-between;height:calc(var(--u)*35)}
.tb-trilho{justify-content:flex-start;gap:calc(var(--u)*46);height:auto;font-size:calc(var(--u)*12.5);color:#D5D8DC}
.tb-trilho svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}
.tb-dir{display:flex;gap:calc(var(--u)*32)}
.tb-dir a{display:inline-flex;align-items:center;gap:calc(var(--u)*8);font-size:calc(var(--u)*12.5);color:#D5D8DC;transition:color .3s}
.tb-dir a:hover{color:#fff}
.tb-dir svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}

.navtop{height:calc(var(--u)*94);gap:calc(var(--u)*22)}
.nav.compact .navtop{height:calc(var(--u)*70)}
.logo .mk{width:calc(var(--u)*50);height:calc(var(--u)*31)}
.logo b{font-size:calc(var(--u)*31)}
.logo small{font-size:calc(var(--u)*10.5);letter-spacing:.52em;margin-top:calc(var(--u)*7)}
.busca{height:calc(var(--u)*50);border-radius:calc(var(--u)*8);max-width:none;margin-left:calc(var(--u)*18)}
.busca input{font-size:calc(var(--u)*15);padding-left:calc(var(--u)*52)}
.busca .lupa{left:calc(var(--u)*18);width:calc(var(--u)*20);height:calc(var(--u)*20)}
.bx-ir{height:calc(var(--u)*42);margin:calc(var(--u)*4);padding:0 calc(var(--u)*24);border-radius:calc(var(--u)*6);font-size:calc(var(--u)*14)}
.minhamoto-bt{height:calc(var(--u)*56);border-radius:calc(var(--u)*8);padding:0 calc(var(--u)*18) 0 calc(var(--u)*8);gap:calc(var(--u)*12)}
.mm-ico{width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:calc(var(--u)*8)}
.navicons{gap:calc(var(--u)*6)}
.ic-rot{position:relative;display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*6);padding:calc(var(--u)*4) calc(var(--u)*12);color:#fff;
 font-size:calc(var(--u)*12.5);line-height:1;transition:color .3s}
.ic-rot svg{width:calc(var(--u)*27);height:calc(var(--u)*27);stroke-width:1.6;transition:transform .45s var(--mola)}
.ic-rot:hover{color:var(--laranja-2)}
.ic-rot:hover svg{transform:translateY(calc(var(--u)*-2))}
.ic-rot .badge{top:calc(var(--u)*-6);right:calc(var(--u)*4)}

.navcats{height:calc(var(--u)*52);background:#101215}
.nav.compact .navcats{height:calc(var(--u)*48)}
.nc-in{justify-content:flex-start;gap:calc(var(--u)*44);overflow:visible}
.nc-in a{gap:calc(var(--u)*10);padding:0 calc(var(--u)*4);font:500 calc(var(--u)*13.5)/1 'Inter',sans-serif;letter-spacing:0;text-transform:none;color:#D5D8DC}
.nc-in a::after{left:0;right:100%;height:calc(var(--u)*3);border-radius:calc(var(--u)*2)}
.nc-in a:hover::after,.nc-in a.active::after{right:0}
.nc-in svg{width:calc(var(--u)*20);height:calc(var(--u)*20);color:#C9CDD2;stroke-width:1.6;transition:color .3s}
.nc-in a:hover svg{color:var(--laranja-2)}
.nc-todas{background:none;margin-right:0;padding:0 calc(var(--u)*12)!important;color:var(--laranja-2)!important;font-weight:600!important}
.nc-todas svg{color:var(--laranja-2)!important}
.nc-todas::after{display:block!important;right:0!important}

/* hero: a foto ocupa a altura e encosta na direita; o texto vive no
   escuro da esquerda. Altura: a tela inicial menos uma fresta onde o
   seletor aparece, como no modelo. */
/* a altura vai até sobrar lugar para o seletor inteiro na primeira
   tela; se o conteúdo pedir mais, ela cresce */
.hero{height:auto;min-height:max(calc(var(--u)*500),calc(100svh - var(--hdr) - calc(var(--u)*122)))}
@media (min-width:821px){
 /* 10% mais larga que a proporção da foto: corta um pouco de céu e
    de asfalto e a moto cresce, como no modelo */
 .hero-foto{inset:0 0 0 auto;width:auto;height:100%;aspect-ratio:1.96/1;min-width:62%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 24%);mask-image:linear-gradient(90deg,transparent,#000 24%)}
 .hero-foto img{object-position:50% 42%}
 .hero-veu{background:linear-gradient(90deg,var(--preto) 0%,rgba(11,12,14,.92) 26%,rgba(11,12,14,.55) 44%,transparent 62%),
  linear-gradient(0deg,rgba(11,12,14,.6),transparent 26%)}
 .hero-in{align-items:flex-start;min-height:inherit;padding:calc(var(--u)*46) 0 calc(var(--u)*58)}
}
.hcopy{max-width:calc(var(--u)*680)}
.kicker-barra{display:flex;align-items:center;gap:calc(var(--u)*16);font-size:calc(var(--u)*12.5);letter-spacing:.34em;margin-bottom:calc(var(--u)*16)}
.kicker-barra::before{content:'';width:calc(var(--u)*3);height:calc(var(--u)*16);background:var(--laranja)}
.hcopy h1{font-size:calc(var(--u)*82);font-stretch:100%;font-weight:900;line-height:.9;letter-spacing:-.035em}
.hcopy > p{margin-top:calc(var(--u)*16);font-size:calc(var(--u)*19.5);line-height:1.4;color:rgba(255,255,255,.9);max-width:calc(var(--u)*500)}
.hbts{gap:calc(var(--u)*20);margin-top:calc(var(--u)*26)}
.hero .hbts .btn,.hero .hbts .btn-o{height:calc(var(--u)*54);padding:0 calc(var(--u)*36);border-radius:calc(var(--u)*6);font-size:calc(var(--u)*16.5);letter-spacing:.02em}
.hero .hbts .btn-o-esc{border:1.5px solid rgba(255,255,255,.85)}
.hselos{display:flex;margin-top:calc(var(--u)*32)}
.hselos span{display:flex;align-items:center;gap:calc(var(--u)*16);padding:0 calc(var(--u)*28);border-left:1px solid rgba(255,255,255,.2);
 font:600 calc(var(--u)*12)/1.45 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#E4E6EA}
.hselos span:first-child{padding-left:0;border-left:0}
.hselos svg{width:calc(var(--u)*34);height:calc(var(--u)*34);color:var(--laranja);stroke-width:1.6}

/* seletor em linha, com divisória entre título e campos */
.seletor{margin-top:calc(var(--u)*-46)}
.sel-card{padding:calc(var(--u)*22) calc(var(--u)*28);border-radius:calc(var(--u)*10)}
.sel-escolha{grid-template-columns:auto minmax(0,1fr);gap:0 calc(var(--u)*28)}
.sel-tit{gap:calc(var(--u)*20);padding-right:calc(var(--u)*28);border-right:1px solid var(--linha);align-self:stretch}
.sel-ico{width:calc(var(--u)*66);height:calc(var(--u)*66);border-radius:calc(var(--u)*10)}
.sel-ico svg{width:calc(var(--u)*32);height:calc(var(--u)*32)}
.sel-tit h2{font-size:calc(var(--u)*19);line-height:1.1;max-width:calc(var(--u)*210)}
.sel-tit p{font-size:calc(var(--u)*12.5);max-width:calc(var(--u)*230);margin-top:calc(var(--u)*8)}
.sel-campos{grid-template-columns:1fr 1fr .8fr auto;gap:calc(var(--u)*18);align-items:stretch}
.sc{padding:calc(var(--u)*11) calc(var(--u)*40) calc(var(--u)*11) calc(var(--u)*15);border-radius:calc(var(--u)*6)}
.sc small{font-size:calc(var(--u)*10.5);letter-spacing:.07em;margin-bottom:calc(var(--u)*3)}
.sc small i{display:none}
.sc select{font-size:calc(var(--u)*15.5);font-weight:500}
.sel-ir{min-height:calc(var(--u)*62);padding:0 calc(var(--u)*28);border-radius:calc(var(--u)*6);font-size:calc(var(--u)*16.5);letter-spacing:.02em}
.sel-manual{display:none}
.sc.falta{border-color:var(--laranja);animation:treme .45s ease}
@keyframes treme{20%,60%{transform:translateX(calc(var(--u)*-5))}40%,80%{transform:translateX(calc(var(--u)*5))}}

/* categorias: título à esquerda, cartões de foto à direita */
.cats{padding:calc(var(--u)*74) 0 calc(var(--u)*84)}
.cats-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:calc(var(--u)*52);align-items:start}
.kicker-linha{display:flex;align-items:center;gap:calc(var(--u)*16);letter-spacing:.32em;font-size:calc(var(--u)*12.5)}
.kicker-linha::before{content:'';width:calc(var(--u)*30);height:2px;background:var(--laranja)}
.cats-tit{padding-top:calc(var(--u)*8)}
.cats-tit h2{margin-top:calc(var(--u)*22);font-size:calc(var(--u)*42);font-weight:900;font-stretch:100%;line-height:1;text-transform:uppercase;letter-spacing:-.02em}
.cats-tit p{margin:calc(var(--u)*20) 0 calc(var(--u)*26);font-size:calc(var(--u)*15);max-width:calc(var(--u)*360)}
.catgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--u)*16)}
.ccard{aspect-ratio:1.41/1;border-radius:calc(var(--u)*8)}
.ccard img{opacity:.85}
.ccard::after{background:linear-gradient(180deg,transparent 35%,rgba(11,12,14,.9) 100%)}
.cc-in{padding:calc(var(--u)*16) calc(var(--u)*18)}
.cc-n,.cc-subs{display:none}
.ccard h3{font:700 calc(var(--u)*17.5)/1.1 'Inter',sans-serif;text-transform:none;font-stretch:100%;letter-spacing:-.01em}
.ccard h3 i{width:auto;height:auto;background:none;opacity:1;transform:none;color:var(--laranja-2)}
.ccard h3 svg{width:calc(var(--u)*22);height:calc(var(--u)*22);stroke-width:2.2}
.ccard:hover h3 i{transform:translateX(calc(var(--u)*4))}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVO
   ══════════════════════════════════════════════════════════════ */
@media (max-width:1060px){
 :root{--gut:calc(var(--u)*36)}
 .sel-escolha{grid-template-columns:1fr}
 .sel-manual{grid-column:1}
 .kgrid{grid-template-columns:repeat(2,1fr)}
 .bgrid{grid-template-columns:repeat(3,1fr)}
 .bn:nth-child(3){border-right:0}
 .bn:nth-child(n+4){border-top:1px solid var(--linha)}
 .pgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .mm-txt{display:none}
 .minhamoto-bt{padding:0 calc(var(--u)*6)}
 .minhamoto-bt .cv{display:none}
 .catgrid{grid-template-columns:repeat(2,1fr)}
 .ccard{aspect-ratio:16/9}
 .cat-corpo{grid-template-columns:1fr}
 /* filtros viram gaveta */
 .filtros{position:fixed;top:0;left:0;bottom:0;z-index:1100;width:min(calc(var(--u)*360),90%);max-height:none;background:#fff;padding:calc(var(--u)*18) calc(var(--u)*20) calc(var(--u)*90);
  transform:translateX(-102%);transition:transform .6s var(--mola);box-shadow:calc(var(--u)*20) 0 calc(var(--u)*60) calc(var(--u)*-20) rgba(0,0,0,.4)}
 .filtros.on{transform:none}
 .f-fecha{display:grid!important}
 .f-limpar{margin-left:auto;margin-right:calc(var(--u)*8)}
 .f-aplica{display:flex!important;position:fixed;left:calc(var(--u)*20);right:calc(var(--u)*20);bottom:calc(var(--u)*18)}
 .tb-filtro{display:inline-flex;padding:0 calc(var(--u)*14);height:calc(var(--u)*42);text-transform:none;letter-spacing:0;font:600 calc(var(--u)*13.5)/1 'Inter',sans-serif}
 .tb-filtro svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}
 .tb-filtro .badge{position:static;transform:scale(0);margin-left:-2px}
 .tb-filtro .badge.on{transform:scale(1)}
 .ativos{display:none}
 .toolbar .ordem{margin-left:auto}
 .ggrid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
 .gcard:first-child{grid-row:auto;grid-column:1/-1;min-height:calc(var(--u)*320)}
 .mgrid{grid-template-columns:repeat(3,1fr)}
 .mgrid .mcard:nth-child(10){display:none}
 .sm-foto{inset:0 35% 0 0}
 .sm-copy{width:min(calc(var(--u)*560),62%)}
 .news-in{grid-template-columns:1fr}
 .rodtop{grid-template-columns:repeat(4,1fr)}
 .rod-marca{grid-column:1/-1}
 .qv{grid-template-columns:1fr}
 .qv-foto{min-height:calc(var(--u)*320)}
}

/* ══ CELULAR — layout de app ═══════════════════════════════════
   Inspirado nas telas de referência: cabeçalho enxuto com a busca
   em pílula, hero escuro com a pílula "→ Encontrar peças", trilho de
   ícones de categoria, vitrine em 2 colunas, modais como folha que
   sobe de baixo e barra de abas fixa com o botão da moto no centro. */
@media (max-width:820px){
 :root{--u:calc(100vw / 375);--gut:calc(var(--u)*16);--hdr:calc(var(--u)*142);--topo:calc(var(--u)*112)}

 body{font-size:calc(var(--u)*14.5);padding-bottom:calc(var(--u)*84)}
 .topbar{height:calc(var(--u)*30)}
 .tb-trilho{justify-content:flex-start;gap:calc(var(--u)*40);height:calc(var(--u)*30);width:max-content;animation:letreiro 26s linear infinite;padding-left:calc(var(--u)*16)}
 @keyframes letreiro{to{transform:translateX(-50%)}}
 .tb-trilho span:nth-child(n+3){display:inline-flex}
 .navtop{flex-wrap:wrap;height:auto;gap:0 calc(var(--u)*6);padding:calc(var(--u)*8) 0 calc(var(--u)*10);row-gap:calc(var(--u)*8)}
 .nav.compact .navtop{height:auto}
 .burger{display:grid;margin-left:calc(var(--u)*-8)}
 .logo .mk{width:calc(var(--u)*32);height:calc(var(--u)*20)}
 .logo b{font-size:calc(var(--u)*21)}
 .logo small{font-size:calc(var(--u)*7.5);letter-spacing:.38em}
 .busca{order:5;flex:1 0 100%;max-width:none;margin:0;height:calc(var(--u)*46);border-radius:calc(var(--u)*14);background:var(--grafite-2);color:#fff;
  box-shadow:inset 0 0 0 1px var(--linha-esc)}
 .busca:focus-within{box-shadow:inset 0 0 0 1.5px var(--laranja)}
 .busca input{color:#fff;font-size:calc(var(--u)*15);padding-left:calc(var(--u)*44)}
 .busca .lupa{color:#9AA0A8}
 .bx-limpa{color:#9AA0A8}
 .bx-ir{width:calc(var(--u)*38);height:calc(var(--u)*38);padding:0;font-size:0;background:var(--laranja);border-radius:calc(var(--u)*11);display:grid;place-items:center}
 .bx-ir::before{content:'';width:calc(var(--u)*18);height:calc(var(--u)*18);background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h9M17 7h3M4 17h3M11 17h9'/%3E%3Ccircle cx='15' cy='7' r='2'/%3E%3Ccircle cx='9' cy='17' r='2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h9M17 7h3M4 17h3M11 17h9'/%3E%3Ccircle cx='15' cy='7' r='2'/%3E%3Ccircle cx='9' cy='17' r='2'/%3E%3C/svg%3E") center/contain no-repeat}
 .sugest{position:fixed;top:var(--sg-top,calc(var(--u)*142));left:calc(var(--u)*12);right:calc(var(--u)*12);max-height:calc(100vh - var(--sg-top,calc(var(--u)*142)) - calc(var(--u)*96));border-radius:calc(var(--u)*16)}
 .minhamoto-bt{margin-left:auto;height:calc(var(--u)*40);border-radius:calc(var(--u)*12);padding:0 calc(var(--u)*4);background:transparent;border:0}
 .mm-ico{width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:calc(var(--u)*10)}
 .navicons{margin-left:0}
 .esconde-m{display:none}
 .navcats{display:none}

 /* hero de app */
 .hero{height:calc(100svh - var(--hdr) - calc(var(--u)*8));min-height:calc(var(--u)*540);margin:0 calc(var(--u)*12);border-radius:calc(var(--u)*26);margin-top:calc(var(--u)*4)}
 .hero-foto{width:100%}
 .hero-foto img{width:100%;min-width:0;object-position:50% 40%}
 .hero-veu{background:linear-gradient(180deg,var(--preto) 0%,rgba(11,12,14,.82) 30%,transparent 50%,transparent 72%,rgba(11,12,14,.9) 100%)}
 .hero-foto img{object-position:50% 100%}
 /* como a tela 1 da referência: título em cima, moto no meio, pílula embaixo */
 .hero-in{align-items:stretch;padding:calc(var(--u)*66) calc(var(--u)*4) calc(var(--u)*96)}   /* a pílula fica acima da barra de abas */
 .hcopy{display:flex;flex-direction:column;width:100%}
 .hcopy h1{font-size:calc(var(--u)*42);line-height:.92}
 .hcopy > p{font-size:calc(var(--u)*14);margin-top:calc(var(--u)*12);max-width:calc(var(--u)*250);color:#AEB3BA}
 .hcopy .hpilula{margin-top:auto}
 .hbts{display:none}
 .hpilula{display:flex;align-items:center;height:calc(var(--u)*64);padding:calc(var(--u)*6);border-radius:calc(var(--u)*40);
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);backdrop-filter:blur(calc(var(--u)*10))}
 .hpilula i{width:calc(var(--u)*52);height:calc(var(--u)*52);border-radius:50%;display:grid;place-items:center;background:var(--laranja);
  box-shadow:0 calc(var(--u)*10) calc(var(--u)*24) calc(var(--u)*-8) rgba(242,100,25,.9);transition:transform .6s var(--mola)}
 .hpilula i svg{width:calc(var(--u)*22);height:calc(var(--u)*22);color:#fff}
 .hpilula span{flex:1;text-align:center;padding-right:calc(var(--u)*52);font:700 calc(var(--u)*14)/1 var(--display);font-stretch:115%;letter-spacing:.1em;text-transform:uppercase;color:#fff}
 .hpilula:active i{transform:translateX(calc(var(--u)*8))}
 .hoferta{position:absolute;top:calc(var(--u)*18);left:calc(var(--u)*18);right:auto;margin:0;font-size:calc(var(--u)*12);padding:calc(var(--u)*7) calc(var(--u)*12) calc(var(--u)*7) calc(var(--u)*10)}
 .hoferta .seta{display:none}
 .hero .kicker{font-size:calc(var(--u)*10.5);margin-bottom:calc(var(--u)*10)}

 .seletor{margin-top:calc(var(--u)*-34);padding:0 calc(var(--u)*12)}
 .seletor .wrap{width:100%}
 .sel-card{padding:calc(var(--u)*18) calc(var(--u)*16) calc(var(--u)*14);border-radius:calc(var(--u)*22)}
 .sel-tit h2{font-size:calc(var(--u)*16)}
 .sel-tit p{font-size:calc(var(--u)*12.5)}
 .sel-ico{width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:calc(var(--u)*12)}
 .sel-campos{grid-template-columns:1fr 1fr;gap:calc(var(--u)*8)}
 .sel-campos .sc:nth-child(2){grid-column:1/-1;order:-1}
 .sel-campos .sc:nth-child(1){order:-2;grid-column:1/-1}
 .sel-ir{grid-column:auto;min-height:calc(var(--u)*52);font-size:calc(var(--u)*12);padding:0 calc(var(--u)*12)}
 .sel-manual{text-align:center;font-size:calc(var(--u)*12.5)}
 .sel-salva{flex-wrap:wrap;gap:calc(var(--u)*12)}
 .ss-txt b{font-size:calc(var(--u)*18)}
 .ss-bts{width:100%}
 .ss-bts > *{flex:1;padding:calc(var(--u)*13) calc(var(--u)*10)}

 .sechd{margin-bottom:calc(var(--u)*18);align-items:center}
 .sechd h2{font-size:calc(var(--u)*22)}
 .sechd-p{display:none}
 .kicker{font-size:calc(var(--u)*10.5);margin-bottom:calc(var(--u)*8)}
 .cats{padding:calc(var(--u)*44) 0 calc(var(--u)*40)}
 .catchips{display:flex;gap:calc(var(--u)*10);overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--u)*-16) calc(var(--u)*18);padding:2px calc(var(--u)*16) calc(var(--u)*4)}
 .catchips::-webkit-scrollbar{display:none}
 .cchip{flex:none;display:grid;justify-items:center;gap:calc(var(--u)*7);width:calc(var(--u)*70);font-size:calc(var(--u)*11.5);font-weight:600;color:var(--tinta)}
 .cchip i{width:calc(var(--u)*62);height:calc(var(--u)*62);border-radius:calc(var(--u)*18);display:grid;place-items:center;background:var(--cinza);color:var(--tinta);
  transition:background .3s,color .3s,transform .45s var(--mola)}
 .cchip i svg{width:calc(var(--u)*26);height:calc(var(--u)*26)}
 .cchip:active i{transform:scale(.94)}
 .cchip:first-child i{background:var(--laranja);color:#fff}
 .catgrid{grid-template-columns:1fr 1fr;gap:calc(var(--u)*10)}
 .ccard{aspect-ratio:1/1.05;border-radius:calc(var(--u)*18)}
 .cc-in{padding:calc(var(--u)*14)}
 .ccard h3{font-size:calc(var(--u)*16)}
 .ccard h3 i{display:none}
 .cc-subs{display:none}
 .cc-n{font-size:calc(var(--u)*10.5);margin-bottom:calc(var(--u)*7)}

 .suamoto{min-height:0;flex-direction:column;align-items:stretch}
 .sm-foto{position:relative;inset:auto;height:calc(var(--u)*260)}
 .sm-foto::after{background:linear-gradient(180deg,transparent 40%,var(--preto))}
 .sm-in{padding:0 0 calc(var(--u)*48);margin-top:calc(var(--u)*-40)}
 .sm-copy{width:100%}
 .suamoto h2{font-size:calc(var(--u)*34)}
 .sm-nums{gap:calc(var(--u)*22);margin-top:calc(var(--u)*30)}
 .sm-nums b{font-size:calc(var(--u)*28)}
 .sm-cats button{padding:calc(var(--u)*9) calc(var(--u)*12);font-size:calc(var(--u)*13)}

 .ofertas{padding:calc(var(--u)*40) 0 0}
 .ofgrid{grid-template-columns:1fr;gap:calc(var(--u)*10)}
 .ofb{min-height:calc(var(--u)*230);border-radius:calc(var(--u)*20)}
 .ofb::before{background:linear-gradient(180deg,rgba(11,12,14,.2),rgba(11,12,14,.92) 75%)}
 .ofb{align-items:flex-end}
 .ofb-txt{padding:calc(var(--u)*22)}
 .ofb h3{font-size:calc(var(--u)*25)}
 .ofb p{margin:calc(var(--u)*8) 0 calc(var(--u)*16);font-size:calc(var(--u)*13.5)}
 .ofb .btn,.ofb .btn-o{padding:calc(var(--u)*12) calc(var(--u)*16);font-size:calc(var(--u)*12)}

 .catalogo{padding:calc(var(--u)*56) 0 calc(var(--u)*40)}
 .cat-hd{flex-direction:column;align-items:stretch;gap:calc(var(--u)*14);margin-bottom:calc(var(--u)*14)}
 .cat-hd h2{font-size:calc(var(--u)*30)}
 .cat-busca{width:100%}
 .chips{margin:0 calc(var(--u)*-16);padding:2px calc(var(--u)*16) calc(var(--u)*16);border-bottom:0}
 .chip{flex:none;height:calc(var(--u)*38);padding:0 calc(var(--u)*14);font-size:calc(var(--u)*13)}
 .cat-corpo{padding-top:calc(var(--u)*4)}
 .toolbar{gap:calc(var(--u)*8);position:sticky;top:calc(var(--topo) - 1px);z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(calc(var(--u)*12));
  margin:0 calc(var(--u)*-16) calc(var(--u)*14);padding:calc(var(--u)*10) calc(var(--u)*16);border-bottom:1px solid var(--linha)}
 .ordem span{display:none}
 .ordem select{height:calc(var(--u)*42);font-size:calc(var(--u)*13);padding-right:calc(var(--u)*32)}
 .vista{display:none}
 .pgrid{grid-template-columns:1fr 1fr;gap:calc(var(--u)*8)}
 .pcard{padding:calc(var(--u)*6) calc(var(--u)*6) calc(var(--u)*10);border-radius:calc(var(--u)*14)}
 .pcard:hover{transform:none;box-shadow:none;border-color:var(--linha)}
 .pc-foto{border-radius:calc(var(--u)*10)}
 .pc-quick{display:none}
 .pc-fav{width:calc(var(--u)*30);height:calc(var(--u)*30);top:calc(var(--u)*6);right:calc(var(--u)*6)}
 .pc-tags{top:calc(var(--u)*6);left:calc(var(--u)*6)}
 .pc-tag{font-size:calc(var(--u)*9);padding:calc(var(--u)*4) calc(var(--u)*6)}
 .pc-info{padding:calc(var(--u)*10) calc(var(--u)*4) 0}
 .pc-marca{font-size:calc(var(--u)*9.5)}
 .pc-nome{font-size:calc(var(--u)*13);margin-top:calc(var(--u)*4)}
 .pc-nota{font-size:calc(var(--u)*11);gap:calc(var(--u)*4);margin-top:calc(var(--u)*4)}
 .estrelas svg{width:calc(var(--u)*11);height:calc(var(--u)*11)}
 .cmp{font-size:calc(var(--u)*10.5);padding:calc(var(--u)*5) calc(var(--u)*7);margin-top:calc(var(--u)*8);gap:calc(var(--u)*5)}
 .cmp svg{width:calc(var(--u)*12);height:calc(var(--u)*12)}
 .pc-preco{margin-top:calc(var(--u)*10);margin-bottom:calc(var(--u)*10)}
 .pc-por b{font-size:calc(var(--u)*18)}
 .pc-por .off{display:none}
 .pc-parc{font-size:calc(var(--u)*11)}
 .pc-pix{font-size:calc(var(--u)*11)}
 .pc-comprar{padding:calc(var(--u)*11) calc(var(--u)*6);font-size:calc(var(--u)*11);border-radius:calc(var(--u)*9)}
 .pc-add{width:calc(var(--u)*40);border-radius:calc(var(--u)*9)}
 .mais{margin-top:calc(var(--u)*28)}

 .top{padding:calc(var(--u)*48) 0 calc(var(--u)*50)}
 .trilho-bts{display:none}
 .trilho{padding:calc(var(--u)*4) calc(var(--u)*16) calc(var(--u)*12);scroll-padding-inline:calc(var(--u)*16);gap:calc(var(--u)*10)}
 .trilho .pcard{flex-basis:70%;max-width:calc(var(--u)*280)}

 .kits{padding:calc(var(--u)*56) 0}
 .kgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(var(--u)*-16);padding:calc(var(--u)*4) calc(var(--u)*16) calc(var(--u)*12);gap:calc(var(--u)*10)}
 .kgrid::-webkit-scrollbar{display:none}
 .kcard{flex:0 0 84%;scroll-snap-align:start}
 .kcard:hover{transform:none}

 .marcas{padding:calc(var(--u)*56) 0}
 .mgrid{grid-template-columns:repeat(2,1fr)}
 .mgrid .mcard:nth-child(10){display:grid}
 .mcard{height:calc(var(--u)*84)}
 .mcard b{font-size:calc(var(--u)*20)}
 .mcard small{display:none}

 .garagem{padding:calc(var(--u)*56) 0}
 .garagem .sechd .link-t{display:none}
 .ggrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(var(--u)*-16);padding:calc(var(--u)*4) calc(var(--u)*16) calc(var(--u)*8);gap:calc(var(--u)*10)}
 .ggrid::-webkit-scrollbar{display:none}
 .gcard,.gcard:first-child{flex:0 0 78%;min-height:calc(var(--u)*300);scroll-snap-align:start}
 .gcard:first-child h3{font-size:calc(var(--u)*21)}

 .bgrid{grid-template-columns:1fr 1fr}
 .bn{padding:calc(var(--u)*18) calc(var(--u)*8);grid-template-columns:1fr;text-align:left;row-gap:calc(var(--u)*8);border-right:0!important;border-top:0!important;border-bottom:1px solid var(--linha)}
 .bn i{grid-row:auto;width:calc(var(--u)*42);height:calc(var(--u)*42)}
 .bn:nth-child(odd){border-right:1px solid var(--linha)!important;padding-right:calc(var(--u)*14)}
 .bn:nth-child(even){padding-left:calc(var(--u)*16)}
 .bn:last-child{grid-column:1/-1;border-right:0!important;border-bottom:0}
 .bn b{font-size:calc(var(--u)*12)}

 .news-in{padding:calc(var(--u)*60) 0}
 .news h2{font-size:calc(var(--u)*44)}
 .news-form{flex-direction:column;background:rgba(255,255,255,.06)}
 .news-form .btn{width:100%}

 .rod{padding-top:calc(var(--u)*48)}
 .rodtop{grid-template-columns:1fr 1fr;gap:calc(var(--u)*30) calc(var(--u)*20)}
 .rodbase{flex-direction:column;align-items:flex-start}

 .zap{bottom:calc(var(--u)*98);right:calc(var(--u)*16);width:calc(var(--u)*52);height:calc(var(--u)*52);transition:transform .5s var(--mola),opacity .3s}
 .no-topo .zap{opacity:0;transform:scale(.5);pointer-events:none}
 .zap svg{width:calc(var(--u)*27);height:calc(var(--u)*27)}
 .toast{bottom:calc(var(--u)*100);width:max-content;max-width:calc(100% - calc(var(--u)*32))}

 /* barra de abas */
 .tabbar{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;position:fixed;left:calc(var(--u)*10);right:calc(var(--u)*10);bottom:calc(calc(var(--u)*10) + env(safe-area-inset-bottom));
  z-index:850;height:calc(var(--u)*68);padding:0 calc(var(--u)*6);border-radius:calc(var(--u)*24);background:rgba(20,22,25,.94);backdrop-filter:blur(calc(var(--u)*16));
  box-shadow:0 calc(var(--u)*18) calc(var(--u)*40) calc(var(--u)*-12) rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.06);
  animation:sobe .9s var(--mola) 1s both}
 .tabbar a,.tabbar > button{position:relative;display:grid;justify-items:center;gap:calc(var(--u)*4);font-size:calc(var(--u)*10.5);font-weight:600;color:#8A9098;transition:color .3s}
 .tabbar svg{width:calc(var(--u)*22);height:calc(var(--u)*22)}
 .tabbar .on{color:var(--laranja-2)}
 .tabbar .badge{top:calc(var(--u)*-4);right:calc(50% - calc(var(--u)*22))}
 .tb-moto i{width:calc(var(--u)*58);height:calc(var(--u)*58);margin-top:calc(var(--u)*-26);border-radius:50%;display:grid;place-items:center;background:var(--laranja);color:#fff;
  box-shadow:0 calc(var(--u)*12) calc(var(--u)*26) calc(var(--u)*-8) rgba(242,100,25,.9),0 0 0 calc(var(--u)*6) var(--bg)}
 .tb-moto i svg{width:calc(var(--u)*27);height:calc(var(--u)*27)}
 .tb-moto.tem i{background:var(--verde);box-shadow:0 calc(var(--u)*12) calc(var(--u)*26) calc(var(--u)*-8) rgba(21,128,61,.8),0 0 0 calc(var(--u)*6) var(--bg)}

 /* modais viram folha de baixo */
 .modal{place-items:end stretch;padding:0}
 .md-caixa{width:100%!important;max-height:92svh;border-radius:calc(var(--u)*26) calc(var(--u)*26) 0 0;transform:translateY(100%);transition:transform .6s var(--mola),opacity .2s}
 .modal.on .md-caixa{transform:none}
 .md-alca{display:block;position:absolute;top:0;left:0;right:0;z-index:3;height:calc(var(--u)*22)}
 .md-alca::after{content:'';position:absolute;top:calc(var(--u)*9);left:50%;width:calc(var(--u)*44);height:calc(var(--u)*5);margin-left:calc(var(--u)*-22);border-radius:calc(var(--u)*3);background:#D0D4D9}
 .md-fecha{top:calc(var(--u)*14);right:calc(var(--u)*12);width:calc(var(--u)*36);height:calc(var(--u)*36)}
 .qv{display:block}
 .qv-foto{min-height:0;aspect-ratio:1/.85}
 .qv-foto img{width:74%}
 .qv-info{padding:calc(var(--u)*22) calc(var(--u)*18) calc(var(--u)*24)}
 .qv-info h3{font-size:calc(var(--u)*20)}
 .qv-preco .pc-por b{font-size:calc(var(--u)*28)}
 .qv-bts{position:sticky;bottom:0;background:#fff;margin:calc(var(--u)*18) calc(var(--u)*-18) calc(var(--u)*-24);padding:calc(var(--u)*12) calc(var(--u)*18) calc(calc(var(--u)*14) + env(safe-area-inset-bottom));
  border-top:1px solid var(--linha);grid-template-columns:1fr 1fr}
 .cp,.mm,.cm{padding:calc(var(--u)*26) calc(var(--u)*18) calc(calc(var(--u)*24) + env(safe-area-inset-bottom))}
 .mm-marcas{grid-template-columns:repeat(4,1fr)}
 .mm-marcas button{height:calc(var(--u)*46);font-size:calc(var(--u)*12)}
 .gav{width:100%}
 .filtros{width:100%;border-radius:0}
 /* ── home de app (referência: tela escura com destaques) ────────
    Substitui o hero no celular. Fundo contínuo com o cabeçalho. */
 .topbar{display:none}
 .burger,.minhamoto-bt{display:none}
 .so-m{display:grid}
 .navtop .navicons{margin-left:auto}
 .perfil-bt{width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:50%;border:1px solid rgba(255,255,255,.14);background:var(--grafite-2)}
 .perfil-bt svg{width:calc(var(--u)*19);height:calc(var(--u)*19)}
 .navtop{padding:calc(var(--u)*10) 0 calc(var(--u)*14)}
 .hero{display:none}
 .apphome{display:block;background:var(--preto);color:#fff;padding:calc(var(--u)*6) 0 calc(var(--u)*30);border-radius:0 0 calc(var(--u)*28) calc(var(--u)*28)}
 .ah-bloco{margin-top:calc(var(--u)*22)}
 .ah-bloco:first-child{margin-top:calc(var(--u)*10)}
 .ah-hd{display:flex;align-items:center;justify-content:space-between;padding:0 var(--gut);margin-bottom:calc(var(--u)*12)}
 .ah-hd h2{color:#fff;font:700 calc(var(--u)*19)/1.1 'Inter',sans-serif;letter-spacing:-.01em;text-transform:none;font-stretch:100%}
 .ah-mais{display:inline-flex;align-items:center;gap:calc(var(--u)*2);font-size:calc(var(--u)*13);font-weight:600;color:var(--laranja-2)}
 .ah-mais svg{width:calc(var(--u)*15);height:calc(var(--u)*15)}
 .ah-dest,.ah-cats,.ah-moto{display:flex;gap:calc(var(--u)*12);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  padding:0 var(--gut);scroll-padding-inline:var(--gut)}
 .ah-dest::-webkit-scrollbar,.ah-cats::-webkit-scrollbar,.ah-moto::-webkit-scrollbar{display:none}

 .ahd{position:relative;flex:0 0 78%;scroll-snap-align:start;border-radius:calc(var(--u)*22);overflow:hidden;background:var(--grafite-2);
  border:1px solid rgba(255,255,255,.06);animation:sobe .8s var(--mola) both}
 .ahd:nth-child(2){animation-delay:.08s}
 .ahd-foto{position:relative;aspect-ratio:1.5/1;background:#16181b;overflow:hidden}
 .ahd-foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform .8s var(--mola)}
 .ahd:active .ahd-foto img{transform:scale(1.13)}
 .ahd-foto::after{content:'';position:absolute;inset:auto 0 0;height:40%;background:linear-gradient(0deg,var(--grafite-2),transparent)}
 .ahd-foto .pc-tag{position:absolute;top:calc(var(--u)*12);left:calc(var(--u)*12);z-index:1}
 .ah-fav{position:absolute;top:calc(var(--u)*10);right:calc(var(--u)*10);z-index:2;width:calc(var(--u)*38);height:calc(var(--u)*38);border-radius:50%;display:grid;place-items:center;
  background:rgba(20,22,25,.55);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);color:#fff;transition:transform .45s var(--mola)}
 .ah-fav svg{width:calc(var(--u)*18);height:calc(var(--u)*18)}
 .ah-fav.on{color:#FF4D4D}
 .ah-fav.on svg{fill:currentColor}
 .ah-fav.pop{animation:pulo .5s var(--mola)}
 .ahd-info{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u)*10);padding:calc(var(--u)*4) calc(var(--u)*16) calc(var(--u)*16)}
 .ahd-info h3{color:#fff;font:700 calc(var(--u)*15.5)/1.25 'Inter',sans-serif;font-stretch:100%;letter-spacing:-.01em;text-transform:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 .ahd-info small{display:block;font-size:calc(var(--u)*12);color:#8A9098;margin-top:calc(var(--u)*3)}
 .ahd-info b{display:block;font:800 calc(var(--u)*17)/1 var(--display);color:var(--laranja-2);margin-top:calc(var(--u)*8)}
 .ahd-ir{width:calc(var(--u)*38);height:calc(var(--u)*38);border-radius:50%;display:grid;place-items:center;flex:none;background:var(--grafite-3);color:#fff}
 .ahd-ir svg{width:calc(var(--u)*17);height:calc(var(--u)*17)}

 .ahc{flex:0 0 calc(var(--u)*76);scroll-snap-align:start;height:calc(var(--u)*80);border-radius:calc(var(--u)*18);display:grid;place-items:center;align-content:center;gap:calc(var(--u)*8);
  background:var(--grafite-2);border:1px solid rgba(255,255,255,.06);color:#fff;font-size:calc(var(--u)*11.5);font-weight:600;
  transition:background .3s,transform .45s var(--mola)}
 .ahc svg{width:calc(var(--u)*26);height:calc(var(--u)*26);stroke-width:1.6}
 .ahc:active{transform:scale(.95);background:var(--laranja)}

 .ahm{position:relative;flex:0 0 40%;scroll-snap-align:start;border-radius:calc(var(--u)*18);overflow:hidden;background:var(--grafite-2);
  border:1px solid rgba(255,255,255,.06);padding-bottom:calc(var(--u)*12);text-align:left;color:#fff}
 .ahm-foto{aspect-ratio:1/1;background:#16181b;overflow:hidden}
 .ahm-foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.1)}
 .ahm .ah-fav{width:calc(var(--u)*32);height:calc(var(--u)*32);top:calc(var(--u)*8);right:calc(var(--u)*8)}
 .ahm .ah-fav svg{width:calc(var(--u)*15);height:calc(var(--u)*15)}
 .ahm h3{color:#fff;font:600 calc(var(--u)*12.5)/1.3 'Inter',sans-serif;text-transform:none;font-stretch:100%;letter-spacing:0;padding:calc(var(--u)*10) calc(var(--u)*10) 0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
 .ahm b{display:block;padding:calc(var(--u)*6) calc(var(--u)*10) 0;font:800 calc(var(--u)*14)/1 var(--display);color:var(--laranja-2)}
 .ahm-cta{display:flex;flex-direction:column;justify-content:center;gap:calc(var(--u)*6);padding:calc(var(--u)*16);background:linear-gradient(160deg,var(--laranja),#C94E0F);
  border:0;min-height:calc(var(--u)*200)}
 .ahm-cta i{width:calc(var(--u)*46);height:calc(var(--u)*46);border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.2);margin-bottom:calc(var(--u)*6)}
 .ahm-cta i svg{width:calc(var(--u)*24);height:calc(var(--u)*24)}
 .ahm-cta b{padding:0;font:800 calc(var(--u)*16)/1.15 var(--display);font-stretch:110%;color:#fff;text-transform:uppercase}
 .ahm-cta small{font-size:calc(var(--u)*12);color:#FFE2D1;line-height:1.35}

 .seletor{margin-top:calc(var(--u)*18)}
 .catchips{display:none}

 /* modelo de desktop → celular */
 .cats-in{display:block}
 .cats-tit{margin-bottom:calc(var(--u)*18)}
 .cats-tit h2{font-size:calc(var(--u)*28);margin-top:calc(var(--u)*12)}
 .cats-tit p{font-size:calc(var(--u)*13.5);margin:calc(var(--u)*12) 0 calc(var(--u)*16)}
 .catgrid{grid-template-columns:1fr 1fr;gap:calc(var(--u)*10)}
 .ccard{aspect-ratio:1/1.05;border-radius:calc(var(--u)*18)}
 .sel-escolha{grid-template-columns:1fr;gap:calc(var(--u)*14)}
 .sel-tit{border-right:0;padding-right:0}
 .sel-ico{width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:calc(var(--u)*12)}
 .sel-ico svg{width:calc(var(--u)*24);height:calc(var(--u)*24)}
 .sel-tit h2{font-size:calc(var(--u)*16)}
 .sel-campos{grid-template-columns:1fr 1fr;gap:calc(var(--u)*8)}
 .sel-ir{min-height:calc(var(--u)*52);font-size:calc(var(--u)*12)}
 .sel-manual{display:block}
 .sc{padding:calc(var(--u)*9) calc(var(--u)*38) calc(var(--u)*8) calc(var(--u)*14);border-radius:calc(var(--u)*11)}
}