/* Odair, vendedor Honda. Folha única, mobile primeiro. */
@font-face{font-family:'Barlow Condensed';src:url(assets/barlow-condensed-700.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(assets/manrope-var.woff2) format('woff2');font-weight:200 800;font-style:normal;font-display:swap}

:root{
  --asfalto:#1C1F25;      /* fundos escuros */
  --asfalto-2:#272B33;
  --painel:#0D0E11;       /* painel do odômetro */
  --vermelho:#D0101B;     /* ação e destaque */
  --vermelho-escuro:#A70C15;
  --branco:#FFFFFF;
  --piso:#EDEEF0;         /* fundo claro, piso do salão */
  --tinta:#15171B;        /* texto sobre claro */
  --grafite:#5B6068;      /* texto secundário */
  --linha:#D6D8DC;
  --verde:#1E8E3E;
  --display:'Barlow Condensed','Arial Narrow',Arial,sans-serif;
  --texto:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --curva:cubic-bezier(.2,.75,.2,1);
  --raio:12px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:94px;-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.6 var(--texto);color:var(--tinta);background:var(--branco);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,figure,blockquote,dl,dd,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit;color:inherit}
.wrap{width:min(1200px,calc(100% - 32px));margin-inline:auto}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.ico{width:20px;height:20px;flex:none}
:focus-visible{outline:3px solid var(--vermelho);outline-offset:3px;border-radius:4px}
.pular{position:absolute;left:12px;top:-60px;z-index:100;background:var(--branco);color:var(--tinta);padding:10px 14px;font-weight:700;border-radius:6px}
.pular:focus{top:12px}
.sem-js{margin-top:20px;font-size:15px}

/* Títulos */
h1,h2{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:-.005em;line-height:.92}
h2{font-size:clamp(40px,8.6vw,76px)}
.cabeca{display:grid;gap:14px;margin-bottom:32px;max-width:720px}
.cabeca p{color:var(--grafite);font-size:17px;max-width:560px}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:14px 22px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent;transition:background-color .2s,color .2s,border-color .2s,transform .2s var(--curva)}
.btn:active{transform:scale(.98)}
.btn-vermelho{background:var(--vermelho);color:var(--branco)}
.btn-vermelho:hover{background:var(--vermelho-escuro)}
.btn-escuro{background:var(--asfalto);color:var(--branco)}
.btn-escuro:hover{background:#000}
.btn-branco{background:var(--branco);color:var(--vermelho)}
.btn-branco:hover{background:#f1f1f1}
.btn-contorno{border-color:var(--tinta);color:var(--tinta);min-height:48px;padding:10px 18px;font-size:14px}
.btn-contorno:hover{background:var(--tinta);color:var(--branco)}
.btn-largo{width:100%}

/* Topo */
.topo{position:sticky;top:0;z-index:40;background:rgba(28,31,37,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--branco)}
/* Estrada do topo: a moto anda conforme a página rola */
.estrada-topo{position:relative;height:22px;overflow:hidden}
.estrada-topo::before{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;background:repeating-linear-gradient(90deg,#4A505A 0 12px,transparent 12px 22px)}
.rastro{position:absolute;left:0;bottom:3px;height:2px;width:0;background:var(--vermelho)}
.moto-topo{position:absolute;left:0;bottom:3px;width:27px;height:auto;color:var(--branco);will-change:transform}
.topo-linha{display:flex;align-items:center;gap:16px;height:60px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Logo: velocímetro + nome */
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--branco)}
.marca .simbolo{width:38px;height:38px;flex:none}
.marca-nome{height:22px;width:auto;display:block}
.logo-grande{display:flex;align-items:center;gap:.14em;font-size:clamp(76px,22vw,132px);line-height:1}
.logo-grande .simbolo{width:1.02em;height:1.02em;flex:none}
.logo-nome{display:block;height:.62em;width:auto}
.logo-linha{display:block;height:max(3px,.03em);background:var(--vermelho);margin-top:.11em;border-radius:2px}
.ponteiro{transform-box:view-box;transform-origin:60px 60px}
.marca-sub{display:none;font-size:13px;color:#AEB3BB;border-left:1px solid #3A3F48;padding-left:16px}
.menu{display:none}
.btn-wa-topo{margin-left:auto;min-height:40px;padding:8px 16px;font-size:14px;background:var(--vermelho);color:var(--branco)}
.btn-wa-topo:hover{background:var(--vermelho-escuro)}

/* Hero */
.hero{background:var(--asfalto);color:var(--branco);overflow:hidden}
.hero-grade{display:grid;gap:28px;padding:36px 0 40px}
.hero-texto{order:1}.hero-foto{order:2}.painel{order:3}
.hero h1{font-size:clamp(26px,6.4vw,44px);line-height:1;margin-top:22px;max-width:15em}
.hero-lead{margin-top:12px;font-size:18px;line-height:1.5;color:#C9CDD3;max-width:520px}
.hero-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:26px}
.link-claro{font-weight:700;font-size:15px;text-underline-offset:6px;text-decoration-thickness:2px;text-decoration-color:var(--vermelho)}
.hero-foto{position:relative;margin-bottom:18px}
.hero-quadro{position:relative;border-radius:var(--raio);overflow:hidden;aspect-ratio:4/5;background:#343A31}
.hero-quadro>img{width:100%;height:100%;object-fit:cover;object-position:50% 10%}
.hero-quadro::after,.sobre-fotos figure::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
.hero-quadro figcaption{position:absolute;left:0;right:0;top:0;padding:16px 18px 40px;font-size:13px;font-weight:600;letter-spacing:.01em;background:linear-gradient(rgba(0,0,0,.55),transparent)}

/* Odômetro: o momento principal da página */
.painel{background:var(--painel);border:1px solid #30353E;border-radius:16px;padding:20px 18px 18px;box-shadow:inset 0 1px 0 #ffffff12}
.odo{display:flex;align-items:center;gap:5px;font:700 clamp(58px,17vw,104px)/1 var(--display)}
.odo-mais{color:var(--vermelho);font-size:.62em;margin-right:4px}
.tambor{position:relative;width:.62em;height:1.06em;overflow:hidden;border-radius:6px;background:#1B1D22;box-shadow:inset 0 0 0 1px #000}
.tambor::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(#000c,transparent 26%,transparent 74%,#000c)}
.tambor-ultimo{background:var(--vermelho)}
.rolo{display:flex;flex-direction:column;transform:translateY(calc(var(--d) * -1.06em));will-change:transform}
.rolo span{height:1.06em;display:grid;place-items:center;color:#F4F4F4}
.odo-unidade{font:700 15px/1 var(--texto);color:#8E949E;margin-left:8px;align-self:flex-end;padding-bottom:12px}
.odo-legenda{margin-top:12px;font-size:14px;color:#AEB3BB;max-width:440px}

/* Vitrine: cartas */
.vitrine{background:var(--piso);padding:72px 0 80px}
.baralho-controles{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.ordenar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ordenar-rotulo{font-size:14px;color:var(--grafite);margin-right:4px;width:100%}
.ordenar button{border:1.5px solid var(--linha);background:var(--branco);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.ordenar button[aria-pressed="true"]{background:var(--asfalto);border-color:var(--asfalto);color:var(--branco)}
.setas{display:none;align-items:center;gap:10px}
.contador{font-size:14px;color:var(--grafite);min-width:52px;text-align:right;font-variant-numeric:tabular-nums}
.seta{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--tinta);background:transparent;display:grid;place-items:center;cursor:pointer;transition:background-color .2s,color .2s}
.seta svg{width:22px;height:22px}
.seta:hover:not(:disabled){background:var(--tinta);color:var(--branco)}
.seta:disabled{opacity:.3;cursor:default}

.baralho{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:6px 16px 22px;scroll-padding-inline:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.baralho::-webkit-scrollbar{display:none}
.baralho:focus-visible{outline-offset:-3px}
.carta{flex:0 0 min(82vw,318px);scroll-snap-align:start}
.carta article{height:100%;display:flex;flex-direction:column;background:var(--branco);border:7px solid var(--asfalto);border-radius:18px;padding:12px 14px 16px;box-shadow:0 10px 28px rgba(21,23,27,.12)}
.carta-mestra article{border-color:var(--vermelho)}
.carta-topo{display:flex;align-items:center;justify-content:space-between;gap:10px}
.carta-pos{display:inline-flex;align-items:baseline;gap:6px;background:var(--asfalto);color:var(--branco);border-radius:8px;padding:4px 9px;font-size:12px;font-weight:600}
.carta-pos b{font:700 22px/1 var(--display)}
.carta-mestra .carta-pos{background:var(--vermelho)}
.carta-tipo{font-size:13px;font-weight:600;color:var(--grafite)}
.carta-selo{margin-top:10px;font-size:12px;font-weight:700;color:var(--vermelho)}
.carta-foto{position:relative;margin:10px -2px 4px;aspect-ratio:16/10;border-radius:10px;background:linear-gradient(160deg,#F6F7F8,#E3E5E9);overflow:hidden;display:grid;place-items:center}
.carta-foto img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transform:scale(1.14)}
.carta-fundo{position:absolute;inset:auto 8px 2px;font:700 54px/.9 var(--display);text-transform:uppercase;color:#0000;-webkit-text-stroke:1.2px #C9CCD2;white-space:nowrap;overflow:hidden}
.carta.sem-imagem .carta-foto img{display:none}
.carta.sem-imagem .carta-fundo{inset:auto;position:static;color:var(--asfalto);-webkit-text-stroke:0;font-size:46px;white-space:normal;text-align:center;padding:0 10px}
.carta.sem-imagem .carta-nome{display:none}
.carta-nome{font:700 32px/1 var(--display);text-transform:uppercase;margin-top:8px}
.carta-para{font-size:14px;color:var(--grafite);line-height:1.45;margin-top:6px;min-height:2.9em}
.carta-atributos{margin-top:12px;border-top:1px solid var(--linha)}
.carta-atributos div{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px 6px 10px;border-bottom:1px solid var(--linha);transition:background-color .25s}
.carta-atributos dt{font-size:13px;color:var(--grafite)}
.carta-atributos dd{font-size:13px;color:var(--grafite)}
.carta-atributos dd b{font:700 21px/1 var(--display);color:var(--tinta);margin-right:3px}
.carta-atributos div::after{content:"";position:absolute;left:6px;bottom:3px;height:3px;width:calc((100% - 12px) * var(--p,0));background:var(--vermelho);border-radius:2px;opacity:.85}
.carta-atributos div.ativo{background:#FCE9EA}
.carta-atributos .sem-barra::after{display:none}
.carta .btn{margin-top:16px;min-height:50px;font-size:15px}
.fonte{font-size:12px;color:var(--grafite);margin-top:4px}

.outras{margin-top:48px;padding-top:32px;border-top:1px solid var(--linha)}
.outras h3{font:700 30px/1 var(--display);text-transform:uppercase}
.outras p{color:var(--grafite);margin-top:8px;font-size:15px}
.outras ul{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.outras a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 16px;border-radius:999px;background:var(--branco);border:1.5px solid var(--linha);text-decoration:none;font-weight:600;font-size:14px;transition:border-color .2s,background-color .2s}
.outras a:hover{border-color:var(--tinta)}
.outras a .ico{width:16px;height:16px;color:var(--verde)}

/* Monte sua mensagem */
.monte{padding:80px 0}
.monte-grade{display:grid;gap:36px}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font:700 24px/1 var(--display);text-transform:uppercase;margin-bottom:12px;padding:0}
.campo{display:block;margin-top:14px;max-width:440px}
.campo[hidden]{display:none}
.campo>span{display:block;font-size:14px;font-weight:600;color:var(--grafite)}
.campo input,.campo textarea{display:block;width:100%;margin:0;padding:10px 0 8px;border:0;border-bottom:1px solid #B9BDC4;border-radius:0;-webkit-appearance:none;appearance:none;background:transparent;font:16px/1.45 var(--texto);color:var(--tinta);caret-color:var(--vermelho);resize:none;transition:border-color .18s}
.campo input::placeholder,.campo textarea::placeholder{color:#8A9099}
.campo input:focus,.campo textarea:focus{outline:0;padding-bottom:6px;border-bottom:3px solid var(--vermelho)}
[hidden]{display:none!important}
.passos{margin-top:4px}
.passo-topo{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:44px;border-bottom:1px solid var(--linha)}
.passo-topo::after{content:"";position:absolute;left:0;bottom:-1px;height:3px;width:calc(var(--feito,0) * 100%);background:var(--vermelho);transition:width .35s var(--curva)}
.passo-conta{font-size:14px;font-weight:600;color:var(--grafite);font-variant-numeric:tabular-nums}
.passo-link{border:0;background:none;min-height:44px;padding:8px 0 8px 16px;font-size:15px;font-weight:700;color:var(--tinta);cursor:pointer;text-decoration:underline;text-decoration-color:var(--vermelho);text-decoration-thickness:2px;text-underline-offset:6px}
.passo-titulo{font:700 clamp(30px,7.6vw,40px)/1 var(--display);text-transform:uppercase;letter-spacing:-.005em;margin:24px 0 8px}
.passo-titulo:focus{outline:0}
.passo-corpo{display:grid}
.passo-corpo.entra{animation:passo .24s var(--curva)}
@keyframes passo{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.opcao{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:62px;margin:0;padding:12px 2px 12px 0;border:0;border-bottom:1px solid var(--linha);background:none;text-align:left;color:var(--tinta);cursor:pointer}
.opcao-texto{display:grid;gap:2px}
.opcao-nome{font:700 27px/1 var(--display);text-transform:uppercase;letter-spacing:.005em}
.opcao-dica{font-size:14px;color:var(--grafite);margin-top:3px}
.com-fotos .opcao{min-height:92px;padding:6px 0}
.opcao-foto{width:128px;height:82px;object-fit:contain;flex:none;margin-left:auto}
.opcao.com-foto .seta-op{margin-left:-8px}
.seta-op{width:22px;height:22px;flex:none;color:var(--vermelho)}
.opcao:active .opcao-nome{color:var(--vermelho-escuro)}
@media (hover:hover){.opcao:hover .opcao-nome{color:var(--vermelho-escuro)}.passo-link:hover{color:var(--vermelho-escuro)}}
.opcao[aria-pressed="true"] .opcao-nome{color:var(--vermelho-escuro)}
.opcao:focus-visible{outline:3px solid var(--vermelho);outline-offset:2px}
.passo-corpo .campo{margin:6px 0 0;max-width:none}
.passo-continuar{justify-self:start;margin:18px 0 10px}
.passo-fim{font-size:16px;color:var(--grafite);max-width:440px}
.passo-fim+.campo{margin-top:18px}
.passo-recomecar{justify-self:start;padding-left:0;margin-top:14px}
.balao .nova{border-radius:3px;animation:frase 1.6s var(--curva)}
@keyframes frase{from{background:#FFE7A3}to{background:transparent}}
.conversa{align-self:start;background:var(--piso);padding:16px}
.conversa-topo{display:flex;align-items:center;gap:12px;padding:4px 4px 14px;border-bottom:1px solid var(--linha)}
.conversa-topo img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 8%}
.conversa-topo strong{display:block;font-size:16px}
.conversa-topo span{font-size:13px;color:var(--grafite)}
.conversa-corpo{display:flex;justify-content:flex-end;padding:22px 4px;min-height:170px;align-items:flex-start}
.balao{position:relative;max-width:92%;background:var(--branco);border-radius:16px 16px 4px 16px;padding:13px 15px;font-size:15px;line-height:1.5;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.balao.mudou{animation:balao .32s var(--curva)}
@keyframes balao{from{transform:translateY(4px);opacity:.55}to{transform:none;opacity:1}}
.conversa-nota{font-size:12px;color:var(--grafite);text-align:center;margin-top:10px}

/* Sobre */
.sobre{background:var(--asfalto);color:var(--branco);padding:80px 0}
.sobre-grade{display:grid;gap:40px}
.sobre-texto>p{color:#C9CDD3;font-size:17px;margin-top:18px;max-width:560px}
.sobre blockquote{margin-top:26px;padding-left:18px;border-left:4px solid var(--vermelho)}
.sobre blockquote p{font:700 clamp(30px,7vw,46px)/1.02 var(--display);max-width:560px}
.tracos{margin-top:28px;display:grid;gap:12px;max-width:560px}
.tracos li{padding:14px 0 2px;border-top:1px solid #3A3F48;color:#C9CDD3;font-size:16px}
.tracos strong{display:block;color:var(--branco);font:700 26px/1 var(--display);text-transform:uppercase;margin-bottom:4px}
.sobre-fotos{display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:auto auto;gap:10px}
.sobre-fotos figure{position:relative;border-radius:var(--raio);overflow:hidden;background:#2B2F36}
.sobre-fotos img{width:100%;height:100%;object-fit:cover}
.foto-moto{grid-row:span 2;aspect-ratio:744/1080}
.foto-moto img{object-position:50% 20%}
.foto-mesa{aspect-ratio:1/1}
.foto-mesa img{object-position:50% 22%}
.foto-joia{aspect-ratio:1/1}
.foto-joia img{object-position:40% 16%}

/* Prêmio: a linha de chegada no fim do "Sobre" */
.chegada{display:block;height:16px;margin-top:72px;background:conic-gradient(var(--branco) 25%,transparent 0 50%,var(--branco) 0 75%,transparent 0) 0 0/16px 16px}
.premio{display:grid;gap:20px;padding-top:30px}
.premio-rotulo{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#AEB3BB;margin-bottom:12px}
.premio h3{font:700 clamp(42px,11vw,84px)/.94 var(--display);text-transform:uppercase;letter-spacing:-.005em;max-width:12em;text-wrap:balance}
.premio-texto p{color:#C9CDD3;font-size:17px;max-width:440px}
.premio-texto .link-claro{display:inline-block;margin-top:18px;padding:6px 0}

/* Processo: a estrada */
.processo{padding:80px 0;background:var(--piso)}
.estrada{position:relative;display:grid;gap:30px;padding-left:46px}
.estrada::before{content:"";position:absolute;left:12px;top:6px;bottom:6px;width:12px;border-radius:6px;background:var(--asfalto)}
.estrada::after{content:"";position:absolute;left:17px;top:14px;bottom:14px;width:2px;background:repeating-linear-gradient(var(--branco) 0 12px,transparent 12px 24px)}
.estrada li{position:relative}
.marco{position:absolute;left:-46px;top:-2px;z-index:1;width:36px;height:36px;border-radius:50%;background:var(--vermelho);color:var(--branco);display:grid;place-items:center;font:700 20px/1 var(--display);box-shadow:0 0 0 4px var(--piso)}
.estrada h3{font:700 26px/1 var(--display);text-transform:uppercase;padding-top:4px}
.estrada p{color:var(--grafite);margin-top:8px;max-width:420px}

/* Dúvidas */
.duvidas{padding:80px 0}
.duvidas-grade{display:grid;gap:28px}
.lista-duvidas{border-top:1px solid var(--linha)}
details{border-bottom:1px solid var(--linha)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-weight:700;font-size:17px}
summary::-webkit-details-marker{display:none}
summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--tinta),var(--tinta)) center/14px 2px no-repeat,linear-gradient(var(--tinta),var(--tinta)) center/2px 14px no-repeat;transition:transform .25s var(--curva)}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 22px;color:var(--grafite);max-width:640px}

/* Loja */
.loja{background:var(--piso);padding:80px 0}
.loja-grade{display:grid;gap:32px}
.loja address{font-style:normal;margin-top:22px;font-size:17px;line-height:1.6}
.loja address strong{display:block;font-size:18px}
.loja-dica{margin-top:14px;font-weight:700}
.loja-acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.horario{background:var(--branco);border-radius:18px;padding:22px;border:1px solid var(--linha);align-self:start}
.status{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;margin-bottom:14px}
.status::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--grafite)}
.status.aberto::before{background:var(--verde);box-shadow:0 0 0 4px #1E8E3E26}
.status.fechado::before{background:var(--vermelho)}
.horario dl div{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--linha)}
.horario dt{color:var(--grafite)}
.horario dd{font-weight:700;font-variant-numeric:tabular-nums}
.horario div.hoje dt,.horario div.hoje dd{color:var(--tinta)}
.horario div.hoje dt::after{content:" (hoje)";font-weight:600}
.horario-nota{font-size:13px;color:var(--grafite);margin-top:12px}

/* Final */
.final{background:var(--vermelho);color:var(--branco);padding:72px 0}
.final-grade{display:grid;gap:26px}
.final h2{font-size:clamp(54px,15vw,132px)}
.final-acoes p{font-size:18px;margin-bottom:18px}
.final .btn-branco{width:100%;max-width:380px}
.fone{display:inline-block;margin-top:18px;font:700 28px/1 var(--display);letter-spacing:.01em;text-decoration:none}
.final :focus-visible{outline-color:var(--branco)}

/* Rodapé */
.rodape{background:var(--asfalto);color:#AEB3BB;padding:32px 0 110px;font-size:13px}
.rodape-grade{display:grid;gap:18px}
.rodape strong{color:var(--branco)}
.rodape p{margin-top:6px;max-width:460px;line-height:1.55}
.rodape a{color:var(--branco);font-weight:600}
.credito{color:#8E949E}
.credito p{margin-top:0}
.credito p+p{margin-top:6px}
.credito a{color:var(--branco);text-underline-offset:4px;text-decoration-color:var(--vermelho)}
.credito span{color:#5B6068;margin:0 4px}


/* Tablet e desktop */
@media (min-width:700px){
  .wrap{width:min(1200px,calc(100% - 64px))}
  .marca-sub{display:block}
  .hero-grade{grid-template-columns:1.15fr .85fr;grid-template-areas:". foto" "texto foto" "painel foto" ". foto";grid-template-rows:1fr auto auto 1fr;column-gap:48px;row-gap:0;padding:64px 0 72px}
  .painel{margin-top:40px}
  .hero-texto{grid-area:texto;align-self:center}
  .hero-foto{grid-area:foto;height:100%;min-height:560px;margin-bottom:0}
  .hero-quadro{aspect-ratio:auto;height:100%}
    .painel{grid-area:painel}
  .ordenar-rotulo{width:auto}
  .setas{display:flex}
  .baralho{margin-inline:0;padding-inline:0;scroll-padding-inline:0}
  .carta{flex-basis:300px}
  .monte-grade{grid-template-columns:1.25fr .9fr;gap:56px;align-items:start}
  .conversa{position:sticky;top:106px}
  .sobre-grade{grid-template-columns:1fr 1fr;gap:56px;align-items:center}
  .chegada{margin-top:96px}
  .premio{grid-template-columns:1.3fr .7fr;gap:56px;align-items:end;padding-top:44px}
  .estrada{grid-template-columns:repeat(4,1fr);gap:28px;padding:62px 0 0}
  .estrada::before{left:0;right:0;top:12px;bottom:auto;width:auto;height:12px}
  .estrada::after{left:8px;right:8px;top:17px;bottom:auto;width:auto;height:2px;background:repeating-linear-gradient(90deg,var(--branco) 0 14px,transparent 14px 28px)}
  .marco{left:0;top:-62px}
  .duvidas-grade{grid-template-columns:.8fr 1.2fr;gap:56px}
  .loja-grade{grid-template-columns:1.2fr .8fr;gap:56px}
  .final-grade{grid-template-columns:1.2fr .8fr;align-items:end;gap:48px}
  .rodape{padding-bottom:36px}
  .rodape-grade{grid-template-columns:1.4fr auto auto;align-items:end;gap:40px}
}
@media (min-width:1000px){
  .menu{display:flex;gap:26px;margin-left:auto;font-size:14px;font-weight:600}
  .menu a{text-decoration:none;color:#C9CDD3}
  .menu a:hover{color:var(--branco)}
  .btn-wa-topo{margin-left:12px}
  .hero-foto{min-height:640px}
  .painel{display:flex;align-items:center;gap:28px;padding:22px 26px}
  .odo-legenda{margin-top:0;max-width:260px}
}

/* Entrada da página: uma sequência só, no topo */
@media (prefers-reduced-motion:no-preference){
  .js .hero-texto>*{animation:subir .7s var(--curva) both}
  .js .hero-texto>*:nth-child(2){animation-delay:.08s}
  .js .hero-texto>*:nth-child(3){animation-delay:.16s}
  .js .hero-quadro{animation:revelar .9s var(--curva) .1s both}
  .js   .js .logo-grande .ponteiro{animation:ponteiro 1.7s cubic-bezier(.3,.7,.2,1) .25s both}
  @keyframes ponteiro{0%{transform:rotate(-194.4deg)}62%{transform:rotate(9deg)}80%{transform:rotate(-3deg)}100%{transform:none}}
  @keyframes subir{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
  @keyframes revelar{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Alta cilindrada: preto e dourado */
.premium{--ouro:#C9A45C;--ouro-claro:#E6CD92;--creme:#F3EFE6;--cinza-quente:#9E968A;background:#0B0B0C;color:var(--creme);padding:84px 0 88px;border-top:1px solid #1E1C18}
.premium[hidden]{display:none}
.premium-cabeca h2{color:var(--creme)}
.premium-cabeca h2::after{content:"";display:block;width:64px;height:3px;margin-top:18px;background:linear-gradient(90deg,var(--ouro-claro),var(--ouro))}
.premium-cabeca p{color:var(--cinza-quente)}
.premium-controles{justify-content:space-between}
.premium-dica{font-size:14px;color:var(--cinza-quente)}
.setas-ouro{margin-left:auto}
.setas-ouro .seta{border-color:var(--ouro);color:var(--ouro-claro)}
.setas-ouro .seta:hover:not(:disabled){background:var(--ouro);color:#0B0B0C}
.setas-ouro .contador{color:var(--cinza-quente)}
.vitrine-premium{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:6px 16px 22px;scroll-padding-inline:16px;scrollbar-width:none}
.vitrine-premium::-webkit-scrollbar{display:none}
.vitrine-premium:focus-visible{outline:2px solid var(--ouro);outline-offset:-2px}
.pcarta{flex:0 0 min(86vw,520px);scroll-snap-align:start}
.pcarta article{height:100%;display:flex;flex-direction:column;background:linear-gradient(165deg,#19181B 0%,#0F0F11 60%);border:1px solid #2C2820;border-radius:20px;padding:20px 20px 22px;position:relative;overflow:hidden}
.pcarta article::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--ouro),transparent);opacity:.7}
.pcarta-topo{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pcarta-tipo{font-size:13px;font-weight:700;color:var(--ouro-claro);letter-spacing:.02em}
.pcarta-selo{font-size:12px;font-weight:600;color:var(--cinza-quente);border:1px solid #3A352B;border-radius:999px;padding:4px 10px}
.pcarta-foto{position:relative;margin:14px -4px 6px;aspect-ratio:16/10;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:radial-gradient(ellipse at 50% 70%,#24221E 0%,#121214 70%)}
.pcarta-cc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 clamp(84px,26vw,150px)/.9 var(--display);color:transparent;-webkit-text-stroke:1px #3A352B;letter-spacing:-.01em;user-select:none}
.pcarta-cc small{font:700 .18em/1 var(--texto);letter-spacing:.2em;-webkit-text-stroke:0;color:#3A352B;margin-top:.4em}
.pcarta-foto img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(0,0,0,.55))}
.pcarta.sem-imagem .pcarta-foto img{display:none}
.pcarta.sem-imagem .pcarta-cc{-webkit-text-stroke:0;background:linear-gradient(180deg,var(--ouro-claro),var(--ouro) 55%,#8C6F36);-webkit-background-clip:text;background-clip:text}
.pcarta.sem-imagem .pcarta-cc small{color:var(--ouro)}
.pcarta-nome{font:700 40px/1 var(--display);text-transform:uppercase;color:var(--creme);margin-top:10px}
.pcarta-completo{font-size:13px;color:var(--cinza-quente);margin-top:6px}
.pcarta-specs{display:grid;grid-template-columns:repeat(3,1fr);margin-top:18px;border-top:1px solid #2C2820;border-bottom:1px solid #2C2820}
.pcarta-specs div{padding:14px 0 12px;text-align:left}
.pcarta-specs div+div{padding-left:14px;border-left:1px solid #2C2820}
.pcarta-specs dt{font-size:12px;color:var(--cinza-quente)}
.pcarta-specs dd{margin-top:4px;font:700 28px/1 var(--display);color:var(--ouro-claro)}
.pcarta-specs dd small{font:600 12px var(--texto);color:var(--cinza-quente);margin-left:3px}
.pcarta-cambio{font-size:13px;color:var(--cinza-quente);margin-top:12px}
.btn-ouro{margin-top:18px;background:linear-gradient(180deg,var(--ouro-claro),var(--ouro));color:#16130D;min-height:52px}
.btn-ouro:hover{filter:brightness(1.06)}
.premium :focus-visible{outline-color:var(--ouro-claro)}
.premium-mais{margin-top:30px;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.premium-mais p{color:var(--cinza-quente);font-size:14px;margin-right:4px}
.premium-mais ul{display:flex;flex-wrap:wrap;gap:8px}
.premium-mais a{display:inline-flex;align-items:center;min-height:42px;padding:8px 15px;border-radius:999px;border:1px solid #3A352B;color:var(--creme);text-decoration:none;font-size:14px;font-weight:600;transition:border-color .2s,color .2s}
.premium-mais a:hover{border-color:var(--ouro);color:var(--ouro-claro)}
.fonte-premium{color:var(--cinza-quente);margin-top:22px}
.menu-premium{color:var(--ouro-claro,#E6CD92)!important}
@media (min-width:700px){
  .vitrine-premium{margin-inline:0;padding-inline:0;scroll-padding-inline:0}
  .pcarta{flex-basis:480px}
  .premium-dica{display:none}
}

/* Carrosséis sem corte seco: à direita vão até a beira da tela e somem num esfumado;
   à esquerda, o esfumado só aparece depois que a pessoa passa a primeira carta. */
.vitrine,.premium{overflow-x:clip}
.baralho,.vitrine-premium{--fade-esq:0px;--fade-dir:28px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--fade-esq),#000 calc(100% - var(--fade-dir)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--fade-esq),#000 calc(100% - var(--fade-dir)),transparent 100%)}
.baralho.rolou,.vitrine-premium.rolou{--fade-esq:28px}
@media (min-width:700px){
  .baralho,.vitrine-premium{margin-right:calc(50% - 50vw);padding-right:calc(50vw - 50%);--fade-dir:120px}
  .baralho.rolou,.vitrine-premium.rolou{--fade-esq:48px}
}